Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
ChayChan
ExpandableLinearLayout
提交
93fe4605
E
ExpandableLinearLayout
项目概览
ChayChan
/
ExpandableLinearLayout
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
5
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
E
ExpandableLinearLayout
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
5
Issue
5
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
提交
93fe4605
编写于
7月 22, 2017
作者:
C
chaychan
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
更新Readme
上级
b3cecc32
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
10 addition
and
10 deletion
+10
-10
README.md
README.md
+10
-10
未找到文件。
README.md
浏览文件 @
93fe4605
##ExpandableLinearLayout介绍
###场景介绍
##
ExpandableLinearLayout介绍
###
场景介绍
  
开发的过程中,有时我们需要使用到这样一个功能,在展示一些商品的时候,默认只显示前几个,例如先显示前三个,这样子不会一进入页面就被商品列表占据了大部分,可以先让用户可以看到页面的大概,当用户需要查看更多的商品时,点击“展开”,就可以看到被隐藏的商品,点击“收起”,则又回到一开始的状态,只显示前几个,其他的收起来了。就拿美团外卖的订单详情页的布局作为例子,请看以下图片:
![](
./intro_img/meituan1.jpg
)
...
...
@@ -8,8 +8,8 @@
  
订单详情页面一开始只显示购买的前三样菜,当点击“点击展开”时,则将购买的所有外卖都展示出来,当点击“点击收起”时,则将除了前三样菜以外的都隐藏起来。其实要完成这样的功能并不难,为了方便自己和大家以后的开发,我将其封装成一个控件,取名为ExpandableLinearLayout,下面开始介绍它如何使用以及源码解析。
##使用方式
###一、使用默认展开和收起的底部
##
使用方式
###
一、使用默认展开和收起的底部
在布局文件中,使用ExpandableLinearLayout,代码如下:
<com.chaychan.viewlib.ExpandableLinearLayout
...
...
@@ -83,14 +83,14 @@
![](
./intro_img/ell_1.gif
)
####1.支持修改默认显示的个数
####
1.支持修改默认显示的个数
可以修改默认显示的个数,比如将其修改为3,即defaultItemCount="3"
效果如下:
![](
./intro_img/ell_2.gif
)
####2.支持修改待展开和待收起状态下的文字提示
####
2.支持修改待展开和待收起状态下的文字提示
可以修改待展开状态和待收起状态下的文字提示,比如修改expandText="查看更多",hideText="收起更多"
效果如下:
...
...
@@ -98,7 +98,7 @@
![](
./intro_img/ell_3.gif
)
####3.支持修改提示文字的大小、颜色
####
3.支持修改提示文字的大小、颜色
可以修改提示文字的大小和颜色,对应的属性分别是tipTextSize,tipTextColor。比如修改tipTextSize="16sp",tipTextColor="#ff7300"
...
...
@@ -107,14 +107,14 @@
![](
./intro_img/ell_tip_text_demo.gif
)
####4.支持更换箭头的图标
####
4.支持更换箭头的图标
可以修改箭头的图标,只需配置arrowDownImg属性,引用对应的图标,这里的箭头图标需要是向下的箭头,这样当展开和收起时,箭头会做相应的旋转动画。设置arrowDownImg="@mipmap/arrow
\_
down
\_
grey",修改为灰色的向下图标。
效果如下:
![](
./intro_img/ell_4.gif
)
###二、使用自定义底部
###
二、使用自定义底部
布局文件中,ExpandableLinearLayout配置useDefaultBottom="false",声明不使用默认底部。自己定义底部的布局。
...
...
@@ -212,7 +212,7 @@ java文件中,代码如下:
到这里,ExpandableLinearLayout的使用就介绍完毕了,关于ExpandableLinearLayout的源码解析可以查看我的博客:
[
http://blog.csdn.net/Chay_Chan/article/details/72810770
](
http://blog.csdn.net/Chay_Chan/article/details/72810770
)
####
**导入方式**####
####
导入方式
在项目根目录下的build.gradle中的allprojects{}中,添加jitpack仓库地址,如下:
allprojects {
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录