Android-ListView的用法

ListView绝对称得上是Android中最常用的控件之一，几乎所有的应用程序都会用到它。ListView允许用户提供手指上下滑动的方式将屏幕外的数据滚动到屏幕内，同时屏幕上原有的数据则会滚动出屏幕。

定制ListView的界面

• 首先准备好一组图片，分别对应每一种水果，待会我们要让这些水果名称的旁边都有一个图样。
• 接着定义一个实体类，作为ListView适配器的适配类型。新建Fruit类，代码如下：

public class Fruit {

    private String name;
    private int imageId;

    public Fruit(String name, int imageId) {
        this.name = name;
        this.imageId = imageId;
    }

    public String getName() {
        return name;
    }

    public int getImageId() {
        return imageId;
    }
}

Fruit类中只有两个字段，name表示水果的名字，imageId表示水果对应图片的资源id。

• 为ListView的子项指定一个我们自定义的布局，在layout目录下新建fruit_item.xml，代码如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/fruit_image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

    <TextView
        android:id="@+id/fruit_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:layout_marginLeft="10dp"
        android:background="@android:color/holo_blue_dark"/>
</LinearLayout>

在这个布局中，我们定义了一个ImageView用于显示水果的图片，又定义了一个TextView用于显示水果的名称，并让TextView在垂直方向上居中显示。

• 创建一个自定义的适配器，这个适配器继承自ArrayAdapter，并将泛型指定为Fruit类，新建类FruitAdapter，代码如下：

public class FruitAdapter extends ArrayAdapter<Fruit> {

    private int resourceId;

    public FruitAdapter(@NonNull Context context, int resource, List<Fruit> objects) {
        super(context, resource, objects);
        resourceId = resource;
    }

    @NonNull
    @Override
    public View getView(int position, @Nullable View convertView, @NonNull ViewGroup parent) {
        Fruit fruit = getItem(position);
        View view = LayoutInflater.from(getContext()).inflate(resourceId, parent, false);
        ImageView fruitImage = view.findViewById(R.id.fruit_image);
        TextView fruitName = view.findViewById(R.id.fruit_name);
        fruitImage.setImageResource(fruit.getImageId());
        fruitName.setText(fruit.getName());
        return view;
    }
}

FruitAdapter重写了父类的一组构造函数，用于将上下文、ListView子项布局的id和数据都传递进来，另外重写了getView()方法，这个方法在每个子项被滚动到屏幕内的时候会被调用，在getView()方法中，首先通过getItem()方法得到Fruit实例，然后使用LayoutInflater为这个子项加载我们传入的布局。

• 接下来调用View的findViewById()方法分别获取到ImageView和TextView的实例，并分别调用它们的setImageResource()和setText()方法来设置显示的图片和文字，最后将布局返回，这样我们的自定义适配器就完成了。

public class MainActivity extends AppCompatActivity {

    private List<Fruit> mFruitList = new ArrayList<>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initFruits(); // 初始化水果数据
        FruitAdapter adapter = new FruitAdapter(MainActivity.this, R.layout.fruit_item, mFruitList);
        ListView listView = findViewById(R.id.list_view);
        listView.setAdapter(adapter);
    }

    private void initFruits() {
        for (int i = 0; i < 4; ++i) {
            Fruit apple = new Fruit("Apple", R.drawable.apple_pic);
            mFruitList.add(apple);
            Fruit orange = new Fruit("Orange", R.drawable.orange_pic);
            mFruitList.add(orange);
            Fruit waterMelon = new Fruit("Watermelon", R.drawable.watermelon_pic);
            mFruitList.add(waterMelon);
        }
    }
}

• 效果图
  
• 性能优化
  目前我们的ListView的运行效率是很低的，因为FruitAdapter的getView()方法中，每次都将布局加载了一遍，当ListView快速滑动的时候，这就会成为性能的瓶颈。
  仔细观察发现，getView()方法中还有一个convertView参数，这个参数用于将之前加载好的布局进行缓存，以便以后可以重用，修改FruitAdapter中的代码，如下：

View view = convertView == null ?  LayoutInflater.from(getContext()).inflate(resourceId, parent, false) : convertView;

可以看到，我们对convertView进行了判断，如果为null，则重新加载布局，如果不为null，则重用convertView。这样就大大提高了ListView的效率。

• 继续优化
  虽然现在我们已经不会再重复加载布局，但是每次在getView()方法中还是都会调用View的findViewByIdI()方法来获取一次控件的实例。我们可以借助一个ViewHolder来对这部分性能进行优化，修改FruitAdapter中的代码，如下：

public class FruitAdapter extends ArrayAdapter<Fruit> {
	...
     @NonNull
    @Override
    public View getView(int position, @Nullable View convertView, @NonNull ViewGroup parent) {
        Fruit fruit = getItem(position);
        View view; 
        ViewHolder viewHolder;
        if (convertView == null) {
            view = LayoutInflater.from(getContext()).inflate(resourceId, parent, false);
            viewHolder = new ViewHolder();
            viewHolder.fruitImage = view.findViewById(R.id.fruit_image);
            viewHolder.fruitName = view.findViewById(R.id.fruit_name);
            view.setTag(viewHolder); // 将ViewHolder存储在View中
        } else {
            view = convertView;
            viewHolder = (ViewHolder) view.getTag(); // 重新获取ViewHolder
        }
        viewHolder.fruitName.setText(fruit.getName());
        viewHolder.fruitImage.setImageResource(fruit.getImageId());
        return view;
    }
    
    class ViewHolder {
        ImageView fruitImage;
        TextView fruitName;
    }
}

我们新增了一个内部类ViewHolder，用于对控件的实例进行缓存，这样就没必要每次都通过findViewById方法来获取控件实例了。

• ListView的点击事件
  ListView的滚动毕竟只是为了满足我们视觉上的效果，可是如果ListView中的子项不能点击的话，这个控件就没有什么实际的用途了。修改MainActivity中的代码，如下：

public class MainActivity extends AppCompatActivity {

    private List<Fruit> mFruitList = new ArrayList<>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initFruits(); // 初始化水果数据
        FruitAdapter adapter = new FruitAdapter(MainActivity.this, R.layout.fruit_item, mFruitList);
        ListView listView = findViewById(R.id.list_view);
        listView.setAdapter(adapter);
        listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                Fruit fruit = mFruitList.get(i);
                Toast.makeText(MainActivity.this, fruit.getName(), Toast.LENGTH_SHORT).show();
            }
        });
    }
	...
}

可以看到，我们使用setOnItemClickListener()方法为ListView注册了一个监听器，当用户点击了ListView中的任何一个子项式，就会回调onItemClick()方法。这个方法通过position参数判断出用户点击的是哪一个子项，然后获取到相应的水果，并通过Toast将水果的名字显示出来。