2013年5月21日 星期二

[Android] Dynamically generate a table layout and scroll

When we have to show a result of uncertain amount of records, it is reasonable to generate the table dynamically. Since the count might be large, scrolling is a way to present it.
Here is an example.

To scroll, we put ScrollView and HorizontalScrollView outside our table layout in the main_activity.xml.
<scrollview 
    android:layout_alignleft="@+id/textView2" 
    android:layout_below="@+id/buttonDisc"
    android:layout_height="wrap_content" 
    android:layout_marginleft="14dp" 
    android:layout_margintop="47dp" 
    android:layout_width="wrap_content">
<horizontalscrollview android:layout_height="wrap_content" android:layout_width="wrap_content"> <tablelayout android:id="@+id/tb1" android:layout_height="wrap_content" android:layout_width="wrap_content"> </tablelayout> </horizontalscrollview>  </scrollview>
To generate table, take the track details as an example
        
private void drawTable(ArrayList<TrackDetail> tdList)
{
    try
    {
        TableLayout t1 = (TableLayout) findViewById(R.id.tb1);
        t1.removeAllViews();
        t1.addView(generateTitle());
   
        for(int i = 0; i < tdList.size() ; i++)
        {
           TableRow row = generateView(tdList.get(i));
           t1.addView(row);
        }
    }   
    catch(Exception e)
    {
        Toast.makeText(this, "draw fail" +e.toString(), Toast.LENGTH_LONG).show();
    }
}

public TableRow generateTitle()
{
    TableRow row = new TableRow(mContext);
    row.setBackgroundColor(0xffffff00);  
  
    TextView tv = new TextView(mContext);
    tv.setTextColor(0xFF000000);
    tv.setText("Disc No   ");
    row.addView(tv);
    
    TextView tv2 = new TextView(mContext);  
    tv2.setText("Track No   ");
    tv2.setTextColor(0xFF000000);
    row.addView(tv2);
  
    TextView tv3 = new TextView(mContext);
    tv3.setText("Composer   ");
    tv3.setTextColor(0xFF000000);
    row.addView(tv3);
  
    TextView tv4 = new TextView(mContext);
    tv4.setText("work   ");
    tv4.setTextColor(0xFF000000);
    row.addView(tv4);
  
    TextView tv5 = new TextView(mContext);
    tv5.setText("title   ");
    tv5.setTextColor(0xFF000000);
    row.addView(tv5);
  
    return row;
}
 
// produce the row filled with track detail dynamically
public TableRow generateView(TrackDetail t)
{
    TableRow row = new TableRow(mContext);
  
    TextView tv = new TextView(mContext);
    tv.setTextColor(0xFF000000);
    tv.setText( Integer.toString(t.getDiscNo())+ "   ");
    row.addView(tv);
  
    TextView tv2 = new TextView(mContext);
    tv2.setTextColor(0xFF000000);
    tv2.setText( Integer.toString(t.getTrackNo())+ "   ");
    row.addView(tv2);
  
    TextView tv3 = new TextView(mContext);
    tv3.setTextColor(0xFF000000);
    tv3.setText(t.getComposer() + "   ");
    row.addView(tv3);
  
    TextView tv4 = new TextView(mContext);
    tv4.setTextColor(0xFF000000);
    tv4.setText(t.getWorkNm()+ "   ");
    row.addView(tv4);
  
    TextView tv5 = new TextView(mContext);
    tv5.setTextColor(0xFF000000);
    tv5.setText(t.getTitleNm()+ "   ");
    row.addView(tv5);
  
    return row;
}


The result looks like

When we scroll it

沒有留言:

張貼留言