仿微信主界面导航栏图标字体颜色的变化(微信怎么导入主题模块)

编辑：rootadmin

在所有的移动产品中，微信的界面做的很简洁，简单，我对微信主界面影响最深的就是微信底部导航栏的图标，以及字体颜色的变化，一直都想实现以下，今天有空，就大体的模仿者做了一遍。效果图如下：分析：底部主要分为图标的渐变，字体颜色的渐变。图标的颜色的渐变：主要是通过canvas绘制两个不同的图片，控制其图片的alpha透明度，来达到图标的渐变。字体颜色：字体颜色就很好说了，Animator动画框架应该很熟悉了，在Animator框架中，有一个TypeEven是来计算十六进制色&#;的，我们可以通过Animator来控制颜色的渐变。通过代码来说明：图标：底部一共是有八个图标，一个空白状态，一个是带颜色的状态。关键代码： bitmapPaint.setAlpha( - currentAlpha ); canvas.drawBitmap(normalBitmap, srcRect , dstRect , bitmapPaint); bitmapPaint.setAlpha(currentAlpha ); canvas.drawBitmap(pitchBitmap, srcRect , dstRect , bitmapPaint); 没错，就是两个图片同时画，一个画的透明度高一个低。不知道微信真正的实现方式是啥样的。哈哈……再说文字的实现：既然都把图片给画出来了，就顺带把文字也给画了吧，很简单的代码： if (text != null ) { textPaint.setColor(textColor); canvas.drawText(text, textX, textY, textPaint); } 多简单。然而字体颜色的变化那，就是通过textColor的变化，在每次绘制的时候，动画改变textColor的&#;，看一下代码：private void initTextColorAnimator(){ colorAnimator = ValueAnimator.ofInt(DEFULT_TEXT_COLOR,changeColor) ; colorAnimator.setEvaluator(new ArgbEvaluator()); colorAnimator.addUpdateListener(new AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) { textColor = (Integer) animation.getAnimatedValue(); Log.i("bottom", textColor &#; " = ") ; } }); colorAnimator.setDuration() ; colorAnimator.setInterpolator(new LinearInterpolator()); } Animator，属性动画，Android4.0之后的属性动画是很强大的，任何的动画都可以很方便的做出来。通过colorAnimator来控制色&#;的渐变，关键点： colorAnimator.setEvaluator(new ArgbEvaluator());要告诉Animator这个是色&#;的渐变，要通过TypeEventor来控制变化。动画执行之后，不要急着去start，这里面是没有start的。看在一点一点滑动的时候的progress的变化代码：public void setProgress(float progress){ if (progress > ) { throw new RuntimeException("progress do not > ") ; } currentAlpha = (int) ( * progress) ; colorAnimator.setCurrentPlayTime((long) (progress * )); invalidate(); } 这个看到了吧，通过setCurrentPlayTime来给textColor相应的进度的色&#;。 OK 这就是这个关键代码了，很简单的代码。完整代码如下：github地址：百度网盘下载地址：

推荐整理分享仿微信主界面导航栏图标字体颜色的变化(微信怎么导入主题模块)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:h5仿微信主界面,如何装扮微信主页面?,h5仿微信主界面,仿微信聊天界面,h5仿微信主界面,html5仿微信主界面,模仿微信界面,仿微信聊天界面,内容如对您有帮助，希望把文章链接给更多的朋友！

随着ScrollView的滑动，渐渐的执行动画View 今天是实现了一个小功能的东西。看看效果图：实现方式：1.自定义ScrollView复写onScrollChange方法，来计算滑动的位置。2.自定义接口，通过接口来在ScrollV

android自定义之 5.0 风格progressBar 最近做项目，用到了ProgressBar，就想到了要使用Android5.0的效果，就随手实现了一下。效果图：大概的思路：1.圆圈通过Canvas去绘制2.圆圈的动画通过Animato