Tuesday, March 16, 2010

Android: add xml layout dynamically

For the application I'm creating, the user can use "search" function. This function will return a list of castles.
Here is the XML to display one result (/res/layout/element_result.xml). There is 1 button, 2 text fields and 1 image :


android:id="@+id/layoutElement"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
>
android:id="@+id/btnGo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/go"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
>

android:id="@+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/presentation"
android:layout_alignLeft="@+id/presentation"
>

android:id="@+id/presentation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toRightOf="@+id/image"
>

android:id="@+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
>




Then, I created a XML layout (/res/layout/results.xml) who will contain the list of results. That means, there will be many times element_result.xml inside results.xml. There is a scrollView and a table layout.


android:id="@+id/widget28"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
>
android:id="@+id/scrollResult"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scrollbars="horizontal"
android:layout_above="@+id/btnBack"
android:layout_alignParentLeft="true"
>
android:id="@+id/myTableLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>



android:id="@+id/btnBack"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/back"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
>




Ok, our views are ready. Now how to use them in Java. I read this blog, and that helps me a lot : Android LayoutWidth being disregarded by cascaded use of LayoutInflater.

Here is my activity file:

public class ResultActivity extends Activity{

public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// "results" is for the xml file "results.xml"
setContentView(R.layout.results);

addElementResult();
}

public void addElementResult() {
// "myTableLayout" is the id of the element in results.xml
TableLayout tl = (TableLayout)findViewById(R.id.myTableLayout);
// we will use service from inflater
LayoutInflater inflater = (LayoutInflater)getSystemService(LAYOUT_INFLATER_SERVICE);

//doing a loop to add many times the same xml
for(int i = 0; i < 17; i++) {
// "element_result" is the name of the xml file "element_result.xml".
// Create the itemView who will be added.
// itemView = element_result.xml
View itemView = inflater.inflate(R.layout.element_result, null);
// get the textView, and set the text to something
TextView t1 = (TextView) itemView.findViewById(R.id.presentation);
t1.setText("something" + i);

TextView t2 = (TextView) itemView.findViewById(R.id.description);
t2.setText("oh oh oh" + i);

//add the itemView
tl.addView(itemView, new TableLayout.LayoutParams(
LayoutParams.FILL_PARENT,
LayoutParams.WRAP_CONTENT));
}
}
}


So the result will look like that :


Note: in results.xml, I created a scrollView because if there is 20 results, the user should be able to scroll down to see all the results.
Note: I used "tableLayout" to be able to add results one under another one.

8 comments:

chinna said...

hi its very nice to show a list of items. But I have one doubt how to know which one is selected from the list of Items. and also how write a code for Selection handling for the list items and also code for Button Click. please tell me. once again thanks for this.

Croc said...

Awesome.
You solved my 2 hours spent problem!!!
Thank you

Colin said...

This is exactly what I am looking for except I have errors when running your code.

I fixed the XML files as the tags seem case sensitive but I have runtime errors when it reaches the inflation part of the code.

ClassCastExceptions.

If you have an idea, your help is much appreciated.

Unknown said...

This is waste of time. It doesnt work

Android app development said...

This is one of the high lighted post.Your blog has good knowledge which will help us to generate more traffic.Android app developers

Emrah KOCAMAN said...

just brief and powerful, thx

Android app developers said...

Interesting post. I amateur commodity added backbreaking on adapted blogs everyday. It will consistently be artful to apprehend adequate from added writers and breeding a little commodity from their store.

Android developer

Amarnath (Roobal) said...

Nice one..
U solved My Problem