CN109064529A

CN109064529A - 一种按钮动态闪烁的动画算法

Info

Publication number: CN109064529A
Application number: CN201810852275.6A
Authority: CN
Inventors: 孙征
Original assignee: Beijing Kuwo Technology Co Ltd
Current assignee: Beijing Kuwo Technology Co Ltd
Priority date: 2018-07-30
Filing date: 2018-07-30
Publication date: 2018-12-21

Abstract

本发明涉及一种按钮动态闪烁的动画算法，包括如下步骤：定义抽象类PorterImageView，用来绘制背景图片；定义类PorterShapeImageView，用来获取Drawable图片资源并绘制到maskCanvas画布中；定义类ShineAnimator，用来实现闪烁动画；定义类ShineView，用来绘制闪烁的圆圈动画；定义类ShineButton，给自定义控件添加点击选中状态变化和闪烁动画效果，所述点击选中状态变化指点击缩放变化。本发明，通过自定义控件，设定按钮的动画及特效，选中状态、背景图片的颜色、大小、特效动画（缩放动画，闪烁动画）可动态设置，提高开发效率，增强用户体验。

Description

一种按钮动态闪烁的动画算法

技术领域

本发明涉及按钮交互效果设计技术领域，具体说是一种按钮动态闪烁的动画算法。

背景技术

Android系统中用来显示图片的控件为ImageView，ImageView即图像视图，直接继承自View类，它的主要功能是用于显示图片，实际上它不仅仅可以用来显示图片，任何Drawable对象都可以使用ImageView来显示。ImageView可以适用于任何布局中，并且Android为其提供了缩放和着色的一些操作。

但是，ImageView只能设置背景图片，并且没有自带动画及特效，当希望对某图片增加动画及特效时，只能自定义开发，增加了App开发时间，且通用性不佳。例如：设计按钮交互效果时，图片如采用ImageView显示，则没有太好的动画及特效可供选择。

发明内容

针对现有技术中存在的缺陷，本发明的目的在于提供一种按钮动态闪烁的动画算法，通过自定义控件，设定按钮的动画及特效，选中状态、背景图片的颜色、大小、特效动画（缩放动画，闪烁动画）可动态设置，提高开发效率，增强用户体验。

为达到以上目的，本发明采取的技术方案是：

一种按钮动态闪烁的动画算法，其特征在于，包括如下步骤：

定义抽象类PorterImageView，继承Android系统提供的图片显示控件AppCompatImageView，用来绘制背景图片；

定义类PorterShapeImageView，继承自定义的PorterImageView类，用来获取Drawable图片资源并绘制到maskCanvas画布中；

定义类ShineAnimator，继承Android系统提供的ValueAnimator动画，用来实现闪烁动画；

定义类ShineView，继承Android系统提供的View类，用来绘制闪烁的圆圈动画；

定义类ShineButton，继承自定义的PorterShapeImageView类，给自定义控件添加点击选中状态变化和闪烁动画效果，所述点击选中状态变化指点击缩放变化。

在上述技术方案的基础上，在抽象类PorterImageView中，

（1）、定义变量maskCanvas，是Android系统提供的画布Canvas类型的变量，用来在画布上绘制图像；

（2）、定义变量maskBitmap，是Android系统提供的Bitmap位图类型的变量，用来把maskCanvas画布中绘制到的图像保存到位图中；

（3）、定义变量maskPaint，是Android系统提供的画笔Paint类型的变量，提供画笔绘制图片；

（4）、定义变量drawableCanvas，是Android系统提供的Canvas类型的变量，用来绘制获取到的drawable；

（5）、定义变量drawableBitmap，是android系统提供的Bitmap位图类型的变量，用来存放drawableCanvas画布上绘制的信息；

（6）、定义变量drawablePaint，是Android系统提供的Paint画笔类型的变量，用来设置drawableBitmap的颜色；

（7）、重新ondraw方法，把获取到的drawable资源进行缩放和调色处理绘制到自定义控件上。

在上述技术方案的基础上，在类PorterShapeImageView中，

（1）、定义变量shape，是Android系统提供的Drawable类型的变量，用来获取在资源文件设定的背景图片；

（2）、定义变量matrix，是Android系统提供的矩阵Matrix类型的变量，用来对背景图片进行缩放和平移处理；

（3）、重新抽象方法paintMaskCanvas，用来把获取到的图片绘制到画布中。

在上述技术方案的基础上，在类ShineAnimator中，

（1）、定义变量MAX_VALUE，是Android系统提供的浮点型数据类型的变量，用来定义动画数值变化的最大值；

（2）、定义变量ANIM_DURATION，是Android系统提供的长整型数据类型的变量，用来定义动画执行的时长；

（3）、定义构造方法ShineAnimator，设置数值变化的范围、动画时长、动画开始延迟时间和动画插值器。

在上述技术方案的基础上，在类ShineView中，

（1）、定义静态变量FRAME_REFRESH_DELAY，是Android系统提供的长整型数据类型的变量，用来设置动画延迟的时长；

（2）、定义变量shineAnimator，是自定义的闪速动画ShineAnimator类型的变量，用来产生动画的数值发生器；

（3）、定义变量ValueAnimator，是Android系统的提供的ValueAnimator动画类型的变量，用来执行点击圆环由小扩散到大的动画；

（4）、定义变量shineButton，是自定义ShineButton类型的变量，用来提供需要添加闪烁动画的载体；

（5）、定义变量paint、paint2和paintSmall，都是Android系统提供的的画笔Paint类型的变量，分别用来绘制闪烁的小圆圈不同大小颜色所用到的画笔；

（6）、定义变量colorCount，是Android系统提供的int数据类型的变量，用来设置随机生成颜色的种类个数；

（7）、定义变量colorRandom，是Android系统提供的int数组类型的变量，用来保存随机生成的颜色值；

（8）、定义变量shineCount，是Android系统提供的int数据类型的变量，用来设置闪烁小圆圈的个数；

（9）、重写onDraw方法，绘制闪烁的小圆圈。

在上述技术方案的基础上，在类ShineView中，进一步包括：

（10）、定义方法showAnimation给目标控件添加闪烁的动画。

在上述技术方案的基础上，在类ShineButton中，

（1）、定义变量isChecked，是Android系统提供的布尔数据类型的变量，用来标记是否处于选中状态；

（2）、定义变量btnColor和btnFillColor，都是Android系统提供的int数据类型的变量，分别用来设置按钮默认的颜色和按钮点击后的颜色；

（3）、定义变量activity，是Android系统提供的Activity类型的变量，用来获取当前窗口的内容布局添加闪烁动画效果；

（4）、定义变量shineView，是自定义的ShineView类型的变量，提供闪烁动按钮圆圈的绘制和动画执行；

（5）、定义接口OnCheckedChangeListener和其中的方法onCheckedChanged，用来监听当前控件选中的状态；

（6）、定义变量listener，是自定义接口OnCheckedChangeListener类型的变量，用来传入选中状态的监听；

（7）、定义变量bottomHeight和realBottomHeight，都是Android系统提供的int数据类型的变量，用来保存当前控件所在父控件中的底部位置和所在屏幕的位置；

（8）、定义方法showAnim，用来显示点击选中时的闪烁动画效果。

在上述技术方案的基础上，在类ShineButton中，进一步包括：

（9）、定义setCancel方法，用来取消结束动画。

本发明所述的按钮动态闪烁的动画算法，通过自定义控件，设定按钮的动画及特效，选中状态、背景图片的颜色、大小、特效动画（缩放动画，闪烁动画）可动态设置，提高开发效率，增强用户体验。

本发明所述的按钮动态闪烁的动画算法，采用自定义抽象类PorterImageView，获取背景图片资源设置缩放动画，同时自定义类ShineAnimator及类ShineView用来显示闪烁动画效果，把带闪烁动画的View绑定到自定义图片展示控件上监听点击事件，点击选中时把闪烁动画视图添加到当前activity窗体中实现点击缩放和闪烁动画效果。

附图说明

本发明有如下附图：

图1 本发明的流程图。

具体实施方式

以下结合附图对本发明作进一步详细说明。

如图1所示，本发明所述的按钮动态闪烁的动画算法，包括如下步骤：

在上述技术方案的基础上，在抽象类PorterImageView中，

例如，可采用如下代码：

protected void onDraw(Canvas canvas){

drawablePaint.setFilterBitmap(false);

drawablePaint.setXfermode(PORTER_DUFF_XFERMODE);

drawableCanvas.drawBitmap(maskBitmap， 0.0f， 0.0f， drawablePaint);

canvas.drawBitmap(drawableBitmap， 0.0f， 0.0f， drawablePaint);

}，

其中：

canvas是Android系统提供的Canvas画布实列，用来在自定义控件上绘制。

setFilterBitmap和setXfermode方法都是Android系统提供的Paint类中的方法分别用来对位图进行优化和设置混合模式，

drawBitmap方法是Android系统提供的Canvas画布类中的方法用来在画布绘制bitmap位图。

在上述技术方案的基础上，在类PorterShapeImageView中，

例如，可采用如下代码：

void paintMaskCanvas(Canvas maskCanvas,， Paint maskPaint,， int width,，int height) {

shape.setBounds(0,， 0,， getWidth(),， getHeight());

shape.draw(maskCanvas);

}，

其中：

参数maskCanvas是Android系统提供的Canvas画布类型的变量，

参数maskPaint是Android系统提供的Paint画笔类型的变量用来绘制drawable资源，

参数width和height都是Android系统提供的int数据类型的变量用来设置drawable资源的宽和高，

setBounds方法是Android系统提供的Drawable类中国的方法用来设置drawable资源的边界大小，

draw方法也是Android系统提供的Drawable类中的方法用来把drawable绘制到画布中。

在上述技术方案的基础上，在类ShineAnimator中，

在上述技术方案的基础上，在类ShineView中，

（9）、重写onDraw方法，绘制闪烁的小圆圈。

例如，可采用如下代码：

protected void onDraw(Canvas canvas) {

for (int i = 0; i < shineCount; i++) {

canvas.drawArc(rectF,， 360f / shineCount * i + 1 + ((value - 1) *turnAngle),， 0.1f,， false,， paint);

canvas.drawArc(rectFSmall,， 360f / shineCount * i + 1 - smallOffsetAngle+ ((value - 1) * turnAngle),， 0.1f,， false,， paintSmall);

}}

其中：

参数canvas是Android系统提供的画布Canvas类型的变量用来绘制闪烁圆圈，

for循环用来批量绘制圆圈，

drawArc方法是Android系统提供的Canvas画布中的方法用来绘制圆环，

rectF和rectFSmall变量都是Android系统提供的RectF类型的变量用来设置圆环所在的位置。

在上述技术方案的基础上，在类ShineView中，进一步包括：

（10）、定义方法showAnimation给目标控件添加闪烁的动画。

例如，可采用如下代码：

shineAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {

public void onAnimationUpdate(ValueAnimator valueAnimator) {

value = (float) valueAnimator.getAnimatedValue();

invalidate();

}

});

shineAnimator.startAnim(this,， centerAnimX,， centerAnimY);

clickAnimator.start();

其中：

变量shineAnimator是定义的ShineAnimator类型的变量设置动画数值变化范围是动画时长，

addUpdateListener是其中的方法用来添加数值变化过程的监听，

getAnimatedValue方法是Android系统ValueAnimator类中的方法用来获取当前变化的数值，

invalidate方法是Android系统View类中的方法用来对视图控件进行刷新重绘，

startAnim方法是自定义ShineAnimator类中的方法用来开启动画，

start方法是Android系统提供的ValueAnimator类中的方法用来开启点击效果动画。

在上述技术方案的基础上，在类ShineButton中，

例如，可采用如下代码：

public void showAnim() {

ViewGroup rootView = activity.findViewById(Window.ID_ANDROID_CONTENT);

shineView = new ShineView(activity,， this,， shineParams);

rootView.addView(shineView,， new LayoutParams(MATCH_PARENT,， MATCH_PARENT));

shakeAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {

@Override

public void onAnimationUpdate(ValueAnimator valueAnimator) {

setScaleX((float) valueAnimator.getAnimatedValue());

setScaleY((float) valueAnimator.getAnimatedValue());

}

});}；

其中：

参数activity是当前控件所在的窗体，

findViewById是Android系统提供Acitivty类中的方法用来获取指定id对应的控件这里用来获取当前窗体内容父控件的根布局，

shineView是自定义的提供闪烁动画的控件，

addView方法是Android系统提供的ViewGroup 类中的方法用来向控件容器添加子布局，

addUpdateListener方法是Android系统提供的ValueAnimator类中方法用来监听数值变化情，

getAnimatedValue方法是Android系统ValueAnimator类中方法用来获取当前数值反生器所产生的变化值，

setScaleX和setScaleY方法都是Android系统View类中的方法用来对控件宽和高进行缩放。

在上述技术方案的基础上，在类ShineButton中，进一步包括：

（9）、定义setCancel方法，用来取消结束动画。

例如，可采用如下代码：

public void setCancel() {

setSrcColor(btnColor);

shakeAnimator.end();

shakeAnimator.cancel();

}；

其中：

setSrcColor方法是自定义PorterImageView类中的方法用来设置图片的颜色，

end和cancel方法都是Android系统提供的ValueAnimator类中方法用来结束和取消动画。

本说明书中未作详细描述的内容属于本领域专业技术人员公知的现有技术。

Claims

1.一种按钮动态闪烁的动画算法，其特征在于，包括如下步骤：

2.如权利要求1所述的按钮动态闪烁的动画算法，其特征在于：在抽象类PorterImageView中，

3.如权利要求1所述的按钮动态闪烁的动画算法，其特征在于：在类PorterShapeImageView中，

4.如权利要求1所述的按钮动态闪烁的动画算法，其特征在于：在类ShineAnimator中，

5.如权利要求1所述的按钮动态闪烁的动画算法，其特征在于：在类ShineView中，

（9）、重写onDraw方法，绘制闪烁的小圆圈。

6.如权利要求5所述的按钮动态闪烁的动画算法，其特征在于：在类ShineView中，进一步包括：

（10）、定义方法showAnimation给目标控件添加闪烁的动画。

7.如权利要求1所述的按钮动态闪烁的动画算法，其特征在于：在类ShineButton中，

8.如权利要求7所述的按钮动态闪烁的动画算法，其特征在于：在类ShineButton中，进一步包括：

（9）、定义setCancel方法，用来取消结束动画。