Android控件--定制ListView界面

Posted 2020-12-27 seizemiss

0.前言

    学过android的人，我想肯定使用该Android的ListView控件，毕竟当要显示列表的时候，例如qq的消息界面、聊天界面，手机显示联系人，这些无疑都是使用到了ListView
 这个Android最为常用的界面。那么接下来就谈谈如何自己创建一个适配器去订制ListView界面的。（注意：本文介绍的适用列表每一项的内容一样的情况）

1.在AndroidStudio新建Android工程

     工程中的Androidmanifest.xml保持不变

2.在main_activity中加入一个ListView控件，并且声明id

 

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

3.新建一个布局文件item_activity.xml

     显示每个列表项要展示的内容，本例子展示的是一个图片，两个文本（一个表示文本标题，
 另一个表示的是文本内容），采用的是相对布局，文本内容位于文本标题的正下方

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:id="@+id/relative"
    android:paddingBottom="4dip"
    android:paddingLeft="12dip"
    android:paddingRight="12dip"
    >
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:id="@+id/image"
        android:paddingTop="12dip"/>
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/itemTitle"
        android:text="TextView1"
        android:textSize="20dip"
        />
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/itemText"
        android:text="TextView2"
        android:layout_below="@+id/itemTitle"
        />
</RelativeLayout>

以上已经介绍完整个例子的布局文件，接下来讨论的是使用Java代码去实现定制ListView界面的功能

4.在src中创建ListItem.java类

     这个类中的属性与item_activity.xml中的各个控件相对应，并且针对每个属性要写getter方法（可以在后面新建的适配器中使用它）

 1  package dragon.csu.edu.pojoj;
 2 
 3 public class ListItem {
 4     private int imageId;
 5     private String itemTitle;
 6     private String itemText;
 7 
 8     public ListItem(int imageId, String itemTitle, String itemText) {
 9         this.imageId = imageId;
10         this.itemTitle = itemTitle;
11         this.itemText = itemText;
12     }
13 
14     public int getImageId() {
15         return imageId;
16     }
17 
18     public String getItemTitle() {
19         return itemTitle;
20     }
21 
22     public String getItemText() {
23         return itemText;
24     }
25 }

5.在src中创建ListViewAdapter.java类

   这个就是本例子的重点了，首先要讲的是这个类要继承于ArrayAdapter这个类，这样就可以作为传入ListView的参数，不继承就无法进行；其次是内部类ListHoder，使用这个内部类的作用
就是可以当我们是第二次访问的时候，它会将第一次访问的ListView中的信息进行相应的保存，这无疑可以节省界面显示的时间，不用在进行数据的获取。具体详细内容中的解释，不过多介绍

 1 package dragon.csu.edu.util;
 2 
 3 import android.content.Context;
 4 import android.view.LayoutInflater;
 5 import android.view.View;
 6 import android.view.ViewGroup;
 7 import android.widget.ArrayAdapter;
 8 import android.widget.ImageView;
 9 import android.widget.TextView;
10 
11 import org.w3c.dom.Text;
12 
13 import java.util.List;
14 
15 import dragon.csu.edu.androidexample.R;
16 import dragon.csu.edu.pojoj.ListItem;
17 
18 public class ListViewAdapter extends ArrayAdapter<listitem> {
19     private int resourceId;//记录的是item_activity.xml的布局id
20     public ListViewAdapter(Context context,int resourceId1,List<listitem> listItems) {
21         super(context,resourceId1,listItems);
22         resourceId=resourceId1;
23     }
24     @Override
25     public View getView(int position, View convertView, ViewGroup parent){
26         ListItem listItem=getItem(position);
27         View view;
28         ViewHolder viewHolder;
29         //当用户为第一次访问的时候
30         if(convertView==null){
31             //将item_activity布局解析成显示界面
32             view = LayoutInflater.from(getContext()).inflate(resourceId,null);
33             viewHolder=new ViewHolder();
34             //获取item_activity.xml中控件，并将其保存在viewHolder中
35             viewHolder.imageView=(ImageView)view.findViewById(R.id.image);
36             viewHolder.itemTitle=(TextView)view.findViewById(R.id.itemTitle);
37             viewHolder.itemText=(TextView)view.findViewById(R.id.itemText);
38             //设置将数据进行缓存
39             view.setTag(viewHolder);
40         }else{
41             //第二次访问直接读取第一次访问使存取的数据
42             view=convertView;
43             viewHolder=(ViewHolder)view.getTag();
44         }
45         //将数据返回到item_activity.xml中的每一个空间中
46         viewHolder.imageView.setImageResource(listItem.getImageId());
47         viewHolder.itemTitle.setText(listItem.getItemTitle());
48         viewHolder.itemText.setText(listItem.getItemText());
49         return view;
50     }
51     class ViewHolder{
52         private ImageView imageView;
53         private TextView itemTitle;
54         private TextView itemText;
55     }
56 }

完成了以上的内容，就剩下最后一步了

6.编写MainActivity.java代码

当完成以上的代码，编写MainActivity.java就显得特别的简单

 1 package dragon.csu.edu.androidexample;
 2 
 3 import android.app.Activity;
 4 import android.os.Bundle;
 5 import android.view.View;
 6 import android.widget.ListView;
 7 
 8 import java.util.ArrayList;
 9 import java.util.List;
10 
11 import dragon.csu.edu.pojoj.ListItem;
12 import dragon.csu.edu.util.ListViewAdapter;
13 
14 public class MainActivity extends Activity {
15     ArrayList<listitem> lists=new ArrayList<listitem>();
16     @Override
17     protected void onCreate(Bundle savedInstanceState) {
18         super.onCreate(savedInstanceState);
19         setContentView(R.layout.list_view_activity);
20         //得到listView
21         ListView listView=(ListView)findViewById(R.id.listView);
22         initListItem();//初始化数据
23         //第一个参数表示上下文，第二个表示要显示的布局id，第三个表示传入的参数
24         ListViewAdapter listViewAdapter=new ListViewAdapter(MainActivity.this,R.layout.
25                 item_activity,lists);
26         //将item_activity.xml中的布局导入ListView中
27         listView.setAdapter(listViewAdapter);
28     }
29     public void initListItem(){
30         ListItem list1=new ListItem(R.drawable.image5,"Level 1","1");
31         ListItem list2=new ListItem(R.drawable.image5,"Level 2","2");
32         ListItem list3=new ListItem(R.drawable.image5,"Level 3","3");
33         lists.add(list1);
34         lists.add(list2);
35         lists.add(list3);
36     }
37 
38 }

这样，就完成了定制ListView界面.

本文为个人原创，转载请注明出处