文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

Android如何实现流光和光影移动效果

2023-06-22 04:29

关注

这篇文章将为大家详细讲解有关Android如何实现流光和光影移动效果,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

概述:

开发过程中,看到有些界面用到一道光线在屏幕中掠过的效果,觉得挺炫的。所以查找相关资料自己实现了一遍。

先上个预览图:

Android如何实现流光和光影移动效果

实现思路:

简单来说就是在一个view中绘制好一道光影,并不断改变光影在view中的位置。

首先我们先了解一下光影怎么绘制

在了解如何绘制之前,我们先看一下LinearGradient的构造方法

 LinearGradient(float x0, float y0, float x1, float y1, @NonNull @ColorInt int[] colors,            @Nullable float[] positions, @NonNull TileMode tile)

colors[]和positions[]的说明结合下图,这样理解起来应该就比较明朗了

Android如何实现流光和光影移动效果

回到正题,如何绘制光影。我们看到的那道光可以参照下图:

Android如何实现流光和光影移动效果

根据分析得到我们的着色器是线性着色器(其他着色器请查询相关api):

LinearGradient(a的x坐标, a的y坐标, c的x坐标, c的y坐标, new int[]{Color.parseColor("#00FFFFFF"), Color.parseColor("#FFFFFFFF"), Color.parseColor("#00FFFFFF")}, new float[]{0f, 0.5f, 1f}, Shader.TileMode.CLAMP)

给画笔上色。设置着色器mPaint.setShader(mLinearGradient)

给定一个数值范围利用数值生成器ValueAnimator产生数值,监听数值变化。每次回调都将该数值传入光影的起点和终点并进行绘制

代码如下:

public class ConfigLoadingView extends View {    private Paint mPaint;    private Path mPath;    private LinearGradient mLinearGradient;    private ValueAnimator mValueAnimator;    public ConfigLoadingView(Context context) {        this(context, null);    }    public ConfigLoadingView(Context context, @Nullable AttributeSet attrs) {        this(context, attrs, 0);    }    public ConfigLoadingView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);        init();    }    private void init() {        mPaint = new Paint();        mPath = new Path();    }    private void initPointAndAnimator(int w, int h) {        Point point1 = new Point(0, 0);        Point point2 = new Point(w, 0);        Point point3 = new Point(w, h);        Point point4 = new Point(0, h);        mPath.moveTo(point1.x, point1.y);        mPath.lineTo(point2.x, point2.y);        mPath.lineTo(point3.x, point3.y);        mPath.lineTo(point4.x, point4.y);        mPath.close();// 斜率k        float k = 1f * h / w;        // 偏移        float offset = 1f * w / 2;// 0f - offset * 2 为数值左边界(屏幕外左侧), w + offset * 2为数值右边界(屏幕外右侧)// 目的是使光影走完一遍,加一些时间缓冲,不至于每次光影移动的间隔都那么急促        mValueAnimator = ValueAnimator.ofFloat(0f - offset * 2, w + offset * 2);        mValueAnimator.setRepeatCount(-1);        mValueAnimator.setInterpolator(new LinearInterpolator());        mValueAnimator.setDuration(1500);        mValueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {            @Override            public void onAnimationUpdate(ValueAnimator animation) {                float value = (float) animation.getAnimatedValue();                mLinearGradient = new LinearGradient(value, k * value, value + offset, k * (value + offset),                        new int[]{Color.parseColor("#00FFFFFF"), Color.parseColor("#1AFFFFFF"), Color.parseColor("#00FFFFFF")}, null, Shader.TileMode.CLAMP);                mPaint.setShader(mLinearGradient);                invalidate();            }        });        mValueAnimator.start();    }    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        int widthSize = MeasureSpec.getSize(widthMeasureSpec);        int heightSize = MeasureSpec.getSize(heightMeasureSpec);        initPointAndAnimator(widthSize, heightSize);    }    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        canvas.drawPath(mPath, mPaint);    }    @Override    protected void onDetachedFromWindow() {        super.onDetachedFromWindow();        mValueAnimator.cancel();    }}

注意点:

LinearGradient里参数之一:
color[]参数只能是16进制的RGB数值,不能传R.color.xxx。R.color.xxx虽然是int型,但拿到的是资源ID,并不是16进制RGB

关于“Android如何实现流光和光影移动效果”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-后端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯