一、问题描述
最近在Check团队成员代码的时候,发现大部分团队使用RecyclerView和ListView的布局文件,都没有很友好的展示出这个布局对应的item布局,如下所示:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:id="@+id/rv_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="@null"
android:scrollbars="none" />
</android.support.constraint.ConstraintLayout>
完全不知道这个界面即将展示出来到底是什么样的效果,如何可以使该布局有一个直观的预览效果呢?
二、tools:listitem 介绍
2.1 使用 属性 tools:itemCount 和 tools:listitem 给RecyclerView添加直观预览效果
因此我建议团队成员如果这个RecyclerView和ListView的布局内容比较简单的话,可以使用tools:listitem来指定item项对应的布局文件,给这个布局加个一个直观的预览效果,如下所示:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:id="@+id/rv_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="@null"
android:scrollbars="none"
tools:itemCount="5"
tools:listitem="@layout/item_list" />
</android.support.constraint.ConstraintLayout>
layout/item_list.xml 代码如下所示
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:tools="http://schemas.android.com/tools"
android:gravity="center_vertical">
<!-- 英文首字母 或者显示汉字笔画数 -->
<TextView
android:id="@+id/sortTitle"
android:layout_width="match_parent"
android:layout_height="24dp"
android:background="#f5f5f5"
android:paddingLeft="16dp"
android:gravity="center_vertical"
tools:text="A"
android:textColor="#888888"/>
<!--地区名称-->
<TextView
android:id="@+id/country_region_name"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:layout_gravity="center_vertical"
android:layout_below="@id/sortTitle"
android:layout_marginLeft="16dp"
android:gravity="center_vertical"
tools:text="中国"
android:textSize="16sp"
android:textColor="#222222"/>
<!-- 地区代码 -->
<TextView
android:id="@+id/areaCode"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:layout_below="@id/sortTitle"
android:layout_alignParentRight="true"
android:layout_marginRight="50dp"
android:gravity="center_vertical"
tools:text="+86"
android:textSize="16sp"
android:textColor="#888888"/>
<!--item分割线-->
<View
android:id="@+id/area_split_line"
android:layout_below="@id/country_region_name"
android:layout_width="match_parent"
android:layout_height="1px"
android:layout_marginLeft="16dp"
android:background="#dfdfdf"/>
</RelativeLayout>
上面有两个属性 tools:itemCount 和 tools:listitem,下面来介绍下这两个属性
2.2 tools:listitem 介绍
这个属性可以直接指示 RecyclerView和AdapterView的子类(比如:ListView、GridView)的item的布局文件,这样就可以在布局文件中直接有个很直观的预览效果。
这些属性不适用于Android Studio 2.2中的ListView,但这在2.3中已修复
- 在RecyclerView中使用
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:id="@+id/rv_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="@null"
android:scrollbars="none"
tools:itemCount="5"
tools:listitem="@layout/item_list" />
</android.support.constraint.ConstraintLayout>
- 在ListView中使用
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:id="@+id/lv_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="@null"
android:scrollbars="none"
tools:listitem="@layout/item_list" />
</android.support.constraint.ConstraintLayout>
2.3 tools:itemCount 介绍
对于给定的RecyclerView,此属性指定布局编辑器应在“预览”窗口中呈现的项目数。不同的数目,预览的个数不一样。
-
tools:itemCount 指定为5时
-
tools:itemCount 指定为9时
- 这个属性似乎在ListView上无效
2.4 tools:listheader 和 tools:listfooter 属性
RecyclerView 现在仅支持了以上两个 tools属性:tools:itemCount 和 tools:listitem
而对于AdapterView 的子类如 ListView, GridView 等, 还支持 tools:listheader 和 tools:listfooter 属性
如下所示:
layout/activity_listview.xml 代码如下
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ListView
android:id="@+id/lv_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="@null"
android:scrollbars="vertical"
tools:listfooter="@layout/footer_list"
tools:listheader="@layout/header_list"
tools:listitem="@layout/item_list" />
</RelativeLayout>
添加了一个 Header的预览效果,指定header为layout/header_list.xml
layout/header_list.xml 代码如下
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:tools="http://schemas.android.com/tools"
android:gravity="center_vertical">
<!-- 英文首字母 或者显示汉字笔画数 -->
<TextView
android:id="@+id/sortTitle"
android:layout_width="match_parent"
android:layout_height="24dp"
android:background="#f5f5f5"
android:paddingLeft="16dp"
android:gravity="center_vertical"
tools:text="Header Header Header Header"
android:textColor="#888888"/>
</RelativeLayout>
三 参考链接
- https://juejin.im/entry/5afa8bfc518825673b622b81
- https://developer.android.com/studio/write/tool-attributes
- https://www.jianshu.com/p/2b1b6b7e4301
作者:欧阳鹏 欢迎转载,与人分享是进步的源泉!
转载请保留原文地址:https://blog.csdn.net/qq446282412/article/details/88569343
☞ 本人QQ: 3024665621
☞ QQ交流群: 123133153
☞ github.com/ouyangpeng
☞ [email protected]