白话Android自定义ListView实现-程序员宅基地

技术标签: ListView  UI  Android 开发  移动开发  Android Studio  Android  

Android ListView大概算是Android中最常用也是最难用的一个控件,老实说之前这个控件的用法着实让我别扭了一阵子,要知道看程序能懂,但离了书之后发现就是写不出来的感觉真是相当失落。好在,现在终于能够自己写出来的,所以在这里记录一下我写自定义ListView的过程,提供一个思路,希望能够帮助到一些初学者。

真问主要分三个部分来介绍自定义ListView:

  1. 基本的ListView实现
  2. 自定义子项的ListView实现
  3. 自定义ListView的简单优化

要写自定义ListView,首先心里对ListView要有最基础的认识,ListView就是一个控件,这个控件可以上下滑动,控件上有一个一个的Item,这就是ListView的基本形象,接下来我们就从实现最简单的ListVeiw开始。
环境:Android Studio

基本的ListView实现


忽略新建项目的过程…
首先,既然是一个控件,那么自然是要在主布局中添加ListView控件,核心代码如下:

<com.example.citylistview.MyListView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/list_view" >
    </com.example.citylistview.MyListView>

以上是一个最简单的控件布局,也是最简单的属性设置,不用解释;
接着,既然放置了一个控件,那就在MainActivity中新建一个ListView控件,并利用控件id将控件变量与改控件关联起来,核心代码如下:、

private MyListView myCityListView;
myCityListView = findViewById (R.id.list_view);

在完成这一步之后,可以想到ListView中还没有Item对吧,那么就来新建一个String类型的数组,其中的每个变量即为每个Item,代码如下:

private String[] city = {
   "Beijing", "Nanjing", "Shanghai", "Chengdu", "Tianjin"...};

这个变量中可以多写一些,这样List就会长一些,由于ListView是使用Adapter来作为输入的列表变量,那么就需要新建一个Adapter类型变量并和这个String类型的列表关联在一起:

private ArrayAdapter<String> mArrayAdapter;
mArrayAdapter = new ArrayAdapter<String>(MainActivity.this, android.R.layout.simple_list_item1, city);

可以看出,这个构造函数接受三个参数,第一个是Context类型,传入MainActivity.this,第二个是Android自带的一个Item layout,可以理解为一个只带有一个TextView的小横条;
最后用mListView变量将这个adapter放置进去就ok了:

myCityListView.setAdapter (cityAdapter);

接着跑一跑结果就是这样:


效果图

基本的ListView实现思路比较清晰,也不难,接下来我们准备实现自定义子项的ListView;

自定义子项的ListView实现


自定义子项的ListView主要是为了实现定义ListView的item栏,从上一个部分可以看到ListView的每一栏就是一个TextView,这样未免有点儿单调,因此我们现在要实现的自定义ListView就要在每个item中放置一个ImageView和一个TextView。

首先,既然要改变item这一栏,那自然就不能用上个部分使用的”android.R.layout.simple_list_item1”这个自带item,因此,我们新建一个layout,命名为item_layout,布局如下:

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/city_name"
        android:layout_gravity="center_vertical"
        android:textSize="18sp"/>

可以看出来代码很简单,一个ImageView,一个TextVeiw搞定;因为现在一个Item中有ImageView和TextView,也就是说这两个东西应该属于绑定到一起,那么自然想到将这两个变量放到一个类中来管理,因此我们在src/java中新建一个City类:

public class City {

    private String name;
    private int imageId;

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

    public String getName(){
        return name;
    }

    public int getImageId() {
        return imageId;
    }
}

这个d代码也很简单,name用于给item中的TextView赋值,imageId则用于给item中的ImageView赋值,这边儿之所以是一个int类型的变量,是因为我们在设置IamgeVeiw资源的的时候使用的是资源id;
接下来就是之前一直让让我头疼的ArrayAdapter<>这个类型的变量,由于我们一开始直接使用ArrayAdapter这个类型的变量,其实是调用的类中getView()这个方法,而这个默认的gitView方法只是获取一个TextVeiw变量,而现在我们在item中多了一个ImageView,因此我们就需要重写这个getView方法,所以我们新建一个CityAdapter继承自ArrayAdapter类:

public class CityAdapter extends ArrayAdapter<City> {
    
    private int newResourceId;
    public CityAdapter(Context context, int resourceId, List<City> cityList){
        super(context, resourceId, cityList);
        newResourceId = resourceId;
    }

    @Override
    public View getView(final int position, View convertView, ViewGroup parent){

        City city = getItem (position);
        View view = LayoutInflater.from (getContext ()).inflate (newResourceId, parent, false);

        TextView cityName = view.findViewById (R.id.city_name);
        ImageView cityImage = view.findViewById (R.id.city_image);

        cityName.setText (city.getName ());
        cityImage.setImageResource (city.getImageId ());
        return view;
    }
}

这个类中就一个构造函数和一个getView方法,构造函数接收三个参数,resourceId为我们自己定义个Item项的layout,cityList就是之前的String类型数组;

最重要的在于getView方法,这个方法的主要目的就是为了获得ListView的每个Item项,简单的理解就是ListView中的一行一行,所以需要返回一个View类型变量;

getView这个方法现在来看比较清晰,一定要知道position参数就是每一项的位置参数,用这个参数就可以得到每一项对应的City变量;利用LayouInflater的inflate方法(这个方法很重要)获得Item的layout对应的View变量,然后利用这个View找到每一行中的ImageView和TextView控件,最后给这两个控件设置文字的图像资源。这么一看,思路就比较清晰了吧。

于是,效果就是这样:


效果图

——图片就不要纠结了,自己找的…

这里有一点需要特别注意:因为ImageView和TextView是在item layout的布局上,所以我们在使用findView方法的时候必须是view.findVeiw,否则无法找到对应的两个控件!

最后,我们来讲一下自定义ListView的一些提高效率的方法;

自定义ListView的简单优化


  • 利用convertView缓存
  • 新建内部ViewHolder类
  • ListView的点击响应
  • //ListView回弹效果实现

在我们实现自定义ListView之后,其实ListView的效率是比较低的,因为当我们每次上下滑动ListView的时候,一旦有新的item出现在屏幕中<此处待验证>,CityAdapter类的getView方法就会寻找Item layout,这样极大的降低了效率(这里可以打Log做测试)。因此,我们需要进行优化。

第一种方法是对getView的参数convertView进行判断,因为这个参数实际上是对原先载入的布局进行缓存的结果,因此我们对这个变量进行判断,若不为null,则直接使用这个convertView,若不存在,再去新建这个那个对应于的view,核心代码如下:

getView(final int position, View convertView, ViewGroup parent){
    if(null != convertView){
            view = convertView;
    }
    else{
        view = LayoutInflater.from...
    }
}

虽然这种方法能够使用缓存的convertView来提高效率,但是每次依然要用view去寻找对应的ImageView和TextView,那么有什么方法可以改进呢?第二种方法这个思路是这样的: 在CityAdapter加一个内部类,这个类拥有两个成员变量,分为为ImageView类型和TextView类型,然后将这个类与我们之前缓存的convertView关联在一起,这样的话,一旦convertView存在,则直接将关联的类中的ImageView和TextView取出使用,若不存在,则新建view变量,并将对应的ImageView和TextView存到关联的类中,这样就可以用于之后取出使用了。

首先,在CityAdapter类中添加一个内部类:

public class ViewHolder2{
        private ImageView cityImage;
        private TextView cityName;
    }

然后将getView方法改为:

@Override
    public View getView(final int position, View convertView, ViewGroup parent){
        ViewHolder2 viewHolder;
        if(null != convertView){
            viewHolder = (ViewHolder2) convertView.getTag ();
        }
        else{
            viewHolder = new ViewHolder2 ();
            convertView = LayoutInflater.from (getContext ()).inflate (newResourceId, parent, false);

            Context testContext = getContext ();
            Log.d ("CityAdapter", "test context" + testContext);

            viewHolder.cityImage = convertView.findViewById (R.id.city_image);
            viewHolder.cityName = convertView.findViewById (R.id.city_name);
            viewHolder.cityImage.setImageResource (getItem (position).getImageId ());
            viewHolder.cityName.setText (getItem (position).getName ());
            convertView.setTag (viewHolder);
        }
        Log.d ("CityAdapter", "getView is called");
        return convertView;
    }

其中,setTag和getTag就是上文所讲的将这个内部类与我们所需要的View变量关联起来和获取这个内部类变量的方法。

对ListView做了一些优化之后,我们还应该让ListView可以响应最基本的点击事件。ListView实现点击响应有两种思路:1、在CityAdapter中的getView中得到的View变量,这个其实就是每个item的小横条,那么让它调用setOnClickListener不就可以了吗;2、让ListView直接调用setOnItemClickListener方法;

对于第一种方法,核心代码如下:

convertView.setOnClickListener (new View.OnClickListener () {
    @Override
    public void onClick(View view) {
    Toast.makeText (getContext (), getItem(position).getName (), Toast.LENGTH_SHORT).show ();
    }
});

这个和普通控件的响应一样比较简单;

对于第二种,则在MainActivity中修改,核心代码如下:

myCityListView.setOnItemClickListener(new AdapterView.OnItemClickListener (){
            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, int position, long id){
                City cityTemp = cityList.get (position);
                Toast.makeText (MainActivity.this, cityTemp.getName (), Toast.LENGTH_SHORT).show ();
            }
        });

当点击ListView中的Item时效果如下:


效果图

//稍后补上回弹效果实现!

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/cgwang_1580/article/details/80807475

智能推荐

CSS背景特殊属性值-程序员宅基地

文章浏览阅读52次。CSS代码示例-背景附着属性(background-attachment)-[背景图固定不动,不跟随滚动条滚动]:<html><head><title>背景附着属性 background-attachment</title><style type="text/css">body {background-image:url(../image..._背景附着方式的属性值

Python-第一阶段-第二章 字面量-程序员宅基地

文章浏览阅读863次,点赞24次,收藏18次。Python字面量

《算法导论》第2章 算法基础(插入排序、归并排序、复杂度计算)_61,55,97,30,38,58两轮选择递增排序法-程序员宅基地

文章浏览阅读1k次。(最近在自己学习《算法导论》一本书,之前本来喜欢手写笔记,但是随即发现自己总是把笔记弄丢,所以打算做一个电子版的笔记)(另外书中用的都是伪代码,笔记中如果需要尝试的地方都是python代码)2.1 插入排序 基本思想:将待排序的数列看成两个部分(以从小到大为例),前一半是排序完成的,后一半是乱序的,对于乱序的第一个,开始和前一半里最大的数字、第二大的数字……依次比较,等到合适的位置就将它放进去。然后比对过的数字向后移动一位,相应的排序完成的长度加一,没有排序的减一。如:5 |..._61,55,97,30,38,58两轮选择递增排序法

把这份关于Android Binder原理一系列笔记研究完,进大厂是个“加分项”(2)-程序员宅基地

文章浏览阅读674次,点赞21次,收藏21次。可以看出,笔者的工作学习模式便是由以下。

Vue实战(三):实现树形表格_vue树形表格组件-程序员宅基地

文章浏览阅读1.1k次。实现树形表格_vue树形表格组件

Linux平台下很实用的44个Linux命令-程序员宅基地

文章浏览阅读237次。Linux平台下很实用的44个Linux命令大家好,今天再继续和大家说下基础的命令,实在是不知道基础的东西还有什么是应该和大家讲的了,要是再开基础的东西,我觉得就得和大家说交换机和路由器什么的了。今天和大家说一下linux运维其实一般来说,能精通100+的命令,就是一个合格的运维人员了,意思就是你的基础已经差不多了。但是在实际运维工作中需要经常运用到的一些命令,今天就和大家简单的说一下,因

随便推点

2023年Java华为OD真题机考题库大全-带答案(持续更新)_华为od机试题-程序员宅基地

文章浏览阅读1.2w次,点赞16次,收藏149次。2023年华为OD真题目前华为社招大多数是OD招聘,17级以下都为OD模式,OD模式也是华为提出的一种新的用工形式,定级是13-17级,属于华为储备人才,每年都会从OD项目挑优秀员工转为正编。D1-D5对应薪资10K-35K左右,年终奖2-4个月,周六加班双倍工资,下个月发。入职OD会有一定薪资上涨,之后每年一次加薪,OD转华为一次加薪。等不到转正机会,相对于内部员工来说,容易被裁,不稳定,可能接触不到核心项目,功能。具体转条件:连续N个季度绩效为A,部门有转正名额,排队。_华为od机试题

python selenium自动化之chrome与chromedriver版本兼容问题_chrome版本122.0.6261.112和chromdriver 107.0.5304.62兼容-程序员宅基地

文章浏览阅读2.7k次,点赞3次,收藏10次。在我们使用python+selenium来驱动chrome浏览器时,需要有chromedriver的支持,但是chrome浏览器更新比较频繁,而chrome浏览器和chromedriver则需要保持版本一致(版本一般相差1以内),此时我们就需要手动下载chromedriver来匹配此时的浏览器,但是生产环境操作比较麻烦。此时,我们就想是不是有一个程序来代替我们完成这个工作呢?思路比较当前的chrome浏览器版本号与chromedriver浏览号如果不匹配,则下载一个新的chromedriver替换掉_chrome版本122.0.6261.112和chromdriver 107.0.5304.62兼容吗

测试人员如何规划自己的职业生涯,分享我这些年的测开的总结给大家参考~_测开个人成长计划-程序员宅基地

文章浏览阅读2.7k次,点赞2次,收藏11次。负责开发项目的技术方法。我的一位同事曾经很认真地问过我一个问题,他说他现在从事软件测试工作已经4年了,但是他不知道现在的工作和自己在工作3年时有什么不同,他想旁观者清,也许我能回答他的问题。随着互联网的飞快发展,IT行业出现了日新月异的变化,新的技术会不断出现,你熟练掌握的软件测试技术很快就过时了。至于第三点说的实践和思考就是你对自己学到的东西的一个掌握的程度的检验了,只有实践了你才能知道,这个知识点你到底学会了没有,会了之后有没有什么其他的理解,这个就是需要自己去思考了 ,这种东西都是别人教不了你的!_测开个人成长计划

MATLAB代码:多微网电能互补与需求响应的微网双层优化模型——动态定价与能量管理_配电网和微电网的matlab模型-程序员宅基地

文章浏览阅读734次,点赞21次,收藏13次。主要内容:代码主要做的是考虑多微网电能互补共享的微网双层优化模型,同时优化配电网运营商的动态电价以及微网用户的能量管理策略,在上层,目标函数为配电网运营商的收益最大化,决策变量为配电网运营商的交易电价;主要内容:代码主要做的是考虑多微网电能互补共享的微网双层优化模型,同时优化配电网运营商的动态电价以及微网用户的能量管理策略,在上层,目标函数为配电网运营商的收益最大化,决策变量为配电网运营商的交易电价;最后,我们输出最终的结果,包括最优的用电费用、配网运营商的收益以及每个微网的用电费用分配情况。_配电网和微电网的matlab模型

基于双极性SPWM调制的三相电压型桥式逆变电路原理解析-程序员宅基地

文章浏览阅读378次,点赞3次,收藏3次。首先介绍了逆变电路的基本原理和应用领域,然后详细分析了双极性SPWM调制方式的工作原理和优势。本文通过对三相电压型桥式逆变电路和双极性SPWM调制方式的技术分析,深入探讨了其在电力系统中的应用和性能评估。双极性SPWM调制方式是SPWM调制方式的一种改进形式,它能够更好地抑制谐波,提高逆变电路的输出质量。面对电力系统的不断发展和需求的变化,逆变电路和SPWM调制方式也在不断演进。为了评估三相电压型桥式逆变电路和双极性SPWM调制方式的性能,本节将详细分析其输出波形的失真程度、功率损耗和效率等关键指标。

用cmake 编译 xcode用的clucene静态库(一)_clucene-config.h-程序员宅基地

文章浏览阅读4.5k次。第一步、下载源代码 http://sourceforge.net/projects/clucene/ 第二步、下载cmakehttp://www.cmake.org/cmake/resources/software.html 编译第一步,打开在应用程序中的cmake GUI程序,设置好源代码路径,和输出路径,如图: 第二步,点击Configure,在_clucene-config.h

推荐文章

热门文章

相关标签