Wednesday 13 March 2013

Inflating UI Dynammically Example in Android

activity_main.xml

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >

        <Button
            android:id="@+id/add_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:layout_marginLeft="29dp"
            android:text="Add" />

        <Button
            android:id="@+id/delete_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="36dp"
                        android:layout_marginTop="10dp"
            android:layout_toRightOf="@id/add_button"
            android:text="Delete" />

        <LinearLayout android:id="@+id/child_linear"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/add_button"
            android:layout_marginTop="45dp"
            android:orientation="vertical" >
        </LinearLayout>

    </RelativeLayout>

custom_layout.xml


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <EditText
        android:id="@+id/editText1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="10" />

</LinearLayout>

MainActivity.java

package com.rajeshvijayakumar.inflat;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.LinearLayout;

public class MainActivity extends Activity implements OnClickListener {

    private Button mAddButton;
    private Button mDeleteButton;
    private LinearLayout mLinear;
   
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mAddButton = (Button) findViewById(R.id.add_button);
        mDeleteButton = (Button) findViewById(R.id.delete_button);
        mLinear = (LinearLayout) findViewById(R.id.child_linear);
        mAddButton.setOnClickListener(this);
        mDeleteButton.setOnClickListener(this);
       
    }

    @Override
    public void onClick(View v) {
       
        switch(v.getId()) {
            case R.id.add_button :
                View childView = getLayoutInflater().inflate(R.layout.custom_layout, null);
                mLinear.addView(childView);
                break;
            case R.id.delete_button :
                int childSize = mLinear.getChildCount();
                if(childSize != 0) {
                    mLinear.removeViewAt(childSize - 1);
                }
                break;
        }
    }  
}

Output :






Source Code :  Download this Example Here

3 comments:

  1. Rajesh

    this is great I am very new to Android programming and this is something I have been trying to achieve for a while now, Could you also help with something else. I need to inside the inflated view, place a progress bar that is linked to a timer. I need to have the timer start or have multiple timers each separated in a view like the example. but I seem to be having issues with this, can you show me how to link it to possible either an asynctask or a thread task, sorry for the inability to explain correctly, but I am more than willing to talk more if needed.

    regards

    cchinchoy

    ReplyDelete
  2. Rajesh

    Thanks for this, it solves one of my needs as a very new beginning programmer in android. I was wondering if you can show me how to link this to a timer. I need a separate timer for each new view with a progress bar that updates as the count down occurs. I would be very interested to pick your brain on this if you can assist me. I would be very grateful for your help.

    regards

    cchinchoy

    ReplyDelete
  3. Rajesh
    great tutorial, being very new to android programming, this seemed daunting, but you made it simple to understand. Can you assist me with an issue I am having, The same view that we put on the screen I need it to have a progress bar that is updated from a count down timer. However I need to be able to have this done multiple times. I was thinking Asynctask but I am not certain how to firstly, make the asynctask be created with varying values from edittext and then how to link it to the newly inflated view on the screen. I appreciate if you can assist me.

    regards

    cchinchoy

    ReplyDelete