常用且难用的ListView

---

ListView在过去绝对可以称得上Android中最常用的软件之一,由于手机屏幕空间比较有限,能够一次在屏幕上显示的内容并不多,当我们的程序中有大量的数据需要展示的时候,就可以借助ListView来实现,ListView允许用户通过手指上下滑动的方式将屏幕外的数据滚动到屏幕内,同时屏幕上原有的数据会滚出屏幕

ListView的简单用法

首先新建一个ListViewTest项目,让Android Studio自动帮我们创建好Activity,然后修改activity_main.xml代码

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

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

接下来修改MainActivity中的代码

class MainActivity : AppCompatActivity() {
    private val data=listOf("apple","banana","orange","watermelon","pear","grape","pineappple","cherry","mango","王晨","贺登辉","王丽萍","贺阿宁","贺棹轩")


    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val adapter= ArrayAdapter<String>(this,android.R.layout.simple_list_item_1,data)
        val listView:ListView=findViewById(R.id.listView)
        listView.adapter=adapter
    }
}

定制ListView的界面

只能显示一段文字的ListView实在是很单调,我们来对ListView界面进行定制
接着定义一个实体类,作为ListView适配器的适配类型

class Fruit(val name:String,val imageId:Int)

name表示水果名字,id表示水果对应图片的资源id

在layout目录下新建fruit_item.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="60dp">

    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_gravity="center_vertical"
        android:layout_marginLeft="10dp"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:layout_marginLeft="10dp"/>

</LinearLayout>

接下来需要创建一个自定义的适配器,这个适配器继承自ArrayAdapter,并将泛型指定为Fruit类,新建类FruitAdapter,代码如下

class FruitAdapter(activity: Activity, val resourceId:Int, data:List<Fruit>):ArrayAdapter<Fruit>(activity, resourceId,data){
        override fun getView(position: Int, convertView: View?, parent:ViewGroup):View{
            val view=LayoutInflater.from(context).inflate(resourceId,parent,false)
            val fruitImage:ImageView=view.findViewById(R.id.fruitImage)
            val fruitName:TextView=view.findViewById(R.id.fruitName)
            val fruit=getItem(position)
            if(fruit!=null){
                fruitImage.setImageResource(fruit.imageId)
                fruitName.text=fruit.name
            }
            return view
        }

}

最后修改MainActivity中的代码

class MainActivity : AppCompatActivity() {
    //private val data=listOf("apple","banana","orange","watermelon","pear","grape","pineappple","cherry","mango","王晨","贺登辉","王丽萍","贺阿宁","贺棹轩")

    private val fruitList=ArrayList<Fruit>()
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        initFruits()
        val adapter= FruitAdapter(this,R.layout.fruit_item,fruitList)
        val listView:ListView=findViewById(R.id.listView)
        listView.adapter=adapter
    }
    private fun initFruits(){
        repeat(2){
            fruitList.add(Fruit("apple",R.drawable.apple_pic))
            fruitList.add(Fruit("banana",R.drawable.banana_pic))
            fruitList.add(Fruit("orange",R.drawable.orange_pic))
            fruitList.add(Fruit("watermelon",R.drawable.watermelon_pic))
            fruitList.add(Fruit("pear",R.drawable.pear_pic))
            fruitList.add(Fruit("grape",R.drawable.grape_pic))
            fruitList.add(Fruit("pineapple",R.drawable.pineapple_pic))
            fruitList.add(Fruit("strawberry",R.drawable.strawberry_pic))
            fruitList.add(Fruit("cherry",R.drawable.cherry_pic))
        }
    }
}

提升ListView的运行效率

目前ListView运行效率很低,因为在FruitAdapter的getView()方法,每次都将布局重新加载一遍,当ListView快速滚动的时候,就会成为性能的瓶颈

getView()方法中还有一个convertView参数,这个参数用于将之前加载好的布局进行缓存,以便之后进行重用

class FruitAdapter(activity: Activity, val resourceId:Int, data:List<Fruit>):ArrayAdapter<Fruit>(activity, resourceId,data){
        override fun getView(position: Int, convertView: View?, parent:ViewGroup):View{
            val view:View
            if(convertView==null){
                view=LayoutInflater.from(context).inflate(resourceId,parent,false)
            }else{
                view=convertView
            }


            val fruitImage:ImageView=view.findViewById(R.id.fruitImage)
            val fruitName:TextView=view.findViewById(R.id.fruitName)
            val fruit=getItem(position)
            if(fruit!=null){
                fruitImage.setImageResource(fruit.imageId)
                fruitName.text=fruit.name
            }
            return view
        }

}

不过目前我们这个代码还可以继续优化,虽然现在不会再重复去加载布局,但是每次在getView()方法中仍然会调用View的findViewById()方法来获取一次控件的实例,我们可以借助ViewHolder来对这部分性能进行优化

class FruitAdapter(activity: Activity, val resourceId:Int, data:List<Fruit>):ArrayAdapter<Fruit>(activity, resourceId,data){
    inner class ViewHolder(val fruitImage:ImageView,val fruitName:TextView)
            override fun getView(position: Int, convertView: View?, parent:ViewGroup):View{
            val view:View
            val viewHolder:ViewHolder
            if(convertView==null){

                view=LayoutInflater.from(context).inflate(resourceId,parent,false)
                val fruitImage:ImageView=view.findViewById(R.id.fruitImage)
                val fruitName:TextView=view.findViewById(R.id.fruitName)
                viewHolder =ViewHolder(fruitImage,fruitName)
                view.tag=viewHolder
            }else{
                view=convertView
                viewHolder=view.tag as ViewHolder
            }



            val fruit=getItem(position)
            if(fruit!=null){
                viewHolder.fruitImage.setImageResource(fruit.imageId)
                viewHolder.fruitName.text=fruit.name
            }
            return view
        }

}

ListView的点击事件

class MainActivity : AppCompatActivity() {
    //private val data=listOf("apple","banana","orange","watermelon","pear","grape","pineappple","cherry","mango","王晨","贺登辉","王丽萍","贺阿宁","贺棹轩")

    private val fruitList=ArrayList<Fruit>()
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        initFruits()
        val adapter= FruitAdapter(this,R.layout.fruit_item,fruitList)
        val listView:ListView=findViewById(R.id.listView)
        listView.adapter=adapter
        listView.setOnItemClickListener{
                _, _, position, _ ->val fruit=fruitList[position]
            Toast.makeText(this,fruit.name,Toast.LENGTH_LONG).show()
        }
    }
    private fun initFruits(){
        repeat(2){
            fruitList.add(Fruit("banana",R.drawable.banana_pic))
            fruitList.add(Fruit("orange",R.drawable.orange_pic))
            fruitList.add(Fruit("watermelon",R.drawable.watermelon_pic))
            fruitList.add(Fruit("pear",R.drawable.pear_pic))
            fruitList.add(Fruit("grape",R.drawable.grape_pic))
            fruitList.add(Fruit("pineapple",R.drawable.pineapple_pic))
            fruitList.add(Fruit("strawberry",R.drawable.strawberry_pic))
            fruitList.add(Fruit("cherry",R.drawable.cherry_pic))
        }
    }
}