Android Dynamically Add rows to Table Layout

My Biggest issue is to arrange the layout in different views.  Couple of days back i came across a situation where in need show the data in table format fetching records from the database.

I first tried to build entire string with separator \t and \n but upon rendering on device its not looking good.

I came across a concept while surfing to create the dynamic table rows and add content to that. Describing below the code and explanation for the same

First you need a blank table layout, may be you can add stand alone or part of any other layout

 <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
                    android:stretchColumns="0,1"
                    android:id="@+id/main_table" android:layout_weight="1" android:layout_height="wrap_content" android:layout_width="match_parent">
            </TableLayout>

Once you ready with basic blank table layout open your respective activity page and define the table element

TableLayout t1;

TableLayout tl = (TableLayout) findViewById(R.id.main_table);

Create table row header to hold the column headings

TableRow tr_head = new TableRow(this);
tr_head.setId(10);
tr_head.setBackgroundColor(Color.GRAY);
tr_head.setLayoutParams(new LayoutParams(
LayoutParams.FILL_PARENT,
LayoutParams.WRAP_CONTENT));

Add two data sections to the table row

TextView label_date = new TextView(this);
         label_date.setId(20);
         label_date.setText("DATE");
         label_date.setTextColor(Color.WHITE);
         label_date.setPadding(5, 5, 5, 5);
         tr_head.addView(label_date);// add the column to the table row here

         TextView label_weight_kg = new TextView(this);
         label_weight_kg.setId(21);// define id that must be unique
         label_weight_kg.setText("Wt(Kg.)"); // set the text for the header 
         label_weight_kg.setTextColor(Color.WHITE); // set the color
         label_weight_kg.setPadding(5, 5, 5, 5); // set the padding (if required)
         tr_head.addView(label_weight_kg); // add the column to the table row here

After adding the columns to the table row its time to add the table row the the main table layout that we fetched at the start

tl.addView(tr_head, new TableLayout.LayoutParams(
                 LayoutParams.FILL_PARENT,
                 LayoutParams.WRAP_CONTENT));

Now in similar fashion you can query the database or any array to get the repeat content, create the column, set properties, and add the same to the table row

Integer count=0;
 while (cursor.moveToNext()) {
String date = formatdate(cursor.getString(2));// get the first variable
Double weight_kg = roundTwoDecimals(cursor.getDouble(4));// get the second variable
// Create the table row
TableRow tr = new TableRow(this);
if(count%2!=0) tr.setBackgroundColor(Color.GRAY);
tr.setId(100+count);
tr.setLayoutParams(new LayoutParams(
LayoutParams.FILL_PARENT,
LayoutParams.WRAP_CONTENT));

//Create two columns to add as table data
 // Create a TextView to add date
TextView labelDATE = new TextView(this);
labelDATE.setId(200+count); 
labelDATE.setText(date);
labelDATE.setPadding(2, 0, 5, 0);
labelDATE.setTextColor(Color.WHITE);
tr.addView(labelDATE);
TextView labelWEIGHT = new TextView(this);
labelWEIGHT.setId(200+count);
labelWEIGHT.setText(weight_kg.toString());
labelWEIGHT.setTextColor(Color.WHITE);
tr.addView(labelWEIGHT);

// finally add this to the table row
tl.addView(tr, new TableLayout.LayoutParams(
	                    LayoutParams.FILL_PARENT,
	                    LayoutParams.WRAP_CONTENT));
		       count++;
		    }

After render your view should look like follows

 

Advertisements

24 thoughts on “Android Dynamically Add rows to Table Layout

  1. Hi Dear ,
    This line throws null pointer exception from your code how did you run it .
    Just when i try to add rows to the table layout ,
    Can you please respond ASAP .

    tl.addView(tr_head, new TableLayout.LayoutParams(
    LayoutParams.FILL_PARENT,
    LayoutParams.WRAP_CONTENT));

    • Hi Krishna
      In the layout you need to create one blank table layout and add the rows to it
      Here tl is the object of that table layout..

      so i guess the code is not finding in your layout the base table to add rows to..

      try it and if any issue drop me a comment

  2. Pingback: Sorting rows in the table by clicking the table header : Android Community - For Application Development
  3. I really Think that blog, “Android Dynamically Add
    rows to Table Layout Tech Notes” was indeed just right!

    Icould not agree together with you even more! Finally seems like I personallyidentified a blog website truly worth reading.
    Thanks a lot, Alica

  4. Very nice tutorial Thanks…. waste two days for creating this type of layout.

    I have one question:

    if i put EditText instead of TextView then how to Retrieve value of particular EditText

  5. Pingback: Advances in development- Almost ready – rozsatib

What you think ? Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s