时光轴二之RecyclerView版时光轴效果

因为现在RecyclerView是support-v7包中的新组件,是一个强大的滑动组件,与经典的ListView相比,同样拥有item回收复用的功能,但是直接把viewholder的实现封装起来,用户只要实现自己的viewholder就可以了,该组件会自动帮你回收复用每一个item。

它不但变得更精简,也变得更加容易使用,而且更容易组合设计出自己需要的滑动布局。

使用它的理由:

RecyclerView is a more advanced and flexible version of ListView. This widget is a container for large sets of views that can be recycled and scrolled very efficiently. Use the RecyclerView widget when you have lists with elements that change dynamically.

官方介绍 RecyclerView 是 ListView,grideView以及瀑布流的实现 的升级版本,更加先进和灵活。所以我把上一篇

listView实现时光轴效果改为RecyclerView 来实现,你觉得是不是更加好呢,反正官方都推荐我们使用RecyclerView,这个控件我们再也不需要担心渲染的影响了。

按部就班我们先来布局,

activity_main.xml

<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="match_parent"
   >
    <android.support.v7.widget.RecyclerView
        android:id="@+id/timeline_recyclerview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"/>
</RelativeLayout>
然后item的布局和上一篇的一模一样:(直接copy)
item_time_line.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" >
    <RelativeLayout
        android:id="@+id/rl_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="10dp" >
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginLeft="8dp"
            android:background="@drawable/img_line_point" />
        <TextView
            android:id="@+id/txt_date_time"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginLeft="15dp"
            android:textColor="#FC6802" />
    </RelativeLayout>
    <View
        android:id="@+id/v_line"
        android:layout_width="2dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:background="#FC6802" />
    <ImageView
        android:padding="8dp"
        android:id="@+id/img"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_below="@id/rl_title"
        android:layout_marginLeft="3dp"
        android:layout_toRightOf="@id/v_line"
        android:scaleType="fitXY" />
    <TextView
        android:paddingTop="15dp"
        android:id="@+id/txt_date_content"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/rl_title"
        android:layout_marginLeft="15dp"
        android:layout_toRightOf="@id/img"
        android:paddingBottom="10dp"
        android:maxLines="3"
        android:textColor="#5296C5" />
</RelativeLayout>

好了可以写代码了:

先来一下数据实体:

DateText.java(copy)
package com.zy.timeline.bean;
public class DateText {
private String date;
private String text;
        private int imgsrc;
public DateText(String date, String text,int imgsrc) {
super();
this.date = date;
this.text = text;
this.imgsrc=imgsrc;
}
public String getDate() {
return date;
}
public void setDate(String date) {
this.date = date;
}
public String getText() {
return text;
}
       public void setText(String text) {
this.text = text;
}
public int getImgsrc() {
return imgsrc;
}
public void setImgsrc(int imgsrc) {
this.imgsrc = imgsrc;
}
}

接着数据适配器:

TimeLineAdapter .java

package com.zy.timeline.adapter;
import java.util.List;
import com.zy.timeline.R;
import com.zy.timeline.bean.DateText;
import com.zy.timeline.bean.TimeFormat;
import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.RecyclerView.ViewHolder;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.RelativeLayout.LayoutParams;
import android.widget.TextView;

public class TimeLineAdapter extends
RecyclerView.Adapter<TimeLineAdapter.TimeLineViewHolder> {//这里千万记住TimeLineViewHolder,不然会出错
private Context context;
private LayoutInflater mInflater;
private List<DateText> mDatas;
public TimeLineAdapter(Context context, List<DateText> mDatas) {
this.context = context;
this.mDatas = mDatas;
mInflater = LayoutInflater.from(context);
}
@Override
public int getItemCount() {
return mDatas == null ? 0 : mDatas.size();
}
// 绑定viewHolder
@Override
public TimeLineViewHolder onCreateViewHolder(ViewGroup parent, int viewtype) {
return new TimeLineViewHolder(mInflater.inflate(
R.layout.item_time_line, parent, false));
}
@Override
public void onBindViewHolder(TimeLineViewHolder holder, int position) {
// 时间轴竖线的layout
LayoutParams params = (LayoutParams) holder.line.getLayoutParams();
// 第一条数据,肯定显示时间标题
if (position == 0) {
holder.title.setVisibility(View.VISIBLE);
holder.date_time.setText(TimeFormat.format("yyyy.MM.dd", mDatas
.get(position).getDate()));
params.addRule(RelativeLayout.ALIGN_TOP, R.id.rl_title);
params.addRule(RelativeLayout.ALIGN_BOTTOM, R.id.img);
} else { // 不是第一条数据
// 本条数据和上一条数据的时间戳相同,时间标题不显示
if (mDatas.get(position).getDate()
.equals(mDatas.get(position - 1).getDate())) {
holder.title.setVisibility(View.GONE);
params.addRule(RelativeLayout.ALIGN_TOP, R.id.txt_date_content);
params.addRule(RelativeLayout.ALIGN_BOTTOM, R.id.img);
} else {
// 本条数据和上一条的数据的时间戳不同的时候,显示数据
holder.title.setVisibility(View.VISIBLE);
holder.date_time.setText(TimeFormat.format("yyyy.MM.dd", mDatas
.get(position).getDate()));
params.addRule(RelativeLayout.ALIGN_TOP, R.id.rl_title);
params.addRule(RelativeLayout.ALIGN_BOTTOM, R.id.img);
}
}
holder.line.setLayoutParams(params);
holder.date_content.setText(mDatas.get(position).getText());
holder.img.setImageResource(mDatas.get(position).getImgsrc());
}
final class TimeLineViewHolder extends ViewHolder {
private TextView date_time, date_content;
private View line;
private RelativeLayout title;
        private ImageView img;
public TimeLineViewHolder(View view) {
super(view);
date_time = (TextView) view.findViewById(R.id.txt_date_time);
date_content = (TextView) view.findViewById(R.id.txt_date_content);
line = (View) view.findViewById(R.id.v_line);
title = (RelativeLayout) view.findViewById(R.id.rl_title);
img = (ImageView) view
.findViewById(R.id.img);
}
}
}

接下来就是写mainActivity的代码了;

package com.zy.timeline;
import java.util.ArrayList;
import java.util.Collections;
import java.util.List;
import com.zy.timeline.adapter.TimeLineAdapter;
import com.zy.timeline.bean.DateComparator;
import com.zy.timeline.bean.DateText;
import android.app.Activity;
import android.os.Bundle;
import android.support.v7.widget.DefaultItemAnimator;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.RecyclerView.LayoutManager;

public class MainActivity extends Activity {
private RecyclerView recyclerView;
    private List<DateText>mDatas;
    private TimeLineAdapter mTimeLineAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initData();
}
private void initData() {
mDatas=new ArrayList<DateText>();
DateText date1 = new DateText("20140710", "人生的平衡,内涵也很多。丰富的内涵,是生存的保障,是身心的健康,是自由和快乐生活的均衡全面的发展。真理往往在俗人认为的相反之处,常人好争,“圣人不敢为也”,随和谦让。常人追求美好的东西、好吃的东西吃过多了,以后就再也不能吃了。真理讲的是心,不能离心找身外的原因。",R.drawable.one);
DateText date2 = new DateText("20120209", "夺走你初吻的人现在和你是什么关系",R.drawable.two);
DateText date3 = new DateText("20140526", "不管有多么的舍不得,我们都只有笑过之后,长歌当哭。",R.drawable.three);
DateText date4 = new DateText("20150310", "那些让我们哭过的事,总有一天我们会笑着说出来。",R.drawable.one);
DateText date5 = new DateText("20140911", "你年轻时也曾扬言,要饮遍全世界的酒。老了却发现,白水才是最长情的。",R.drawable.one);
DateText date6 = new DateText("20140713", "我这一个不太宽厚的肩膀只希望你累了能停靠不太温暖却能为你挡住风浪",R.drawable.one);
DateText date7 = new DateText("20141012", "有人问过井上,“为什么不设计湘北最后夺冠?”-井上回答说“因为青春的梦想往往是不完美的…",R.drawable.one);
DateText date8 = new DateText("20140714", "将来的你,一定会感激现在拼命的自己。",R.drawable.one);
DateText date9 = new DateText("20140709", "地球之所以是圆的,是因为上帝想让那些走失或迷路的人重新相遇",R.drawable.one);
DateText date10 = new DateText("20110705", "如果有一天我出事了,我一个电话能到场的有谁?",R.drawable.two);
DateText date11 = new DateText("20120729", "你厌恶自己的生活,然而有人在梦想着过你的生活。",R.drawable.two);
DateText date12 = new DateText("20130725", "很爱很爱你,可你却MD不知道",R.drawable.two);
DateText date13 = new DateText("20140716", "就算现在的他对你再好,都比不过曾经那个伤你最深的人也是如今最熟悉的陌生人,",R.drawable.two);
DateText date14 = new DateText("20140711", "回忆中,总有些瞬间,能温暖整个曾经。",R.drawable.two);
DateText date15 = new DateText("20140710", "我最想旅游的地方,是暗恋者的心。",R.drawable.two);
DateText date16 = new DateText("20140711", "我不是故意 让自己变得不像自己",R.drawable.two);
DateText date17 = new DateText("20100712", "不要求,不一定是没有心声。不流泪,不一定是没有泪痕。不表达,不一定是不爱你",R.drawable.two);
DateText date18 = new DateText("20140711", "谁苍白了谁的等待,谁无悔着谁的执着。",R.drawable.two);
DateText date19 = new DateText("20140715", "网上作者呕心呖血码出的字,他们不费一兵一卒就能轻易地据为己有",R.drawable.three);
DateText date20 = new DateText("20120723", "自从我遇见你那天开始,我的心就像跌进了深深的湖水",R.drawable.three);
DateText date21 = new DateText("20150718", "有些东西,当你拥有时,你认为理所应当。当你失去时,才知道自己没资格。",R.drawable.three);
DateText date22 = new DateText("20130706", "有时候上天没有给你想要的,不是因为你不配,而是你值得拥有更好的。",R.drawable.three);
DateText date23 = new DateText("20110714", "退出没结局的剧",R.drawable.three);
DateText date24 = new DateText("20120726", "曾经的现实,现在已是回忆。",R.drawable.three);
DateText date25 = new DateText("20140325", "谁人曾照顾过我的感受,待我温柔吻过伤口,谁人曾介意我也不好受,为我出头碰过我的手",R.drawable.three);
DateText date26 = new DateText("20140623", "人生归于尘埃如花瓣零落,然而人生生不息,花瓣飘零尘泥,依然花开花落。",R.drawable.three);
DateText date27 = new DateText("20140121", "现在,我们都应忘了对方,重新去过彼此的生活。",R.drawable.three);
DateText date28 = new DateText("20140916", "爱上大声地啊地",R.drawable.three);
DateText date29 = new DateText("20140712", "被人需要是种无法言表却又充满能量的安全感",R.drawable.one);
DateText date30 = new DateText("20140710", "没有信的日子,如同一堆温柴,被回忆点着,一脑子的浓烟。",R.drawable.two);
mDatas.add(date1);
mDatas.add(date2);
mDatas.add(date3);
mDatas.add(date4);
mDatas.add(date5);
mDatas.add(date6);
mDatas.add(date7);
mDatas.add(date8);
mDatas.add(date9);
mDatas.add(date10);
mDatas.add(date11);
mDatas.add(date12);
mDatas.add(date13);
mDatas.add(date14);
mDatas.add(date15);
mDatas.add(date16);
mDatas.add(date17);
mDatas.add(date18);
mDatas.add(date19);
mDatas.add(date20);
mDatas.add(date21);
mDatas.add(date22);
mDatas.add(date23);
mDatas.add(date24);
mDatas.add(date25);
mDatas.add(date26);
mDatas.add(date27);
mDatas.add(date28);
mDatas.add(date29);
mDatas.add(date30);
initView();

}
private void initView() {
recyclerView=(RecyclerView) findViewById(R.id.timeline_recyclerview);
init();

}
private void init() {
// 将数据按照时间排序
DateComparator comparator = new DateComparator();
Collections.sort(mDatas, comparator);
mTimeLineAdapter=new TimeLineAdapter(this, mDatas);
LayoutManager mLayoutManager=new LinearLayoutManager(this, LinearLayoutManager.VERTICAL,true);//垂直的,listView的布局方式
recyclerView.setAdapter(mTimeLineAdapter);
recyclerView.setLayoutManager(mLayoutManager);
recyclerView.setItemAnimator(new DefaultItemAnimator());//默认动画
recyclerView.setHasFixedSize(true);//效率最高
}
}

其他的和上一篇用到的东西一样,也就不贴代码了,接下来还是看一下效果,是不是和listView一样,。看图:


算了我们的代码就写到这里了,6点多了也是下班的时间了,明天下一篇我们将实现用Expandablelistview来实现复杂一点的时光轴.

代码传送门:RecyclerView _linetime.zip,要下班了,马蛋。

自己可以把2个代码对照一下,就能分分钟知道listView改为recyclerView.觉得还行就点个赞吧,请持续关注下一篇 时光轴三之

ExpandableListView版时光轴效果

时间: 2024-10-10 16:43:41

时光轴二之RecyclerView版时光轴效果的相关文章

RecyclerView实现ViewPager效果

RecyclerView实现ViewPager效果,以及横向的ListView效果.效果图如下: Github: https://github.com/hpu-spring87/recyclerviewpager

明明白白学通C语言(二维码版)

明明白白学通C语言(二维码版)清华大学出版社 全书共15章,分为3篇.第1篇为程序的基石--数据,介绍了C语言的概况及其处理的数据的种类,包括整型.实型和字符型等:第2篇为程序的本质--处理数据,介绍了C语言提供的处理数据的各种方法,包括运算符.表达式.语句及其结构等:第3篇为处理大量数据,介绍了C语言提供的对于大量数据的高级处理方法,包括数组.指针.结构和文件操作等. 本书是 一本与众不同的C语言图书,全书以全新的模式来分析和讲解C语言,以期带给读者不同的编程学习体验.本书创造性地将智能手机巧

RecyclerView版的时光轴

因为现在RecyclerView是support-v7包中的新组件,是一个强大的滑动组件,与经典的ListView相比,同样拥有item回收复用的功能,但是直接把viewholder的实现封装起来,用户只要实现自己的viewholder就可以了,该组件会自动帮你回收复用每一个item. 它不但变得更精简,也变得更加容易使用,而且更容易组合设计出自己需要的滑动布局. 使用它的理由: RecyclerView is a more advanced and flexible version of Li

【铜】第131篇 融合一对一canvas视频录制到备份上(二)简版做成及追加图片过程周四

关键词:一对一canvas视频录制, 简版做成,追加图片过程 一.一对一视频录制 1.1 往备份上布录制-----------------bug处理 现在不知道,网页录制都依赖哪些文件,现在需要一个一个的去除.现在去除差不多了,如下: 经过整理发现,仅仅需要两个文件,就能实现录制.如下: 简版访问地址如下: http://localhost:9001/record-canvas-drawings.html#no-back-button 二.追加图片过程 2.1 学生端追加拍照 <li><

二手书网页版mis系统

在小学期这几天的时间,自己将上个学期做的书书网二手书app做出了网页版.该系统只要分为前端用户界面和后端管理员界面. 管理员具有添加书的一级分类和二级分类的功能. 用户具有买书和卖书的功能. 下面是源程序和截图: 截图: 前台界面:     后台界面: 这里的分类用了二级菜单的模式,如果不选择父类,就是添加一级分类,否则就是某一级分类下的二级分类. 下面是源程序的下载路径:(数据库表我就不展示了),主要是一些javabean和servlet.如果想要所有的源代码可以联系我. https://pa

iOS AV Foundation 二维码扫描 03 为扫描到的二维码添加可视化效果

上一节,我们已经实现了二维码的扫描,这一节,我们利用元数据的bounds和corners实现一个可视化的扫描效果. bounds定义了包含二维码图像的矩形,corners定义了二维码图像的实际坐标: 当摄像头和二维码图片完全对齐时,bounds和corners就是相同的.但是通常来说,几乎不可能让摄像头和二维码完全对齐. 打开ViewController.m,添加以下实例变量,用于存放所有检测到得二维码,以二维码的内容为索引. NSMutableDictionary *_barcodes; 在v

《上古天真论》第十二讲文字版

上古天真论篇第十二讲 主讲:徐文兵  主持:梁  冬 播出时间:2009-02-28  23:00—24:00 经文:黄帝曰:余闻上古有真人者,提挈天地,把握阴阳,呼吸精气,独立守神,肌肉若一,故能寿敝天地,无有终时,此其道生.中古之时,有至人者,淳德全道,和于阴阳,调于四时,去世离俗,积精全神,游行天地之间,视听八达之外,此盖益其寿命而强者也,亦归于真人. 梁冬:是的,重新发现中医太美.大家好,欢迎收听今天的<国学堂>之梁冬和徐文兵老师的请教.徐老师您好! 徐文兵:梁冬好!听众朋友们大家好!

Android自定义控件系列(二)—icon+文字的多种效果实现

转载请注明出处:http://www.cnblogs.com/landptf/p/6290810.html 今天给大家带来一个很简单但是很常用的控件ButtonExtendM,在开发中我们经常会用到图片加文字的组合控件,像这样: 以上图片都是从微信上截取的.(暂时没有找到icon在下,文字在上的例子) 下面我们通过一个控件来实现上下左右全部的样式,只需改动一个属性值即可改变icon的位置,是不是很方便,先看下demo效果图: 没错上图的三种不同的样式都是通过同一个控件实现的,下面我们看下代码 第

Android 屏幕适配(二)增强版百分比布局库(percent-support-lib)

转载请标明出处: http://blog.csdn.net/lmj623565791/article/details/46767825: 本文出自:[张鸿洋的博客] 一 概述 上周一我们发布了Android 百分比布局库(percent-support-lib) 解析与扩展中对percent-support这个库进行了解析和添加了PercentLinearLayout的支持. 那么为什么本篇博客的存在的意义是什么呢? 首先我们回顾下百分比布局库的用法,提供了PercentRelativeLayo