Populate list of custom view using ListFragment

berkuqo picture berkuqo · Apr 30, 2013 · Viewed 18.9k times · Source

I am trying to show elements in a list view using Fragments. I created my custom view as follow

graphical representation of list_row.xml

enter image description here

list_row.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:padding="5dip" >

    <!-- ListRow Left sied Thumbnail image -->

    <LinearLayout
        android:id="@+id/thumbnail"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_marginRight="5dip"
        android:padding="3dip" >

        <ImageView
            android:id="@+id/list_image"
            android:layout_width="50dip"
            android:layout_height="50dip" 
            android:contentDescription="@string/image_desc"/>
    </LinearLayout>

    <!-- Menu name -->

    <TextView
        android:id="@+id/menu_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/thumbnail"
        android:layout_toRightOf="@+id/thumbnail"
        android:text="@string/menu_name"
        android:textColor="#040404"
        android:textSize="15sp"
        android:textStyle="bold"
        android:typeface="sans" />

    <!-- Description -->

    <TextView
        android:id="@+id/description"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/thumbnail"
        android:layout_below="@id/menu_name"
        android:layout_marginTop="1dip"
        android:layout_toRightOf="@+id/thumbnail"
        android:text="@string/description"
        android:textColor="#343434"
        android:textSize="10sp"
        tools:ignore="SmallSp" />

    <!-- Price -->

    <TextView
        android:id="@+id/price"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignTop="@id/menu_name"
        android:layout_marginRight="5dip"
        android:gravity="right"
        android:text="@string/price"
        android:textColor="#10bcc9"
        android:textSize="10sp"
        android:textStyle="bold"
        tools:ignore="SmallSp" />

</RelativeLayout>

In fragment.xml file, I simply put a list view inside a linear layout

fragment.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

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

</LinearLayout>

I have an array of menu objects, that has the necessary fields to populate list_row.xml like menu name, description, price and image. I couldn't find a way to fill fragment.xml's listView with the list_row elements. Any help or idea would be appreciated.

PS: I think in fragment.xml instead of android:id="@+id/listView1" field, I have to write android:id="@id/list" since I'm using ListFragment

Answer

berkuqo picture berkuqo · Apr 30, 2013

I solved my problem (as system32 suggests on comment) creating a CustomArrayAdapter class, and setting it as the adapter for my listView.

First I changed android:id="@+id/listView1" to android:id="@android:id/list" in fragment.xml.

CustomArrayAdapter.java

public class CustomArrayAdapter extends ArrayAdapter<Menu> {

    Context context;

    public CustomArrayAdapter(Context context, int textViewResourceId, List<Menu> objects) {
        super(context, textViewResourceId, objects);
        // TODO Auto-generated constructor stub
        this.context = context;
    }

    /*private view holder class*/
    private class ViewHolder {
        ImageView imageView;
        TextView txtMenuName;
        TextView txtMenuDesc;
        TextView txtPrice;
    }

    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder = null;
        Menu rowItem = getItem(position);

        LayoutInflater mInflater = (LayoutInflater) context
                .getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
        if (convertView == null) {
            convertView = mInflater.inflate(R.layout.list_row, null);
            holder = new ViewHolder();
            holder.txtMenuName = (TextView) convertView.findViewById(R.id.menu_name);
            holder.txtMenuDesc = (TextView) convertView.findViewById(R.id.description);
            holder.txtPrice = (TextView) convertView.findViewById(R.id.price);
            holder.imageView = (ImageView) convertView.findViewById(R.id.list_image);
            convertView.setTag(holder);
        } else
            holder = (ViewHolder) convertView.getTag();

        holder.txtMenuDesc.setText(rowItem.getDescription());
        holder.txtMenuName.setText(rowItem.getName());
        holder.txtPrice.setText(String.valueOf(rowItem.getPrice()) + " TL");
        //holder.imageView.setImageResource(rowItem.getImageId());

        return convertView;
    }

}

Then I use it in my Fragment class

    public static class Fragment extends ListFragment {
        /**
         * The fragment argument representing the section number for this
         * fragment.
         */
        public static final String ARG_SECTION_NUMBER = "section_number";

        private ListView listView;
        private ArrayList<Menu> menuItems;
        private CustomArrayAdapter mAdapter;

        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
            View rootView = inflater.inflate(R.layout.fragment,
                    container, false);
            listView = (ListView) rootView.findViewById(android.R.id.list);

            return rootView;
        }

        @Override
        public void onActivityCreated(Bundle savedInstanceState) {
            super.onActivityCreated(savedInstanceState);
            int num = getArguments().getInt(ARG_SECTION_NUMBER);
            // GlobalList is a class that holds global variables, arrays etc
            // getMenuCategories returns global arraylist which is initialized in GlobalList class
            menuItems = GlobalList.getMenuCategories().get(num).getMenu();
            mAdapter = new CustomArrayAdapter(getActivity(), android.R.id.list, menuItems);
            listView.setAdapter(mAdapter);
        }
    }