diff --git a/README-CN.md b/README-CN.md index c9a6071..7a54559 100644 --- a/README-CN.md +++ b/README-CN.md @@ -4,7 +4,7 @@ JJSearchViewAnim ![](http://ww1.sinaimg.cn/mw690/7ef01fcagw1f2kefqi8ekj205s05s749.jpg) -####一个炫酷的SearchView搜索动画库，希望你喜欢！ +#### 一个炫酷的SearchView搜索动画库，希望你喜欢！ @@ -75,7 +75,7 @@ JJSearchViewAnim
* 注意：最后一个效果[MaterialSearchView](https://github.com/android-cjj/MaterialSearchView)，由于之前有写过，就没有集合进去了. -###使用说明 +### 使用说明 #### (1) 在布局文件xml中 ```xml @@ -108,11 +108,11 @@ mJJSearchView.startAnim(); mJJSearchView.resetAnim(); ``` -####源码分析及如何在项目中实现：[JJSearchViewAnim源码分析](http://www.jianshu.com/p/a48f4e6cf036) +#### 源码分析及如何在项目中实现：[JJSearchViewAnim源码分析](http://www.jianshu.com/p/a48f4e6cf036) -###概要 +### 概要 -#####前言：周末强撸一个库,差点灰飞烟灭.无妨,人生自古谁无死，来生继续撸代码. +##### 前言：周末强撸一个库,差点灰飞烟灭.无妨,人生自古谁无死，来生继续撸代码. 立马入主题，几乎每个App都有搜索功能，然而形式千篇一律。我举个例子吧，就微信来说： @@ -127,7 +127,7 @@ mJJSearchView.resetAnim(); 此时，如果你看完表格那些动画，喜欢上它时，想知道他们是怎么在代码中实现的，没问题，我这就手把手教你撩一个绚丽的SearchViewAnim ， 呵呵，有点吹大了，说说我怎么实现的吧。 -###实现思路 +### 实现思路 我们先对第一行表格的设计图进行仔细观察 ,效果是SearchView是由一个圆圈和一条直线（尾巴）构成的，开启动画时，尾巴慢慢消失成一点，然后这一点（dot） 进入圆圈内时，泛起波纹，在圈内四处逗留，然后在圆圈中心点停留闪烁，短暂的思考了下人生，又冲出去乖乖做一条尾巴。 @@ -135,9 +135,9 @@ mJJSearchView.resetAnim(); 相信大家通过我形象的描述已经知道效果是怎样了，现在就把刚刚描叙的画出来吧。 -###实现绘制 +### 实现绘制 -####(1) 自定义类SearchView继承View +#### (1) 自定义类SearchView继承View 重写` onDraw(Canvas canvas)`方法,利用画笔Paint在画布Canvas绘制一个普通的的视图，如下： @@ -158,7 +158,7 @@ canvas.drawCircle(cx, cy, cr, paint); ``` 这一步比较简单，就不多说了。 -####(2) 实现动画效果，这里的动画有dot进入圈圈时泛起的波浪效果和dot在圈圈内的运行轨迹。 +#### (2) 实现动画效果，这里的动画有dot进入圈圈时泛起的波浪效果和dot在圈圈内的运行轨迹。 因为运行轨迹是固定的，我们把经过的路径设置给Path,在构造`PathMeasure`函数（不知道PathMeasure用法的同学自己搜索学习），使用它两个方法`getLength()`,.可获取dot运行路径的长度,`getPosTan(float distance, float pos[],float tan[])`可根据distance可以获取dot的坐标点pos[]. 写成代码就是： @@ -178,19 +178,19 @@ canvas.drawCircle(cx, cy, cr, paint); 至于dot进入圈圈时泛起的波浪效果，其实就是曲线的不断扩大而已，这里我们可以利用贝塞尔函数`quadTo()`,不断改变控制点来实现该效果。 -####（3）收尾Reset +#### （3）收尾Reset 因为结束动画之后，视图和开始时一样，所以我们并不需要绘制Reset时的动画，只需重置状态就可以了，而如果是有些情况，比如动画停止后是箭头的效果，就需要要逆着回去绘制SearchView的过程了。 其他动画效果也是这样一步一步把复杂的东西简单化，最后你发现无非就是画线、画曲线、画弧、画圆这些，我就偷个懒，不讲剩下效果的的实现方式了，自己看看源码，可能比我吹水有用的多。 -###杂谈 +### 杂谈 写这些花费的时间、精力还是挺多的，因为需要一些数学计算（我数学烂）和不断的调试才能绘制满意的效果，所以建议如果项目需要，可以在别人实现的轮子上改改就好。我们都知道，一个App只能有一种风格，所以加入很多样式的动画是没必要的，修改一种合适自己的就好。 水平有限及写的随意，该库还是有不少问题，也希望你能PR,完善它。 -###关于我 +### 关于我 如果你喜欢这个东东的话，可以关注我[github](https://github.com/android-cjj) ,也可以关注我微博[Android_cJJ](http://weibo.com/chenjijun2011/). diff --git a/README.md b/README.md index 2ea851e..943e6fb 100644 --- a/README.md +++ b/README.md @@ -6,9 +6,9 @@ JJSearchViewAnim ![](http://ww1.sinaimg.cn/mw690/7ef01fcagw1f2kefqi8ekj205s05s749.jpg) -####A cool search view animation library ,I hope you like it. +#### A cool search view animation library ,I hope you like it. -###look +### look @@ -77,7 +77,7 @@ JJSearchViewAnim
* The last effect you can find here:[MaterialSearchView](https://github.com/android-cjj/MaterialSearchView) -###Usage +### Usage #### (1) In xml ```xml