Dynamically adding view to viewgroup in Android

Posted By : Ravi Sharma | 22-Feb-2013

android

Here I will discuss how to add view to viewgroup dynamically in android.

To create flexible UI it is better to create view progmatically rather than using xml file.

Here I will explain how to add tablelayout dynamically and populate it.

Here is the xml file-

	<?xml version="1.0" encoding="utf-8"?>

	<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

	    android:id="@+id/rl"

	    android:layout_width="match_parent"

	    android:layout_height="match_parent"

	    android:orientation="horizontal" >

	

	
	 <TableLayout

	 android:id="@+id/tab"

	 android:layout_width="750dp"

	 android:layout_height="70dp"

	 android:layout_marginLeft="20dp"

	 android:layout_marginTop="75dp"

	 android:layout_weight="0.95"

	 android:background="@drawable/rounded_table1"

	 android:shrinkColumns="*"

	 android:stretchColumns="*">

	
	</TableLayout>

	
	 <TableRow

	                android:id="@+id/tableRow1"

	                android:layout_width="wrap_content"

	                android:layout_height="200dp"

	                android:gravity="center_horizontal"

	                android:layout_margin="2dp"

	                android:background="@drawable/rounded_table"

	                 >

	

	                <TextView

	                    android:id="@+id/textView1"

	                    android:layout_width="wrap_content"

	                    android:layout_height="70dp"

	                    android:gravity="center"

	                    android:text="Time"

	                    android:textSize="30dp"                   

	                    android:textColor="#FFFFFF"/>

	

	                <TextView

	                    android:id="@+id/textView2"

	                    android:layout_width="wrap_content"

	                    android:layout_height="wrap_content"

	                    android:gravity="center"

	                    android:text="Date"

	                    android:textSize="30dp"                   

	                    android:textColor="#FFFFFF"/>

	

	                <TextView

	                    android:id="@+id/textView3"

	                    android:layout_width="wrap_content"

	                    android:layout_height="wrap_content"

	                    android:gravity="center"

	                    android:text="Description"

	                    android:textSize="30dp"                   

	                    android:textColor="#FFFFFF"/>

	

	            </TableRow>

	

	</TableLayout>

	</RelativeLayout>

Here the relativelayout is given an id because that is how we will refer to it in code.
It is not necessary to add tablelayout in xml but just to compare both xml , coding styles I added it.

Now in java code we will do the following to add tablelayout.

	public class tableView extends Activity {

	

	RelativeLayout rl

	
	public void onCreate(Bundle savedInstanceState) {

	        super.onCreate(savedInstanceState);

	        setContentView(R.layout.activity_tableView);                    

	        rl=(RelativeLayout)findViewById(R.id.rl);           

	       

	        TableLayout MainLayout = new TableLayout(getApplicationContext());  

	     

	             TableRow tr = new TableRow(getApplicationContext());

	             

	                 tr.setPadding(0, 10, 0, 0);

	                     tr.setGravity(Gravity.CENTER);

	                      tr.setBackgroundResource(R.drawable.rounded_table1);   

	                      tr.setLayoutParams(new LayoutParams(

	                             LayoutParams.FILL_PARENT,

	                             LayoutParams.WRAP_CONTENT));

	                   /* Create a textView to be the row-content. */

	            

	                      TextView textView = new TextView(getApplicationContext());

	                                textView.setTextColor(Color.WHITE);

	                                textView.setGravity(Gravity.CENTER);

	                               textView.setText("10:10");

	                                textView.setTextSize(25);

	                                textView.setHeight(88);

	             

	                    tr.addView(textView);

	                

	                    TextView textView1 = new TextView(getApplicationContext());

	                     textView1.setTextColor(Color.WHITE);

	                           textView1.setText("22 Feb 2013");

	                          textView1.setTextSize(25);

	                           textView1.setGravity(Gravity.CENTER);

	                           textView1.setHeight(88);

	             

	                  tr.addView(textView1);

	                

	                  TextView textView2 = new TextView(getApplicationContext());

	                          textView2.setTextColor(Color.WHITE);

	                          textView2.setText("Hello");   

	                          textView2.setGravity(Gravity.CENTER);

	                          textView2.setTextSize(25);

	                          textView2.setHeight(88);

	                     

	                     tr.addView(textView2);

	               

	                

	                  TableLayout.LayoutParams tableRowParams=

	                           new TableLayout.LayoutParams

	                           (TableLayout.LayoutParams.FILL_PARENT,TableLayout.LayoutParams.WRAP_CONTENT);

	

	                        

	                         tableRowParams.setMargins(3,3,3,0);

	                        

	                         tr.setLayoutParams(tableRowParams);

	                         ((TableLayout)MainLayout).addView(tr,tableRowParams);

	                         ((TableLayout)MainLayout).setStretchAllColumns(true);

	                        

	                         ((TableLayout)MainLayout).setBackgroundResource(R.drawable.rounded_table);                     

	                                                 

	       

	                RelativeLayout.LayoutParams tableRowParams1=

	                           new RelativeLayout.LayoutParams

	                           (1000,300);                       

	                         tableRowParams1.setMargins(3,180,3,0);                       

	                         MainLayout.setLayoutParams(tableRowParams1);

	                         rl.addView(MainLayout,tableRowParams1);                       

	                                    

	        }

	

	

	 }

Firstly, we refer the viewgroup using id "rl".

Then create tablelayout, tablerow , three textviews .

tr.addView(textView), adds text to table row.

((TableLayout)MainLayout).addView(tr,tableRowParams), adds table to tablelayout.

rl.addView(MainLayout,tableRowParams1), adds tablelayout to the viewgroup.

And thats it we have successfully added view dynamically to viewgroup.

Thanks,

Ravi Sharma

[email protected]