详解Android中ListView实现图文并列并且自定义分割线(完善仿微信APP)

昨天的(今天凌晨)的博文《Android中Fragment和ViewPager那点事儿》中,我们通过使用Fragment和ViewPager模仿实现了微信的布局框架。今天我们来通过使用ListView实现其中联系人一栏的基本视图,效果如下:

要实现上图的效果,我们要用到两个知识点:

1、这里我们使用自定义适配实现图文列表(当然也可以用SimpleAdapter)

通过继承BaseAdapter(抽象类)自定义适配器可以实现更灵活更复杂的列表。

自定义适配器ListView的优化:

(1)使用固定宽高(match_parent)的ListView,有助于在填充item(ListView中每行的布局)时避免重复渲染ListView组件,导致重复多次调用getView方法。

(2)Convertview用来重复使用已被影藏的item对象,从而避免重复创建每个item的view对象。

(3)使用ViewHolder优化提高容器中查找组件的效率。

2、ListView自定义分割线

中默认添加分割线(Divider),但这个默认分割线太丑,我们往往需要自定义分割线样式提升用户体验,这里介绍两种方法

(1)在layout中的ListView组件中添加android:divider ="#FFFFFF",然后在ListView对应的item布局中使用View组件添加分割线(后面代中会演示)

(2)在drawable建立inset文件来定义分割线的位置以及颜色,在values下的diments.xml中添加属性定义分割线的粗细(dp)

drawable建立inset文件如下:

 <?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
   android:insetLeft="5dp"
   android:insetRight="5dp"
   android:drawable="@color/colorline">
 </inset>

inset属性:定义嵌入的可绘制资源。它必须是根元素。属性如下(ATTRIBUTES):

xmlns:android 字符串值,必须的。它定义了XML的命名空间,必须是:http://schemas.android.com/apk/res/android

android:drawable :要绘制的资源,必须的,它指向一个要嵌入的可绘制资源。

android:insetTop :尺寸值。用尺寸值或Dimension资源定义顶部的嵌入位置。

android:insetRight :尺寸值。用尺寸值或Dimension资源定义右边的嵌入位置。

android:insetBottom :尺寸值。用尺寸值或Dimension资源定义底部的嵌入位置。

android:insetLeft :尺寸值。用尺寸值或Dimension资源定义左边的嵌入位置。

values下的diments.xml文件如下(list_item_line为自定义的分割线粗细):

 <resources>
   <!-- Default screen margins, per the Android Design guidelines. -->
   <dimen name="activity_horizontal_margin">dp</dimen>
   <dimen name="activity_vertical_margin">dp</dimen>
   <dimen name="list_item_line">dp</dimen>
 </resources>

ListView中的声明方式(添加divider以及dividerHeight属性分别设置为drable以及diments中自定义的样式):

 <ListView
   android:id="@+id/contact_list"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_alignParentTop="true"
   android:layout_alignParentStart="true"
   android:divider="@drawable/list_item_divider"
   android:dividerHeight="@dimen/list_item_line"/>

以上就是我们本次主要使用的知识点,下面我们继续昨天的代码,做整体效果演示:

第一步:重构昨天layout中contactlist_fragment.xml文件:

ListView组件中添加android:divider ="#FFFFFF",使默认分割线不可见

 <?xml version="." encoding="utf-"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:orientation="vertical">
   <TextView
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:text="联系人管理"
     android:textSize="sp"/>
   <ListView
     android:id="@+id/contact_list"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentTop="true"
     android:layout_alignParentStart="true"
     android:divider ="#FFFFFF"/>
 </LinearLayout>

第二步:layout中添加listView对应的item布局文件contactlist_item.xml

后面添加了View组件用于自定义分割线

 <?xml version="." encoding="utf-"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:orientation="vertical" android:layout_width="match_parent"
   android:layout_height="match_parent">
   <LinearLayout
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:padding="dp"
     android:orientation="horizontal">
     <ImageView
       android:id="@+id/friend_iv"
       android:layout_width="dp"
       android:layout_height="dp"
       android:background="@mipmap/ic_launcher" />
     <TextView
       android:id="@+id/friend_tv"
       android:layout_width="match_parent"
       android:layout_height="dp"
       android:layout_marginLeft="dp"
       android:gravity="center_vertical"
       android:text="wu"
       android:textSize="dp" />
   </LinearLayout>
   <View
     android:layout_width="match_parent"
     android:layout_height="dp"
     android:layout_marginLeft="dp"
     android:layout_marginRight="dp"
     android:background="@color/colorline"/>
 </LinearLayout>

第三步:重写昨天java中对应的ContactListFragment.java文件

 import android.content.Context;
 import android.os.Bundle;
 import android.support.annotation.Nullable;
 import android.support.v.app.Fragment;
 import android.view.LayoutInflater;
 import android.view.View;
 import android.view.ViewGroup;
 import android.widget.BaseAdapter;
 import android.widget.ImageView;
 import android.widget.ListView;
 import android.widget.TextView;
 /**
 * Created by panchengjia on //.
 */
 public class ContactListFragment extends Fragment {
   ListView contact_list;
   String[] names = {"郭嘉", "黄月英", "华佗", "刘备", "陆逊", "吕布", "吕蒙", "马超", "司马懿", "孙权", "孙尚香", "夏侯惇",
       "许褚", "杨修", "张飞", "赵云", "甄姬", "周瑜", "诸葛亮"};
   int[] icons = {R.mipmap.guojia, R.mipmap.huangyueying, R.mipmap.huatuo,
       R.mipmap.liubei, R.mipmap.luxun, R.mipmap.lvbu, R.mipmap.lvmeng,
       R.mipmap.machao, R.mipmap.simayi, R.mipmap.sunquan, R.mipmap.sunshangxiang,
       R.mipmap.xiahoudun, R.mipmap.xuchu, R.mipmap.yangxiu, R.mipmap.zhangfei,
       R.mipmap.zhaoyun, R.mipmap.zhenji, R.mipmap.zhouyu, R.mipmap.zhugeliang};
   @Nullable
   @Override
   public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
     View view = inflater.inflate(R.layout.contactlist_fragment,container,false);
     contact_list= (ListView) view.findViewById(R.id.contact_list);
     contact_list.setAdapter(new MyListViewAdapter(getContext()));
     return view;
   }
   class MyListViewAdapter extends BaseAdapter{
     Context context;
     public MyListViewAdapter(Context context) {
       this.context = context;
     }
     @Override
     public int getCount() {
       return names.length;
     }
     @Override
     public Object getItem(int position) {
       return names[position];
     }
     @Override
     public long getItemId(int position) {
       return position;
     }
     @Override
     public View getView(int position, View convertView, ViewGroup parent) {
       ViewHold vh;
       if (convertView == null) {
         convertView = LayoutInflater.from(context).inflate(R.layout.contactlist_item, null);
         vh = new ViewHold();
         vh.iv = (ImageView) convertView.findViewById(R.id.friend_iv);
         vh.tv = (TextView) convertView.findViewById(R.id.friend_tv);
         convertView.setTag(vh);
       }
       vh = (ViewHold) convertView.getTag();
       vh.iv.setImageResource(icons[position]);
       vh.tv.setText(names[position]);
       return convertView;
     }
     class ViewHold {
       ImageView iv;
       TextView tv;
     }
   }
 }

今天就到这了,明天我们继续对此布局功能进行扩展,睡觉啦。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android实现文件的分割和组装

    本文以实例形式讲述了Android实现文件的分割和组装的方法,主要是针对UDP数据包进行的分割和组装.分享给大家供大家参考之用.具体方法如下: 一般来说,在使用UDP数据包发送文件时,由于UDP数据包大小的限制,一个文件要放在几个UDP数据包里面发送,这就需要把一个文件分割成若干部分,分别放进若干个UDP数据包里面,在接收端,收到这些UDP数据包以后,再对文件进行组装,从而得到一个完整的文件.步骤如下: 一.定义的相关变量: // 要分割的文件 public static RandomAcces

  • Android控件系列之EditText使用方法

    学习目的: 1.掌握在Android中如何建立EditText2.掌握EditText的常用属性3.掌握EditText焦点的事件.按键的事件(监听器) 介绍: EditText是接受用户输入信息的最重要控件.通过前面课程的学习,您可能会猜到可以利用EditText.getText()获取它的文本,但真正的项目中,可能没那么简单,需要更多的限制,如文本长度限制,是否数字限制等等. 鉴于手机屏幕尺寸有限,您可能总想着如何节约控件.在每个用户需要填写内容的文本框的左边加上标题在PC上是一种优雅的方法

  • Android中控件GridView实现设置行列分割线的方法示例

    前言 虽然Aandroid目前已经有RecyclerView了.非常强大的一个View.可以直接控制成ListView以及GridView等.而且画框线也比较方便.但是呢在很多情况下我们不得不仍然使用GridView来实现布局.那么在这个时候我们又要怎么来对GridViw进行画框线呢.下面将提供两种实现方式.大家可以选择一下 一.设置垂直.横向间距.通过GRIDVIEW和ITEM的背景色来实现 1.设置GridView背景色 2.设置水平和竖直方向间隔:android:horizontalSpa

  • Android中Split()字符串分割特殊用法案例详解

    split()分割字符串 1.不同环境下的区分 Java:分割字符串不能写成split("$")//$为要分割的字符 Android:分割字符串需要加上中括号split("[$]")//$为要分割的字符 2.特殊用法--当split()分割字符串遇上特殊符号 案例分析 String str = "abc|dfg"; String[] all=str.split("|"); system.out.println(all[0]);

  • android利用xml实现分割线

    因为没有美工, 所以只能自己动手了. 在layout文件夹里的xml 写 方法1:在layout里面的布局xml 文件里加上面的代码 <View android:layout_width="match_parent" android:layout_height="1dp" android:background="@color/orange_normal" /> 效果图 在drawable文件夹里用 shape line 或 recta

  • Android取消EditText自动获取焦点默认行为

    在项目中,一进入一个页面, EditText默认就会自动获取焦点. 那么如何取消这个默认行为呢? 在网上找了好久,有点 监听软键盘事件,有点 调用 clearFouse()方法,但是测试了都没有! xml中也找不到相应的属性可以关闭这个默认行为 解决之道:在EditText的父级控件中找一个,设置成 复制代码 代码如下: android:focusable="true" android:focusableInTouchMode="true" 这样,就把EditTex

  • Android 关于ExpandableListView去掉里头分割线的方法

    关于ExpandableListView, 自己写了个类继承自BaseExpandableListAdapter groups,childs 都弄好了,显示出来的效果跟网上很多demo一样,我现在就是想去掉那个组下面各item间的分割线 有知道的么? ------解决方案-------------------- expandableList.setDivider(null); up,还不行就设置一个透明的颜色. ------解决方案-------------------- 可以的, androi

  • Android中EditText实现不可编辑解决办法

    android:editable is deprecated: Use an <EditText> to make it editable android:editable is deprecated: Use inputType instead 分析:关于EditText控件的read-only问题,即: 无法通过UI更改其中的内容, 但可以选定部分内容, 进行复制.在早期的sdk, EditText有Editable属性, 现在这个属性已经deprecated了.   解决方法: 其实只需

  • Android EditText实现分割输入内容

    在项目中可能会有许多需要输入手机号码.银行卡号或者身份证号等内容的输入框.如果直接输入的话将会是一堆号码堆在一起,第一是不太美观,第二也容易出错,用户体验不太好.但是若将输入的号码按特定格式进行分割将会大大提高用户体验! 以下是对常用的号码进行简单封装的自定义输入框控件,方便我们在开发过程中使用: 该控件支持xml属性指定,也支持代码指定: 该控件支持类型分别为电话号码(000 0000 0000).银行卡号(0000 0000 0000 0000 000)和身份证号(000000 0000 0

  • Android RecyclerView网格布局(支持多种分割线)详解(2)

    上篇Android RecyclerView 详解(1)-线性布局 记录了下RecyclerView的使用方法,并且讲述了线性布局列表的使用方法,在此基础上加上了万能分割线,支持颜色分割线和图片分割线,同时支持对分割线设置线宽. 这篇是总结一下网格布局的使用,同样也支持两种分割线和线宽的设置. 主要的相关类: 1. RecyclerView.Adapter 2. GridLayoutManager 网格布局管理器 3. RecycleView.ItemDecoration 分割线 下面就直接通过

随机推荐