Search code examples
androidandroid-listviewandroid-custom-viewandroid-listfragment

Populate list of custom view using ListFragment


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


Solution

  • 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);
            }
        }