首页

源码搜藏网

首页 > 安卓源码 > 控件分类 > 多页切换TabHost >

Android实现360手机助手TabHost的波纹效果

创建时间：2017-05-12 09:51  

Android实现360手机助手TabHost的波纹效果
Android实现360手机助手TabHost的波纹效果
暂无演示 立即下载

现在新版360手机助手的界面都做得挺漂亮的，在切换底部导航时的波纹效果也很好看，刚好最近看了个开源项目才了解到原来Drawable做动画效果也怎么好用，所以就仿照360实现了下带波纹的TabHost。

先来看一下实现后的效果：

说明一下实现要点：

1. 因为我们项目之前用的是FragmentTabHost，所以我直接继承FragmentTabHost来实现动画效果更方便；

2. 波纹动画的实现其实是自定义带动画效果的Drawable，然后将Drawable设置为Tab菜单的背景；

3. 其它的就是一些Tab菜单切换的处理了。

一. 自定义波纹Drawable

 

自定义Drawable只要继承Drawable并实现以下4个方法，同时实现Animatable接口：

 

[java] view plain copy
 
  1. public class RippleDrawable extends Drawable implements Animatable {  
  2.     @Override  
  3.     public void draw(Canvas canvas) {  
  4.         //　绘图  
  5.     }  
  6.   
  7.     @Override  
  8.     public void setAlpha(int alpha) {  
  9.         //　设置透明度  
  10.     }  
  11.   
  12.     @Override  
  13.     public void setColorFilter(ColorFilter colorFilter) {  
  14.         //　设置颜色过滤  
  15.     }  
  16.   
  17.     @Override  
  18.     public int getOpacity() {  
  19.         //　设置颜色格式  
  20.         return PixelFormat.RGBA_8888;  
  21.     }  
  22.   
  23.     @Override  
  24.     public void start() {  
  25.         // 启动动画  
  26.     }  
  27.   
  28.     @Override  
  29.     public void stop() {  
  30.         // 停止动画  
  31.     }  
  32.   
  33.     @Override  
  34.     public boolean isRunning() {  
  35.         //　判断动画是否运行  
  36.         return false;  
  37.     }  
  38. }  
这几个方法中最重要的就是draw()方法了，相信自定义过View的都知道我们图形就是在这里绘制，这里也一样，其它方法在这里影响不大，最后一个方法用来设置Drawable的颜色格式。要实现动画Drawable需要实现Animatable接口,并实现3个方法如下，其实不实现这个接口也能做动画效果，但还是实现比较好。

 

下面是整个波纹Drawable的实现代码：

[java] view plain copy
 
  1. /** 
  2.  * Created by long on 2016/6/27. 
  3.  * 波纹Drawable 
  4.  */  
  5. public class RippleDrawable extends Drawable implements Animatable {  
  6.   
  7.     /** 
  8.      * 3种模式：左边、中间和右边波纹 
  9.      */  
  10.     public static final int MODE_LEFT = 1;  
  11.     public static final int MODE_MIDDLE = 2;  
  12.     public static final int MODE_RIGHT = 3;  
  13.   
  14.     private int mMode = MODE_MIDDLE;  
  15.     // 前景色和后景色画笔  
  16.     private Paint mPaintFront;  
  17.     private Paint mPaintBehind;  
  18.     // 用来绘制扇形的矩形框  
  19.     private RectF mRect;  
  20.     // 目标View的宽高的一半  
  21.     private int mHalfWidth;  
  22.     private int mHalfHeight;  
  23.     // 扩散半径  
  24.     private int mRadius;  
  25.     // 前景色和背景色的分割距离  
  26.     private int mDivideSpace;  
  27.     // 扩散满视图需要的距离，中点到斜角的距离  
  28.     private int mFullSpace;  
  29.     // 动画控制  
  30.     private ValueAnimator mValueAnimator;  
  31.   
  32.   
  33.     public RippleDrawable(int frontColor, int behindColor, int mode) {  
  34.         mPaintFront = new Paint(Paint.ANTI_ALIAS_FLAG);  
  35.         mPaintFront.setColor(frontColor);  
  36.         mPaintBehind = new Paint(Paint.ANTI_ALIAS_FLAG);  
  37.         mPaintBehind.setColor(behindColor);  
  38.         mRect = new RectF();  
  39.         mMode = mode;  
  40.     }  
  41.   
  42.     @Override  
  43.     public void draw(Canvas canvas) {  
  44.         if (mRadius > mHalfWidth) {  
  45.             int count = canvas.save();  
  46.             canvas.drawCircle(mHalfWidth, mHalfHeight, mHalfWidth, mPaintBehind);  
  47.             canvas.restoreToCount(count);  
  48.             count = canvas.save(); &
上一篇：Android炫酷的Activity切换效果，共享元素
下一篇：一款与Android支持库兼容的ViewPager交互式分页指示器小部件

相关内容

热门推荐