Skip to content

Commit 30708d7

Browse files
committed
更新readme
1 parent 292bcf6 commit 30708d7

File tree

5 files changed

+35
-35
lines changed

5 files changed

+35
-35
lines changed

README.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,22 @@
11
# PowerfulViewLibrary
22

3-
###PowerfulEditText(功能强大的EditText)介绍
3+
### PowerfulEditText(功能强大的EditText)介绍
44

55
[https://github.com/chaychan/PowerfulViewLibrary/blob/master/readmes/PowerfulEditText.md](https://github.com/chaychan/PowerfulViewLibrary/blob/master/readmes/PowerfulEditText.md)
66

7-
###NumberRunningTextView(仿支付宝数字滚动的TextView)介绍
7+
### NumberRunningTextView(仿支付宝数字滚动的TextView)介绍
88

99
[https://github.com/chaychan/PowerfulViewLibrary/blob/master/readmes/NumRunningTextView.md](https://github.com/chaychan/PowerfulViewLibrary/blob/master/readmes/NumRunningTextView.md)
1010

11-
###ExpandableLinearLayout(可展开收起的LinearLayout)介绍
11+
### ExpandableLinearLayout(可展开收起的LinearLayout)介绍
1212

1313
[https://github.com/chaychan/PowerfulViewLibrary/blob/master/readmes/ExpandableLinearLayout.md](https://github.com/chaychan/PowerfulViewLibrary/blob/master/readmes/ExpandableLinearLayout.md)
1414

15-
###BottomBarLayout(轻量级底部导航栏)介绍
15+
### BottomBarLayout(轻量级底部导航栏)介绍
1616

1717
[https://github.com/chaychan/PowerfulViewLibrary/blob/master/readmes/BottomBarLayout.md](https://github.com/chaychan/PowerfulViewLibrary/blob/master/readmes/BottomBarLayout.md)
1818

19-
####**导入方式**####
19+
#### **导入方式**
2020
在项目根目录下的build.gradle中的allprojects{}中,添加jitpack仓库地址,如下:
2121

2222
allprojects {

readmes/BottomBarLayout.md

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
###轻量级的底部导航栏
1+
### 轻量级的底部导航栏
22
  目前市场上的App,几乎都有底部页签导航栏,所以我们在开发的时候经常需要用到这个,虽然github上有不少已经封装好的底部导航栏的工具,例如bottombar,alphaIndicator(仿微信滑动渐变底部控件)等,但是这些控件由于功能太多,而且也没有给予详细的介绍文档,所以用起来不是特别容易,有时候我们仅仅只是想要一个简简单单的底部导航,但是又不想去自己在布局中搞一个个LinearLayout或者RadioGroup,然后切换页签的时候更换图标,让ViewPager跳转到对应的页面等一系列繁琐的操作,这时候,你可以使用BottomBarLayout,简简单单就可以实现以下效果:
33

44
![](./introduce_img/bbl/display1.gif)
55

66

7-
###BottomBarLayout的使用
7+
### BottomBarLayout的使用
88

9-
####布局文件中配置
9+
#### 布局文件中配置
1010

1111
在xml文件中,配置BottomBarLayout,包裹子条目BottomBarItem
1212

@@ -94,7 +94,7 @@
9494
</LinearLayout>
9595

9696

97-
####BottomBarItem属性介绍
97+
#### BottomBarItem属性介绍
9898

9999
<!--默认状态下的图标-->
100100
<attr name="iconNormal" format="reference"/>
@@ -111,7 +111,7 @@
111111
<!--文字和图标的顶部距离-->
112112
<attr name="itemMarginTop" format="dimension"/>
113113

114-
####java文件中设置
114+
#### java文件中设置
115115

116116
找过对应的ViewPager和BottomBarLayout,为ViewPager设置Adapter,然后为BottomBarLayout设置ViewPager
117117

@@ -120,7 +120,7 @@
120120

121121
这样就实现底部导航栏功能了
122122

123-
####开启滑动效果
123+
#### 开启滑动效果
124124

125125
页签之间的切换默认关闭了滑动效果,如果需要开启可以通过调用BottomBarLayout的setSmoothScroll()方法:
126126

@@ -130,7 +130,7 @@
130130

131131
![](./introduce_img/bbl/display2.gif)
132132

133-
####设置条目选中的监听
133+
#### 设置条目选中的监听
134134

135135
mBottomBarLayout.setOnItemSelectedListener(new BottomBarLayout.OnItemSelectedListener() {
136136
@Override
@@ -139,7 +139,7 @@
139139
}
140140
});
141141

142-
####BottomBarItem的介绍
142+
#### BottomBarItem的介绍
143143
&emsp;&emsp;BottomBarItem继承于LinearLayout,其子View有显示图标的ImageView和展示文字的TextView,分别可以通过getImageView()和getTextView()方法获取到对应的子控件。github上不少底部导航栏的控件都没能获取到对应的子控件,所以在需要对子控件进行操作的时候极不方便,有一些的思路并不是用ImageView和TextView,而是用绘制的,所以也不能获取到对应的显示图标的控件或展示文字的控件,造成无法获取到该控件,无法进行一些业务上的操作,比如类似今日头条的底部的首页,点击首页的页签,会更换成加载中的图标,执行旋转动画,BottomBarLayout可以轻松地做到这个需求。
144144

145145
演示效果如下:
@@ -201,7 +201,7 @@
201201
}
202202
}
203203

204-
####实现思路:
204+
#### 实现思路:
205205

206206
1.当点击页签加载的时候,BottomBarItem通过调用setIconSelectedResourceId()设置成选中状态下的图标资源id为加载中图标的资源id,完成图标的更换操作;
207207

readmes/ExpandableLinearLayout.md

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
##ExpandableLinearLayout介绍
2-
###场景介绍
1+
## ExpandableLinearLayout介绍
2+
### 场景介绍
33
&emsp;&emsp;开发的过程中,有时我们需要使用到这样一个功能,在展示一些商品的时候,默认只显示前几个,例如先显示前三个,这样子不会一进入页面就被商品列表占据了大部分,可以先让用户可以看到页面的大概,当用户需要查看更多的商品时,点击“展开”,就可以看到被隐藏的商品,点击“收起”,则又回到一开始的状态,只显示前几个,其他的收起来了。就拿美团外卖的订单详情页的布局作为例子,请看以下图片:
44

55
![](./introduce_img/ell/meituan1.jpg)
@@ -8,8 +8,8 @@
88

99
&emsp;&emsp;订单详情页面一开始只显示购买的前三样菜,当点击“点击展开”时,则将购买的所有外卖都展示出来,当点击“点击收起”时,则将除了前三样菜以外的都隐藏起来。其实要完成这样的功能并不难,为了方便自己和大家以后的开发,我将其封装成一个控件,取名为ExpandableLinearLayout,下面开始介绍它如何使用以及源码解析。
1010

11-
##使用方式
12-
###一、使用默认展开和收起的底部
11+
## 使用方式
12+
### 一、使用默认展开和收起的底部
1313
在布局文件中,使用ExpandableLinearLayout,代码如下:
1414

1515
<com.chaychan.viewlib.ExpandableLinearLayout
@@ -83,22 +83,22 @@
8383

8484
![](./introduce_img/ell/ell_1.gif)
8585

86-
####1.支持修改默认显示的个数
86+
#### 1.支持修改默认显示的个数
8787
可以修改默认显示的个数,比如将其修改为3,即defaultItemCount="3"
8888

8989
效果如下:
9090

9191
![](./introduce_img/ell/ell_2.gif)
9292

93-
####2.支持修改待展开和待收起状态下的文字提示
93+
#### 2.支持修改待展开和待收起状态下的文字提示
9494
可以修改待展开状态和待收起状态下的文字提示,比如修改expandText="查看更多",hideText="收起更多"
9595

9696
效果如下:
9797

9898
![](./introduce_img/ell/ell_3.gif)
9999

100100

101-
####3.支持修改提示文字的大小、颜色
101+
#### 3.支持修改提示文字的大小、颜色
102102

103103
可以修改提示文字的大小和颜色,对应的属性分别是tipTextSize,tipTextColor。比如修改tipTextSize="16sp",tipTextColor="#ff7300"
104104

@@ -107,14 +107,14 @@
107107
![](./introduce_img/ell/ell_tip_text_demo.gif)
108108

109109

110-
####4.支持更换箭头的图标
110+
#### 4.支持更换箭头的图标
111111
可以修改箭头的图标,只需配置arrowDownImg属性,引用对应的图标,这里的箭头图标需要是向下的箭头,这样当展开和收起时,箭头会做相应的旋转动画。设置arrowDownImg="@mipmap/arrow\_down\_grey",修改为灰色的向下图标。
112112

113113
效果如下:
114114

115115
![](./introduce_img/ell/ell_4.gif)
116116

117-
###二、使用自定义底部
117+
### 二、使用自定义底部
118118

119119
布局文件中,ExpandableLinearLayout配置useDefaultBottom="false",声明不使用默认底部。自己定义底部的布局。
120120

readmes/NumRunningTextView.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
###NumberRunningTextView介绍
1+
### NumberRunningTextView介绍
22
&emsp;&emsp;NumberRunningTextView是一个自带数字滚动动画的TextView,通过使用setContent(String str)方法,传入相应的金额数字字符串(如"1354.00"),或者数字的字符串(如200),当页面初始化完成的时候,就可以看到数字滚动的效果,和支付宝中进入余额宝界面,显示余额滚动的效果类似,具体的效果如下:
33

44
![](./introduce_img/running_tv_1.gif)
55

6-
###使用
6+
### 使用
77
在布局文件中,使用NumberRunningTextView,代码如下:
88

99
演示金额滚动的NumberRunningTextView
@@ -40,12 +40,12 @@
4040
tvNum.setContent("200");
4141

4242

43-
####关闭金额的自动格式化(每三位数字添加一个逗号)
43+
#### 关闭金额的自动格式化(每三位数字添加一个逗号)
4444
&emsp;&emsp;上图所示,最后显示的金额数字经过了处理,每三位添加一个逗号,这使得数字看起来比较好看,金额默认是使用这种格式,如果不想要这种格式的数字,可以在布局文件中,NumberRunningTextView的配置中,将useCommaFormat设置为false,这样最终的数字就不会是带有逗号了,效果如下:
4545

4646
![](./introduce_img/running_tv_2.gif)
4747

48-
####关闭执行动画的时机
48+
#### 关闭执行动画的时机
4949
&emsp;&emsp;当一开始进入界面的时候,初始化数据完毕,NumberRunningTextView设置数据完毕,会自动执行数字滚动的动画,如果进行刷新操作,从服务器获取新的数据,重新设置数据,NumberRunningTextView会自动判断传入的内容是否有变化,如果没有变化,则不会再次滚动,这和支付宝的余额宝界面中的金额类似,当在余额宝界面下拉刷新时,金额没有变化,数字不会再次滚动,而当提现后重新回到该界面,金额发生变化后,就会再次滚动,效果如下:
5050

5151
![](./introduce_img/running_tv_3.gif)
@@ -82,7 +82,7 @@ SwipeRefreshLayout的刷新回调中,只做了这样的处理,NumberRunningT
8282
![](./introduce_img/running_tv_5.gif)
8383

8484

85-
####可以修改数字滚动动画执行的时间
85+
#### 可以修改数字滚动动画执行的时间
8686

8787
如果不设置动画执行的周期,则会使用默认的动画执行周期,如下所示都是使用默认动画执行时间
8888

@@ -149,7 +149,7 @@ SwipeRefreshLayout的刷新回调中,只做了这样的处理,NumberRunningT
149149
&emsp;&emsp;在使用的过程中,就可以通过改变动画执行的周期来控制数字滚动的速度了,只需在布局文件中,配置duration属性,注意这里是以毫秒(ms)为单位。
150150

151151

152-
####可以修改数字最少要达到的某个值才会滚动
152+
#### 可以修改数字最少要达到的某个值才会滚动
153153

154154
&emsp;&emsp;这个功能弥补之前空间的一个缺陷,就是在数字很小的时候,比如金额的数字为0.01,整型数字为1,那么动画执行的结果让人感觉起来有点卡顿的感觉,如下所示:
155155

readmes/PowerfulEditText.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
###PowerfulEditText介绍###
2-
####1.自带清除文本功能 ####
1+
### PowerfulEditText介绍###
2+
#### 1.自带清除文本功能 ####
33
&emsp;&emsp;PowerfulEditText自带清除文本功能,只需在布局文件该View属性中添加funcType,指定为canClear,就可以自带清除文本功能,使用如下:
44

55
<?xml version="1.0" encoding="utf-8"?>
@@ -34,7 +34,7 @@
3434

3535

3636

37-
####2.自带密码输入框切换明文密文格式的功能 ####
37+
#### 2.自带密码输入框切换明文密文格式的功能 ####
3838

3939
&emsp;&emsp;PowerfulEditText自带密码输入框切换明文密文格式的功能,目前大多数App密码输入栏一般支持密码明文、密文的显示,如果需要用到该功能,可以将funcType中指定为canWatchPwd,就可以轻松使用这种功能,使用如下:
4040

@@ -65,7 +65,7 @@
6565

6666
这样开启查看密码的图标就更换了,如果还需要更换关闭密码查看的图标,可以指定eyeClose,引用对应的图标。
6767

68-
####3.设置drawableLeft和drawableRight图片大小的功能 ####
68+
#### 3.设置drawableLeft和drawableRight图片大小的功能 ####
6969
&emsp;&emsp;原生的EditText并不能在属性中指定drawableLeft或drawableRight图片的大小,所以一般开发的过程中,一些程序员会采用简单粗暴的方法,直接引用一张宽高都很小的图片。但是在不同屏幕分辨率下,兼容性就不是很好,比如在一些屏幕分辨率较高的手机上运行,图标会显得模糊。PowerfulEditText可以指定drawableLeft和drawableRight图片的宽高大小,可以指定为多少个dp,这样在开发的时候,可以在各个分辨率图片文件夹中放入不同尺寸的图标,通过设定图片的宽高属性来限制显示的大小,下面演示一下:
7070

7171
<com.chaychan.viewlib.PowerfulEditText
@@ -98,8 +98,8 @@
9898

9999
可以看到左侧的图标变小了,同样也可以设置右侧图片的宽高,对应的属性是rightDrawableWidth、rightDrawableHeight。
100100

101-
102-
####右侧图标点击事件####
101+
102+
#### 右侧图标点击事件####
103103
PowerfulEditText同样支持右侧图片的点击事件,如果funcType指定为canClear,则默认点击是清除文本。如果需要进行一些额外的操作,则可以设置回调,比如搜索输入框,右侧是一个搜索的按钮,需要为其设置点击事件的回调。
104104

105105
布局文件:

0 commit comments

Comments
 (0)