在Android实现光影移动效果【流光效果】

2024-02-06 01:36

本文主要是介绍在Android实现光影移动效果【流光效果】,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

说明

本文是在Android实现光影移动效果【流光效果】

效果如下

图1 ShimmerView
图2 ShimmerTextView

ShimmerView.kt


import android.animation.ValueAnimator
import android.content.Context
import android.graphics.Canvas
import android.graphics.Color
import android.graphics.LinearGradient
import android.graphics.Paint
import android.graphics.Path
import android.graphics.Point
import android.graphics.RectF
import android.graphics.Shader
import android.util.AttributeSet
import android.view.View
import android.view.animation.LinearInterpolatorclass ShimmerView @JvmOverloads constructor(context: Context,attrs: AttributeSet? = null,defStyleAttr: Int = 0
) : View(context, attrs, defStyleAttr) {private var mWidth = -1private var mSlope: Float = -1Fprivate var mAnimMode = 0private var mDuration = 1600Lprivate var mRepeatCount = 0private var mColors = intArrayOf(0x00FFFFFF, 0x5AFFFFFF, 0x5AFFFFFF, 0x00FFFFFF)private var mPositions = floatArrayOf(0f, 0.5f, 0.51f, 1f)private var mRadius = 0private var mPaint: Paint = Paint()private var mPath: Path? = nullprivate var mClipPath: Path? = nullprivate var mValueAnimator: ValueAnimator? = nullinit {attrs?.let {context.obtainStyledAttributes(attrs, R.styleable.ShimmerView).apply {try {mWidth = getDimensionPixelSize(R.styleable.ShimmerView_csWidth, mWidth)mSlope = getFloat(R.styleable.ShimmerView_csSlope, mSlope)mRadius = getDimensionPixelSize(R.styleable.ShimmerView_csRadius, mRadius)mAnimMode = getInt(R.styleable.ShimmerView_csAnimMode, mAnimMode)mDuration =getInt(R.styleable.ShimmerView_csDuration, mDuration.toInt()).toLong()mRepeatCount = getInt(R.styleable.ShimmerView_csRepeat, mRepeatCount)val colorsStr = getString(R.styleable.ShimmerView_csColors)val positionsStr = getString(R.styleable.ShimmerView_csPositions)if (!colorsStr.isNullOrBlank() && !positionsStr.isNullOrBlank()) {val colorArr =colorsStr.split(",".toRegex()).dropLastWhile { it.isEmpty() }.toTypedArray()val positionArr =positionsStr.split(",".toRegex()).dropLastWhile { it.isEmpty() }.toTypedArray()val size = colorArr.sizeif (size == positionArr.size) {mColors = IntArray(size)mPositions = FloatArray(size)for (i in 0 until size) {mColors[i] = Color.parseColor(colorArr[i])mPositions[i] = positionArr[i].toFloat()}}}} finally {recycle()}}}}public override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {super.onMeasure(widthMeasureSpec, heightMeasureSpec)val widthSize = MeasureSpec.getSize(widthMeasureSpec)val heightSize = MeasureSpec.getSize(heightMeasureSpec)initSetup(widthSize, heightSize)if (mAnimMode == 0) {showAnimation(widthSize, heightSize, mRepeatCount, mDuration)}}private fun initSetup(width: Int, height: Int) {if (mRepeatCount < 0) {mRepeatCount = -1}if (mWidth < 0) {mWidth = width / 3}if (mSlope < 0) {mSlope = height / width.toFloat()}val point1 = Point(0, 0)val point2 = Point(width, 0)val point3 = Point(width, height)val point4 = Point(0, height)mPath = Path()mPath?.moveTo(point1.x.toFloat(), point1.y.toFloat())mPath?.lineTo(point2.x.toFloat(), point2.y.toFloat())mPath?.lineTo(point3.x.toFloat(), point3.y.toFloat())mPath?.lineTo(point4.x.toFloat(), point4.y.toFloat())mPath?.close()mClipPath = Path()val mRect = RectF()mRect[0f, 0f, width.toFloat()] = height.toFloat()mClipPath?.addRoundRect(mRect, mRadius.toFloat(), mRadius.toFloat(), Path.Direction.CW)}public override fun onDraw(canvas: Canvas) {super.onDraw(canvas)//绘制圆角mClipPath?.let { canvas.clipPath(it) }//绘制流光mPath?.let { canvas.drawPath(it, mPaint) }}private fun showAnimation(width: Int, height: Int, repeatCount: Int, duration: Long) {val offset = mWidth.toFloat()mValueAnimator?.cancel()mValueAnimator = ValueAnimator.ofFloat(0f - offset * 2, width + offset * 2)mValueAnimator?.repeatCount = repeatCountmValueAnimator?.interpolator = LinearInterpolator()mValueAnimator?.duration = durationmValueAnimator?.addUpdateListener { animation: ValueAnimator ->val value = animation.animatedValue as FloatmPaint.shader = LinearGradient(value,mSlope * value,value + offset,mSlope * (value + offset),mColors,mPositions,Shader.TileMode.CLAMP)invalidate()}mValueAnimator?.start()}public override fun onDetachedFromWindow() {super.onDetachedFromWindow()mValueAnimator?.cancel()mValueAnimator = null}fun setColorAndPositions(colors: IntArray, positions: FloatArray) {if (colors.size != positions.size) {throw RuntimeException("colors&positions的Array.size必须一致")}this.mColors = colorsthis.mPositions = positions}fun setSlope(mSlope: Float) {this.mSlope = mSlope}fun setWidth(mWidth: Int) {this.mWidth = mWidth}fun startLightingAnimation(duration: Long = mDuration, repeatCount: Int = mRepeatCount) {showAnimation(width, height, repeatCount, duration)}}

ShimmerView定义的 attrs:

<declare-styleable name="ShimmerView"><!--自动还是手动--><attr name="csAnimMode" format="enum"><enum name="auto" value="0" /><enum name="manual" value="1" /></attr><!--光影宽度--><attr name="csWidth" format="dimension" /><!--光影斜率 范围【-1 ~ 1--><attr name="csSlope" format="float" /><!--控件的圆角大小--><attr name="csRadius" format="dimension" /><!-- -1:无限循环,0:其他代表重复执行几次--><attr name="csRepeat" format="integer" /><!--动画时长 单位ms--><attr name="csDuration" format="integer" /><!--颜色值 举例:{0x00FFFFFF, 0x88FFFFFF, 0x00FFFFFF}--><attr name="csColors" format="string" /><!--颜色值对应的位置数组  (值范围0~1) 举例:[0f,0.5f,1f]  与csAngle数组大小必须一致--><attr name="csPositions" format="string" /></declare-styleable>

ShimmerTextView.kt


import android.content.Context
import android.graphics.Canvas
import android.graphics.Color
import android.graphics.LinearGradient
import android.graphics.Matrix
import android.graphics.Paint
import android.graphics.Shader
import android.util.AttributeSet
import androidx.appcompat.widget.AppCompatTextViewclass ShimmerTextView @JvmOverloads constructor(context: Context,attrs: AttributeSet? = null,defStyleAttr: Int = 0
) : AppCompatTextView(context, attrs, defStyleAttr) {private var mLinearGradient: LinearGradient? = nullprivate var mGradientMatrix: Matrix? = nullprivate var mViewWidth = 0private var mTranslate = 0private var mAnimating = trueprivate val speed = 50private var mPaint: Paint? = nullprivate var textColor = 0private var shimmerColor = 0init {attrs?.let {context.obtainStyledAttributes(attrs, R.styleable.ShimmerTextView).apply {try {textColor = getColor(R.styleable.ShimmerTextView_stvTextColor, Color.BLACK)shimmerColor =getColor(R.styleable.ShimmerTextView_stvShimmerColor, Color.WHITE)mPaint = paintmGradientMatrix = Matrix()} finally {recycle()}}}}fun setShimmer(isShimmer: Boolean) {mAnimating = isShimmer}override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {super.onMeasure(widthMeasureSpec, heightMeasureSpec)mViewWidth = measuredWidth}fun initLinearGradient() {mLinearGradient = LinearGradient(0f,0f,mViewWidth.toFloat(),0f,intArrayOf(textColor, shimmerColor, textColor),null,Shader.TileMode.CLAMP)mPaint?.shader = mLinearGradient}override fun onDraw(canvas: Canvas) {super.onDraw(canvas)if (mAnimating) {if (mGradientMatrix != null && mLinearGradient != null) {mTranslate += mViewWidth / 10if (mTranslate > 2 * mViewWidth) {mTranslate = -mViewWidth}mGradientMatrix?.setTranslate(mTranslate.toFloat(), 0f)mLinearGradient?.setLocalMatrix(mGradientMatrix)} else {initLinearGradient()}postInvalidateDelayed(speed.toLong())}}
}

ShimmerTextView 定义的 attrs:

    <declare-styleable name="ShimmerTextView"><attr name="stvTextColor" format="color" /><attr name="stvShimmerColor" format="color" /></declare-styleable>

DEMO

  1. Demo.apk 点击下载

项目和演示效果可以去Github查看

项目地址: https://github.com/logan0817/shinningview 。

如果你有任何疑问可以留言。

如果这篇文章对你有帮助,可以赏个赞支持一下作者。

这篇关于在Android实现光影移动效果【流光效果】的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/682791

相关文章

hdu1043(八数码问题,广搜 + hash(实现状态压缩) )

利用康拓展开将一个排列映射成一个自然数,然后就变成了普通的广搜题。 #include<iostream>#include<algorithm>#include<string>#include<stack>#include<queue>#include<map>#include<stdio.h>#include<stdlib.h>#include<ctype.h>#inclu

【C++】_list常用方法解析及模拟实现

相信自己的力量,只要对自己始终保持信心,尽自己最大努力去完成任何事,就算事情最终结果是失败了,努力了也不留遗憾。💓💓💓 目录   ✨说在前面 🍋知识点一:什么是list? •🌰1.list的定义 •🌰2.list的基本特性 •🌰3.常用接口介绍 🍋知识点二:list常用接口 •🌰1.默认成员函数 🔥构造函数(⭐) 🔥析构函数 •🌰2.list对象

【Prometheus】PromQL向量匹配实现不同标签的向量数据进行运算

✨✨ 欢迎大家来到景天科技苑✨✨ 🎈🎈 养成好习惯,先赞后看哦~🎈🎈 🏆 作者简介:景天科技苑 🏆《头衔》:大厂架构师,华为云开发者社区专家博主,阿里云开发者社区专家博主,CSDN全栈领域优质创作者,掘金优秀博主,51CTO博客专家等。 🏆《博客》:Python全栈,前后端开发,小程序开发,人工智能,js逆向,App逆向,网络系统安全,数据分析,Django,fastapi

让树莓派智能语音助手实现定时提醒功能

最初的时候是想直接在rasa 的chatbot上实现,因为rasa本身是带有remindschedule模块的。不过经过一番折腾后,忽然发现,chatbot上实现的定时,语音助手不一定会有响应。因为,我目前语音助手的代码设置了长时间无应答会结束对话,这样一来,chatbot定时提醒的触发就不会被语音助手获悉。那怎么让语音助手也具有定时提醒功能呢? 我最后选择的方法是用threading.Time

Android实现任意版本设置默认的锁屏壁纸和桌面壁纸(两张壁纸可不一致)

客户有些需求需要设置默认壁纸和锁屏壁纸  在默认情况下 这两个壁纸是相同的  如果需要默认的锁屏壁纸和桌面壁纸不一样 需要额外修改 Android13实现 替换默认桌面壁纸: 将图片文件替换frameworks/base/core/res/res/drawable-nodpi/default_wallpaper.*  (注意不能是bmp格式) 替换默认锁屏壁纸: 将图片资源放入vendo

C#实战|大乐透选号器[6]:实现实时显示已选择的红蓝球数量

哈喽,你好啊,我是雷工。 关于大乐透选号器在前面已经记录了5篇笔记,这是第6篇; 接下来实现实时显示当前选中红球数量,蓝球数量; 以下为练习笔记。 01 效果演示 当选择和取消选择红球或蓝球时,在对应的位置显示实时已选择的红球、蓝球的数量; 02 标签名称 分别设置Label标签名称为:lblRedCount、lblBlueCount

Android平台播放RTSP流的几种方案探究(VLC VS ExoPlayer VS SmartPlayer)

技术背景 好多开发者需要遴选Android平台RTSP直播播放器的时候,不知道如何选的好,本文针对常用的方案,做个大概的说明: 1. 使用VLC for Android VLC Media Player(VLC多媒体播放器),最初命名为VideoLAN客户端,是VideoLAN品牌产品,是VideoLAN计划的多媒体播放器。它支持众多音频与视频解码器及文件格式,并支持DVD影音光盘,VCD影

Kubernetes PodSecurityPolicy:PSP能实现的5种主要安全策略

Kubernetes PodSecurityPolicy:PSP能实现的5种主要安全策略 1. 特权模式限制2. 宿主机资源隔离3. 用户和组管理4. 权限提升控制5. SELinux配置 💖The Begin💖点点关注,收藏不迷路💖 Kubernetes的PodSecurityPolicy(PSP)是一个关键的安全特性,它在Pod创建之前实施安全策略,确保P

防近视护眼台灯什么牌子好?五款防近视效果好的护眼台灯推荐

在家里,灯具是属于离不开的家具,每个大大小小的地方都需要的照亮,所以一盏好灯是必不可少的,每个发挥着作用。而护眼台灯就起了一个保护眼睛,预防近视的作用。可以保护我们在学习,阅读的时候提供一个合适的光线环境,保护我们的眼睛。防近视护眼台灯什么牌子好?那我们怎么选择一个优秀的护眼台灯也是很重要,才能起到最大的护眼效果。下面五款防近视效果好的护眼台灯推荐: 一:六个推荐防近视效果好的护眼台灯的

工厂ERP管理系统实现源码(JAVA)

工厂进销存管理系统是一个集采购管理、仓库管理、生产管理和销售管理于一体的综合解决方案。该系统旨在帮助企业优化流程、提高效率、降低成本,并实时掌握各环节的运营状况。 在采购管理方面,系统能够处理采购订单、供应商管理和采购入库等流程,确保采购过程的透明和高效。仓库管理方面,实现库存的精准管理,包括入库、出库、盘点等操作,确保库存数据的准确性和实时性。 生产管理模块则涵盖了生产计划制定、物料需求计划、