Repeat LinearLayout element containing other UI elements and fill it with data

Question

I have created some "data row template" in xml. It looks like this:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:padding="8dp">

    <ImageView
        android:layout_width="56dp"
        android:layout_height="56dp"
        android:background="#CCCCCC"
        android:layout_margin="8dp" />

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="First Name Last Name"
            android:textSize="20dp"
            android:textColor="#757575"
            android:layout_margin="8dp"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Some very long long description. Some very long long description. Some very long long description."
            android:textSize="14dp"
            android:textColor="#222222"
            android:layout_margin="8dp"/>

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:weightSum="3">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Param 1"
            android:layout_margin="8dp"
            android:layout_weight="1"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Param 1"
            android:layout_margin="8dp"
            android:layout_weight="1" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Param 2"
            android:layout_margin="8dp"
            android:layout_weight="1" />

        </LinearLayout>

    </LinearLayout>

</LinearLayout>

Preview looks like this:

Now I would like to insert many "rows templates" to some activity and fill these rows with data.

How should I approach to this? Create everything programatically or there is other way?

Answer 1

You will have to use a ListView which can be populated using a CustomAdapter. Follow this blog for more info.

Answer 2

Try this way,hope this will help you to solve your problem.

This layout use define ListView for Activity.

activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center">

    <ListView
        android:id="@+id/listView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

</LinearLayout>

This layout as same which you created i just given id to ImageView,TextView and also correct LinearLayout weight.

list_item.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:padding="8dp">

    <ImageView
        android:id="@+id/imgIcon"
        android:layout_width="56dp"
        android:layout_height="56dp"
        android:background="#CCCCCC"
        android:layout_margin="8dp" />

    <LinearLayout
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <TextView
            android:id="@+id/txtFirstLastName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="First Name Last Name"
            android:textSize="20dp"
            android:textColor="#757575"
            android:layout_margin="8dp"/>

        <TextView
            android:id="@+id/txtDescription"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Some very long long description. Some very long long description. Some very long long description."
            android:textSize="14dp"
            android:textColor="#222222"
            android:layout_margin="8dp"/>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <TextView
                android:id="@+id/txtParams1"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_margin="8dp"
                android:layout_weight="1"/>

            <TextView
                android:id="@+id/txtParams2"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_margin="8dp"
                android:layout_weight="1" />

            <TextView
                android:id="@+id/txtParams3"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_margin="8dp"
                android:layout_weight="1" />
        </LinearLayout>
    </LinearLayout>
</LinearLayout>

This class contain ListView Initialization and Custom Adapter as inner class also make temp HashMap ArrayList for ListView 3 items,implementing ListView item click listener.

MainActivity.java

public class MainActivity extends ActionBarActivity {

    private ListView listView;
    private CustomAdapter adapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        listView = (ListView) findViewById(R.id.listView);

        final ArrayList<HashMap<String,Object>> list = new ArrayList<HashMap<String, Object>>();

        HashMap<String,Object> map1 = new HashMap<String,Object>();
        map1.put("Image",R.drawable.ic_launcher);
        map1.put("FirstLastName", "FirstLastName 1");
        map1.put("Descriptions","Descriptions 1 Descriptions 1 Descriptions 1 Descriptions 1 Descriptions 1 Descriptions 1 Descriptions 1 Descriptions 1");
        map1.put("Params1","Params1 1");
        map1.put("Params2","Params2 1");
        map1.put("Params3","Params3 1");
        list.add(map1);

        HashMap<String,Object> map2 = new HashMap<String,Object>();
        map2.put("Image",R.drawable.ic_launcher);
        map2.put("FirstLastName","FirstLastName 2");
        map2.put("Descriptions","Descriptions 2 Descriptions 2 Descriptions 2 Descriptions 2 Descriptions 2 Descriptions 2 Descriptions 2 Descriptions 2");
        map2.put("Params1","Params1 2");
        map2.put("Params2","Params2 2");
        map2.put("Params3","Params3 2");
        list.add(map2);

        HashMap<String,Object> map3 = new HashMap<String,Object>();
        map3.put("Image",R.drawable.ic_launcher);
        map3.put("FirstLastName","FirstLastName 3");
        map3.put("Descriptions","Descriptions 3 Descriptions 3 Descriptions 3 Descriptions 3 Descriptions 3 Descriptions 3 Descriptions 3 Descriptions 3");
        map3.put("Params1","Params1 3");
        map3.put("Params2","Params2 3");
        map3.put("Params3","Params3 3");
        list.add(map3);

        adapter = new CustomAdapter(this,list);
        listView.setAdapter(adapter);
        listView.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
            @Override
            public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
                Toast.makeText(MainActivity.this,list.get(position).get("FirstLastName").toString(),Toast.LENGTH_SHORT).show();
            }

            @Override
            public void onNothingSelected(AdapterView<?> parent) {

            }
        });

    }

    class CustomAdapter extends BaseAdapter {
        private Context context;
        private ArrayList<HashMap<String,Object>> data;

        public CustomAdapter(Context context,ArrayList<HashMap<String,Object>> data){
            this.context = context;
            this.data = data;
        }

        @Override
        public int getCount(){
            return data.size();
        }

        @Override
        public Object getItem(int position){
            return data.get(position);
        }

        @Override
        public long getItemId(int position){
            return position;
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent){
            ViewHolder holder;
            if(convertView == null){
                holder =new ViewHolder();
                convertView = LayoutInflater.from(context).inflate(R.layout.list_item, null);
                holder.imgIcon = (ImageView)convertView.findViewById(R.id.imgIcon);
                holder.txtFirstLastName = (TextView)convertView.findViewById(R.id.txtFirstLastName);
                holder.txtDescription = (TextView)convertView.findViewById(R.id.txtDescription);
                holder.txtParams1 = (TextView)convertView.findViewById(R.id.txtParams1);
                holder.txtParams2 = (TextView)convertView.findViewById(R.id.txtParams2);
                holder.txtParams3 = (TextView)convertView.findViewById(R.id.txtParams3);
                convertView.setTag(holder);
            }else{
                holder = (ViewHolder)convertView.getTag();
            }

            holder.imgIcon.setImageResource((Integer) data.get(position).get("Image"));
            holder.txtFirstLastName.setText(data.get(position).get("FirstLastName").toString());
            holder.txtDescription.setText(data.get(position).get("Descriptions").toString());
            holder.txtParams1.setText(data.get(position).get("Params1").toString());
            holder.txtParams2.setText(data.get(position).get("Params2").toString());
            holder.txtParams3.setText(data.get(position).get("Params3").toString());


            return convertView;
        }

        class ViewHolder{
            ImageView imgIcon;
            TextView txtFirstLastName;
            TextView txtDescription;
            TextView txtParams1;
            TextView txtParams2;
            TextView txtParams3;
        }
    }

}

Answer 3

Looks Like you want to generate some list. Generating it manually will slow down your application performance. For list generation you must use Listview and custom Adapter for that listview. I Recommend you to create custom BaseAdapter ( Here is an example ).