Showing posts with label xml layout. Show all posts
Showing posts with label xml layout. Show all posts

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.