Android手把手教你仿简书(iOS版)列表默认加载效果

既然选择了远方,便只顾风雨兼程。当我第一次尝试去进行写作的时候,我就觉得我应该要把它当作习惯一样坚持下去,哪怕每次只有一点点的进步,我也很满足。

好了,言归正传,开始我们今天的主题。在说正题前,咱先上个图。


这是简书iOS版在请求网络数据时列表默认的加载效果


这是简书Android版在请求网络数据时默认的加载效果。

可以看到简书iOS版在获取到网络数据前,先放了张默认的占位图,而Android版简书则放了个SwipeRefreshLayout刷新控件,哈哈,可见连我们著名的简书大大在这加载默认效果上也没能做到统一啊。现在假设咱是简书Android,如果咱要实现iOS版的效果该咋整呢,可能大家的第一反应是伸手向UI要张图一放搞定。如果是这样,那咱今天就没下文了,本文到这里也就结束了。OK,大家可以去休息了。

然而咱今天想给大家介绍的是另一种思路,自己动手绘制上图中的效果。可能有人会说了,你这不是瞎折腾吗,让UI切张图能搞定的事,你非要自己画何必呢。我想说的是一种列表样式你要切张图,如果是另一种列表样式那么你又要切一张图,10个列表样式就得切10个图,其结果是APP体积上升的越来越快,然而APP本身随着功能的迭代就已经很臃肿了,这无疑使得本就庞大的APP变得更加臃肿不堪。相反如果是自己去绘制的画,哪怕UI闲的没事又设计了几十个列表样式,咱也能做到不需要UI的一砖一瓦,变换下布局就能做到轻松应对。

下面开始我们的项目,打开我们的Android Studio,新建个工程命名为CXRecyclerView,新建个布局文件命名为item_recyclerview_default_loading

通过取色器,取得我们需要绘制的灰色条颜色值#f0f0f0


先画个圆形头像,drawable目录下新建个shape_round_head文件,android:shape设置为oval

接着添加View控件,background设置为我们刚刚画的圆形shape_round_head

在接着添加View绘制小横条,背景色设置为我们取色器取到的灰色。

其他的灰色小横条以此类推,最终我们绘制的item效果图如下。

接着自定义个CXDefaultLoadingAdapter并且继承自RecyclerView.Adapter,重写onCreateViewHolder方法,加载我们的默认加载布局item_recyclerview_default_loading,默认加载数量我们这里设置的是20个,当然你也可以设置其他值。

在接下来我们需要自定义个CXRecyclerView,初始化LinearLayoutManager以及刚刚我们自定义的CXDefaultLoadingAdapter。

现在我们回到MainActivity,对SwipeRefreshLayout刷新控件进行初始化设置颜色和背景,对我们刚刚自定义的CXRecyclerView添加分割线。

OK,最终运行后的效果图如下。


最后放上Github地址GitHub - githappygo/CXRecyclerView: 仿简书IOS版默认列表加载效果

下一篇将接着本篇文章为大家带来如何给我们的默认样式添加闪光效果以及模拟请求网络数据成功后替换掉当前的默认加载图。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,001评论 6 498
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,210评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 161,874评论 0 351
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,001评论 1 291
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,022评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,005评论 1 295
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,929评论 3 416
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,742评论 0 271
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,193评论 1 309
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,427评论 2 331
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,583评论 1 346
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,305评论 5 342
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,911评论 3 325
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,564评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,731评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,581评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,478评论 2 352

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 172,052评论 25 707
  • 1、通过CocoaPods安装项目名称项目信息 AFNetworking网络请求组件 FMDB本地数据库组件 SD...
    阳明先生_X自主阅读 15,979评论 3 119
  • 一、秀改 爸爸优点:会做饭,身体健康; 妈妈优点:无私的看孩子,对孩子好; 秀改浍如优点:生俩超级棒的儿子,爱儿子...
    麦田守望_6a6c阅读 150评论 0 0
  • 《笑话方法论》 刘淼 如何讲笑话,增加自己的幽默感。 1.背景知识 有些笑话缺少背景知识就很难听懂,如果你对一个长...
    君小晓阅读 182评论 0 3
  • Windows 10 1.登录node英文版官网:https://nodejs.org/en/中文版官网:http...
    G风阅读 302评论 0 0