ListView, the most commonly used control in Android

1. Preface: As a novice, I also encountered a lot of problems at the beginning of learning List View. The most important thing is that there are many things I don’t understand, especially when I customize some pictures or other controls in List View. , you need to customize a class and adapter. Maybe my understanding of adapters and generics is not in place. I hope that I can fill in the knowledge gaps in these two aspects in the future. In addition, there is a custom title bar in the picture, but I deleted it in the actual code.

2. Analysis: First, make a brief analysis. As mentioned earlier, my understanding of this control is not very good, so I can only make a brief analysis at the height of my understanding. Compared with other simple controls, List View is a relatively special control. The most basic simple usage of only adding a title to Item will not be discussed here. I will mainly talk about how to customize the title and description in List View. There are also the usage of other controls such as pictures, as shown in the following figure:


To make it look like this:

3. Implementation process

1.  I first wrote a China class whose attributes include the picture and title in the Item (the place name inside) and the title description (a paragraph below the place name). The code is as follows:

public class China {
    private String name;
    private String capital;
    private int image;
    public China(String name,String capital,int image){
        this.name = name;
        this.capital = capital;
        this.image = image;
    }
    public String getName(){
        return name;
    }
    public String getCapital(){
        return capital;
    }
    public int getIcon(){
        return image;
    }
}

2. Then write a layout file for each row (Item) in the List View:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    >
    <ImageView
        android:id="@+id/ItemImage"
        android:layout_alignParentLeft="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="10dp"
        />
    <TextView
        android:id="@+id/ItemTitle"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:textSize="20sp"
        android:layout_marginLeft="10dp"
        android:layout_toRightOf="@+id/ItemImage"
        />
    <TextView
        android:id="@+id/ItemText"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_below="@+id/ItemTitle"
        android:layout_marginLeft="10dp"
        android:layout_toRightOf="@+id/ItemImage"
        />
</RelativeLayout>

3. Customize an adapter to pass the data source to the item:

public class ChinaAdapter extends ArrayAdapter<China>{
    private int resourceId;
    public ChinaAdapter(Context context, int textViewResourceId, List<China> objects){
        super(context,textViewResourceId,objects);
        resourceId = textViewResourceId;
    }
    @Override
    public View  getView(int position, View convertView, ViewGroup parent) {
        China china = getItem (position);
        View view;
        if(convertView==null){
            view = LayoutInflater.from ( getContext () ).inflate ( resourceId,parent,false );
        }else {
            view = convertView;
        }
        ImageView chinaImage = view.findViewById (R.id.ItemImage);
        TextView chinaTitle = view.findViewById ( R.id.ItemTitle );
        TextView chinaText = view.findViewById ( R.id.ItemText );
        chinaTitle.setText ( china.getName () );
        chinaText.setText ( china.getCapital () );
        chinaImage.setImageResource ( china.getIcon () );
        return  view;
    }
}

4. The last is MainActivity:

public class MainActivity extends AppCompatActivity {

    private ListView mLv;
    private List<China>chinaList = new ArrayList<> (  );
    private String[] data = { "Beijing", "Chongqing", "Gansu", "Shanghai", "Zhejiang", "Jiangsu"};
    private String[] dataText = {"Beijing: the capital of the motherland", "Chongqing: passing by from your world", "Lanzhou: I want to eat ramen",
            "Shanghai: Wait for me, I will definitely visit", "Hangzhou: I may pass by", "Nanjing: I don't know"};
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate (savedInstanceState);
        setContentView ( R.layout.activity_main );
        //Initialize the China property
        initChina ();
        ChinaAdapter adapter = new ChinaAdapter ( MainActivity.this,R.layout.item,chinaList );
        mLv = findViewById (R.id.mLv);
        // load data into ListView
        mLv.setAdapter (adapter);
        //The following is the click event of the ListView
        mLv.setOnItemClickListener (new AdapterView.OnItemClickListener () {
            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                China china = chinaList.get ( i );//i is to judge that the item is clicked
                Toast.makeText ( MainActivity.this,china.getCapital (),Toast.LENGTH_SHORT ).show ();
            }
        } );
    }
    private  void  initChina(){
        for (int i = 0;i<2;i++) {
            China beijing = new China ( data[0], dataText[0], R.mipmap.bj );
            chinaList.add ( beijing );
            China chongqing = new China ( data[1], dataText[1], R.mipmap.cq );
            chinaList.add ( chongqing );
            China gansu = new China ( data[2], dataText[2], R.mipmap.gs );
            chinaList.add ( gansu );
            China shanghai = new China ( data[3], dataText[3], R.mipmap.sh );
            chinaList.add ( shanghai );
            China zhejiang = new China ( data[4], dataText[4], R.mipmap.zj );
            chinaList.add ( zhejiang );
            China jiangsu = new China ( data[5], dataText[5], R.mipmap.js );
            chinaList.add ( jiangsu );
        }
    }
}

Postscript: The simplest note, I really didn't understand it properly. Let's continue to improve it later.

Source code download


Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325463113&siteId=291194637