安卓开发之用RecyclerView做陈列式布局
哈哈哈,好久没写东西了,先看看效果图吧,做成了gif的,用初中语文老师教的就是,更加形象生动了!!!哈哈,我真是个小机灵鬼。
就是类似淘宝商品浏览的界面,我是参照小红书的哈哈哈,我简直太爱小红书的交互设计了kakaka!! 清晰明了,简直不能再爱了哈哈哈,hh好像跑偏了,来,回正题,咳咳
直接看代码点这里
ennn,其实一开始我是不知道这种界面效果叫做陈列式布局,然后网上搜了好多仿淘宝商品的,都是写的商品详情页,然后决定自己写一写,发现意外的简单哈哈哈,RecyclerView简直不能再爱了( 我好像一个渣男??见一个爱一个哈哈哈)
简单介绍一下Recyclerview吧(其实我并没有很懂哈哈哈~~~) (所以,以下部分来自摘抄hhh)
不想看的可以直接跳后面 代码
RecyclerView是安卓5.0之后提供的用于**在有限的窗口范围内显示大量数据的控件**。
(就是类似你逛淘宝的时候,那些商品都是以一块一块的,一个item一个item这样展示出来的,那部分就是用RecyclerView做出来的,简单说来就是以列表的形式展示出来。)
另外还有一种也是用于以列表形式展示数据的是ListView,但是ListView没有RecyclerView那么灵活,具体区别如下
【1】展示效果
ListView只能展示竖直的列表效果。
RecyclerView可以展示更多的界面效果,如横向、竖向的列表效果,瀑布流效果、GridView的效果,这些效果主要是通过LayoutManager类来实现的。(我写的陈列式布局采用的就是GridView表格的效果实现的。)
【2】适配器
ListView主要有三种常用的数据适配器,BaseAdapter、SimpleAdapter、ArrayAdapter(具体不写了,写不动了,老娘乏了,大家感兴趣的可以去请度娘喝杯茶hh)
RecyclerView使用RecyclerView.Adapter适配器,该适配器将BaseAdapter中的getView()方法拆分为onCreateViewHolder()方法和onBindViewHolder()方法,强制使用ViewHolder类,式代码编写规范化,避免了初学者写的代码性能不佳。
【3】复用效果
ListView复用item对象的工作需要开发者通过convertView的setTag()方法和getTag()方法进行操作。
RecyclerView复用item对象的工作由控件自己实现。
【4】动画效果
RecyclerView可以通过setItemAnimator()方法为item添加动画效果。
ListView不可以通过该方法为item添加动画效果。
ok,进入正题!!
一、使用RecyclerView要先导入recyclerview-v7库
二、在layout文件夹内,新建一个xml文件,编写你要展示的item的样式
名字随便起,怎么开心怎么起hhh,不过不能出现大写字母和中文(不过还是建议起名规范一点)
这个展示出来的就是你单独一个item的样子,我的预览图长这样
<?xml version="1.0" encoding="utf-8"?>
<!--这个background引用的是另外写的一个设置背景效果为圆角的xml文件,我前面的文章有写过,有兴趣的可以看看-->
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="@drawable/home_item_shape">
<!--图片或视频区域,这个地方我还没改好,我的item背景是设置成圆角的,但是这里图片显示的时候盖住了那个圆角,所以显示出来的是直角,后面有时间再改改-->
<ImageView
android:id="@+id/home_item_img"
android:layout_width="200dp"
android:layout_height="200dp" />
<!--标题区域,最大行数为2-->
<TextView
android:id="@+id/home_item_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:maxLines="2"
android:text="标题"
android:textColor="#333"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<!--头像图片,这个CricleImageView是另写的一个类继承自ImageView,用来实现圆形的图片效果和缩放效果的-->
<com.example.dumb.CircleImageView
android:id="@+id/home_item_head"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_margin="8dp"
android:src="@drawable/user"
android:scaleType="centerCrop"
android:layout_gravity="center"/>
<!--昵称区域-->
<TextView
android:id="@+id/home_item_username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="阿呆"
android:textSize="12sp"
android:textColor="#333333"/>
<!--点赞区域-->
<LinearLayout
android:id="@+id/home_item_good"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="8dp"
android:orientation="vertical"
android:layout_gravity="top"
android:gravity="right">
<ImageView
android:layout_width="30dp"
android:layout_height="25dp"
android:src="@drawable/good_unchecked"/>
<TextView
android:layout_width="25dp"
android:layout_height="wrap_content"
android:gravity="center"
android:text="123"
android:textSize=