Android
ListView
1
Sourabh Sahu
Under the Composite palette drag a
ListView onto the activity, give it an
id
2
Right click on res/layout choose
New/Other (or XML if it is there)
3
Choose Android/Android XML File
(not just XML file) and click Next
4
Give the file a name – remember the file name
convention small letters numbers underscores and
periods. Choose a Root Element. Click Finish.
5
Resulting XML in Graphical Layout
view and xml view
6
Code for String array, ArrayAdapter,
and ListView
7
Result so far in emulator. Note that
the list items are clickable
8
Code for the OnItemClickListener
9
Result
10
Custom List View
Creating a View template
Let’s create a xml layout that presents the items in a row in a
customised way.
Row_view.xml
11
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="10dp">
<TextView
android:id="@+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:text="Marshmallow"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="@android:color/black" />
<TextView
android:id="@+id/type"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/name"
android:layout_marginTop="5dp"
android:text="Android 6.0"
android:textColor="@android:color/black" />
<ImageView
android:id="@+id/item_info"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:src="@android:drawable/ic_dialog_info" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true">
<TextView
12
13
     android:id="@+id/version_heading"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="API: "
            android:textColor="@android:color/black"
            android:textStyle="bold" />
 
        <TextView
            android:id="@+id/version_number"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="23"
            android:textAppearance="?
android:attr/textAppearanceButton"
            android:textColor="@android:color/black"
            android:textStyle="bold" />
 
    </LinearLayout>
 
</RelativeLayout>
Create DataModel Class
14
public class DataModel {
 
    String name;
    String type;
    String version_number;
    String feature;
 
    public DataModel(String name, String type, String
version_number, String feature ) {
        this.name=name;
        this.type=type;
        this.version_number=version_number;
        this.feature=feature;
 
    }
 
    public String getName() {
        return name;
    }
     
15
    public String getType() {
        return type;
    }
     
    public String
getVersion_number() {
        return version_number;
    }
     
    public String getFeature() {
        return feature;
    }
     
}
Create an adapter
16
public class CustomAdapter extends ArrayAdapter<DataModel>
implements View.OnClickListener{
 
    private ArrayList<DataModel> dataSet;
    Context mContext;
 
    // View lookup cache
    private static class ViewHolder {
        TextView txtName;
        TextView txtType;
        TextView txtVersion;
        ImageView info;
    }
 
    public CustomAdapter(ArrayList<DataModel> data, Context context) {
        super(context, R.layout.row_item, data);
        this.dataSet = data;
        this.mContext=context;
 
    }
 
17
de
c void onClick(View v) {
position=(Integer) v.getTag();
ct object= getItem(position);
Model dataModel=(DataModel)object;
ch (v.getId())
se R.id.item_info:
nackbar.make(v, "Release date " +dataModel.getFeature(), Snackbar.L
     .setAction("No action", null).show();
reak;
te int lastPosition = -1;
18
@Override
    public View getView(int position, View convertView, ViewGroup parent) {
        // Get the data item for this position
        DataModel dataModel = getItem(position);
        // Check if an existing view is being reused, otherwise inflate the view
        ViewHolder viewHolder; // view lookup cache stored in tag
 
        final View result;
 
        if (convertView == null) {
 
            viewHolder = new ViewHolder();
            LayoutInflater inflater = LayoutInflater.from(getContext());
            convertView = inflater.inflate(R.layout.row_item, parent, false);
            viewHolder.txtName = (TextView) convertView.findViewById(R.id.name);
            viewHolder.txtType = (TextView) convertView.findViewById(R.id.type);
            viewHolder.txtVersion = (TextView)
convertView.findViewById(R.id.version_number);
            viewHolder.info = (ImageView) convertView.findViewById(R.id.item_info);
 
            result=convertView;
 
            convertView.setTag(viewHolder);
        } else {
            viewHolder = (ViewHolder) convertView.getTag();
            result=convertView;
        }
19
 Animation animation = AnimationUtils.loadAnimation(mContext, (position >
lastPosition) ? R.anim.up_from_bottom : R.anim.down_from_top);
        result.startAnimation(animation);
        lastPosition = position;
 
        viewHolder.txtName.setText(dataModel.getName());
        viewHolder.txtType.setText(dataModel.getType());
        viewHolder.txtVersion.setText(dataModel.getVersion_number());
        viewHolder.info.setOnClickListener(this);
        viewHolder.info.setTag(position);
        // Return the completed view to render on screen
        return convertView;
    }
}
Add this to your onCreate
method
20
 listView=(ListView)findViewById(R.id.list);
 
        dataModels= new ArrayList<>();
 
        dataModels.add(new DataModel("Apple Pie", "Android 1.0", "1","September 23, 2008"));
        dataModels.add(new DataModel("Banana Bread", "Android 1.1", "2","February 9, 2009"));
        dataModels.add(new DataModel("Cupcake", "Android 1.5", "3","April 27, 2009"));
        dataModels.add(new DataModel("Donut","Android 1.6","4","September 15, 2009"));
        dataModels.add(new DataModel("Eclair", "Android 2.0", "5","October 26, 2009"));
        dataModels.add(new DataModel("Froyo", "Android 2.2", "8","May 20, 2010"));
        dataModels.add(new DataModel("Gingerbread", "Android 2.3", "9","December 6, 2010"));
        dataModels.add(new DataModel("Honeycomb","Android 3.0","11","February 22, 2011"));
        dataModels.add(new DataModel("Ice Cream Sandwich", "Android 4.0", "14","October 18,
2011"));
        dataModels.add(new DataModel("Jelly Bean", "Android 4.2", "16","July 9, 2012"));
        dataModels.add(new DataModel("Kitkat", "Android 4.4", "19","October 31, 2013"));
        dataModels.add(new DataModel("Lollipop","Android 5.0","21","November 12, 2014"));
        dataModels.add(new DataModel("Marshmallow", "Android 6.0", "23","October 5, 2015"));
 
        adapter= new CustomAdapter(dataModels,getApplicationContext());
 
        listView.setAdapter(adapter);
        listView.setOnItemClickListener(new
AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View
view, int position, long id) {
 
                DataModel dataModel= dataModels.get(position);
 
                Snackbar.make(view, dataModel.getName()
+"n"+dataModel.getType()+" API:
"+dataModel.getVersion_number(), Snackbar.LENGTH_LONG)
                        .setAction("No action", null).show();
            }
        });
    }
21
22

Android ListView and Custom ListView