时间:2021-05-20
本文实例为大家分享了Android自定义view渐变圆形动画的具体代码,供大家参考,具体内容如下
直接上效果图
自定义属性
attrs.xml文件
<resources> <declare-styleable name="ProgressRing"> <!--进度起始色--> <attr name="pr_progress_start_color" format="color" /> <!--进度结束色--> <attr name="pr_progress_end_color" format="color" /> <!--背景起始色--> <attr name="pr_bg_start_color" format="color" /> <!--背景中间色--> <attr name="pr_bg_mid_color" format="color" /> <!--背景结束色--> <attr name="pr_bg_end_color" format="color" /> <!--进度值 介于0-100--> <attr name="pr_progress" format="integer" /> <!--进度宽度--> <attr name="pr_progress_width" format="dimension" /> <!--起始角度--> <attr name="pr_start_angle" format="integer" /> <!--扫过的角度--> <attr name="pr_sweep_angle" format="integer" /> <!--是否显示动画--> <attr name="pr_show_anim" format="boolean" /> </declare-styleable></resources>创建一个类 ProgressRing继承自 view
public class ProgressRing extends View { private int progressStartColor; private int progressEndColor; private int bgStartColor; private int bgMidColor; private int bgEndColor; private int progress; private float progressWidth; private int startAngle; private int sweepAngle; private boolean showAnim; private int mMeasureHeight; private int mMeasureWidth; private Paint bgPaint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.DITHER_FLAG); private Paint progressPaint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.DITHER_FLAG); private RectF pRectF; private float unitAngle; private int curProgress = 0; public ProgressRing(Context context, AttributeSet attrs) { super(context, attrs); TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.ProgressRing); progressStartColor = ta.getColor(R.styleable.ProgressRing_pr_progress_start_color, Color.YELLOW); progressEndColor = ta.getColor(R.styleable.ProgressRing_pr_progress_end_color, progressStartColor); bgStartColor = ta.getColor(R.styleable.ProgressRing_pr_bg_start_color, Color.LTGRAY); bgMidColor = ta.getColor(R.styleable.ProgressRing_pr_bg_mid_color, bgStartColor); bgEndColor = ta.getColor(R.styleable.ProgressRing_pr_bg_end_color, bgStartColor); progress = ta.getInt(R.styleable.ProgressRing_pr_progress, 0); progressWidth = ta.getDimension(R.styleable.ProgressRing_pr_progress_width, 8f); startAngle = ta.getInt(R.styleable.ProgressRing_pr_start_angle, 150); sweepAngle = ta.getInt(R.styleable.ProgressRing_pr_sweep_angle, 240); showAnim = ta.getBoolean(R.styleable.ProgressRing_pr_show_anim, true); ta.recycle(); unitAngle = (float) (sweepAngle / 100.0); bgPaint.setStyle(Paint.Style.STROKE); bgPaint.setStrokeCap(Paint.Cap.ROUND); bgPaint.setStrokeWidth(progressWidth); progressPaint.setStyle(Paint.Style.STROKE); progressPaint.setStrokeCap(Paint.Cap.ROUND); progressPaint.setStrokeWidth(progressWidth); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); /*for (int i = 0, end = (int) (progress * unitAngle); i <= end; i++) { progressPaint.setColor(getGradient(i / (float) end, progressStartColor, progressEndColor)); canvas.drawArc(pRectF, startAngle + i, 1, false, progressPaint); }*/ if (!showAnim) { curProgress = progress; } drawBg(canvas); drawProgress(canvas); if (curProgress < progress) { curProgress++; postInvalidate(); } } // 只需要画进度之外的背景即可 private void drawBg(Canvas canvas) { float halfSweep = sweepAngle / 2; for (int i = sweepAngle, st = (int) (curProgress * unitAngle); i > st; --i) { if (i - halfSweep > 0) { bgPaint.setColor(getGradient((i - halfSweep) / halfSweep, bgMidColor, bgEndColor)); } else { bgPaint.setColor(getGradient((halfSweep - i) / halfSweep, bgMidColor, bgStartColor)); } canvas.drawArc(pRectF, startAngle + i, 1, false, bgPaint); } } private void drawProgress(Canvas canvas) { for (int i = 0, end = (int) (curProgress * unitAngle); i <= end; i++) { progressPaint.setColor(getGradient(i / (float) end, progressStartColor, progressEndColor)); canvas.drawArc(pRectF, startAngle + i, 1, false, progressPaint); } } public void setProgress(@IntRange(from = 0, to = 100) int progress) { this.progress = progress; invalidate(); } public int getProgress() { return progress; } public int getGradient(float fraction, int startColor, int endColor) { if (fraction > 1) fraction = 1; int alphaStart = Color.alpha(startColor); int redStart = Color.red(startColor); int blueStart = Color.blue(startColor); int greenStart = Color.green(startColor); int alphaEnd = Color.alpha(endColor); int redEnd = Color.red(endColor); int blueEnd = Color.blue(endColor); int greenEnd = Color.green(endColor); int alphaDifference = alphaEnd - alphaStart; int redDifference = redEnd - redStart; int blueDifference = blueEnd - blueStart; int greenDifference = greenEnd - greenStart; int alphaCurrent = (int) (alphaStart + fraction * alphaDifference); int redCurrent = (int) (redStart + fraction * redDifference); int blueCurrent = (int) (blueStart + fraction * blueDifference); int greenCurrent = (int) (greenStart + fraction * greenDifference); return Color.argb(alphaCurrent, redCurrent, greenCurrent, blueCurrent); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); mMeasureWidth = getMeasuredWidth(); mMeasureHeight = getMeasuredHeight(); if (pRectF == null) { float halfProgressWidth = progressWidth / 2; pRectF = new RectF(halfProgressWidth + getPaddingLeft(), halfProgressWidth + getPaddingTop(), mMeasureWidth - halfProgressWidth - getPaddingRight(), mMeasureHeight - halfProgressWidth - getPaddingBottom()); } }}xml布局
<myCircle.ProgressRing android:layout_width="320dp" android:layout_height="320dp" android:layout_gravity="center_horizontal" app:pr_bg_end_color="#00ffffff" app:pr_bg_mid_color="#CCCCCC" app:pr_bg_start_color="#00ffffff" app:pr_progress="70" app:pr_progress_end_color="#F78930" app:pr_progress_start_color="#00ffffff" app:pr_progress_width="40dp" />以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
两种方式实现类似水波扩散效果,先上图为敬自定义view实现动画实现自定义view实现思路分析:通过canvas画圆,每次改变圆半径和透明度,当半径达到一定程度,
Android实现自定义圆形进度条:Android自定义view,在大多数项目中根据客户需求及用户的体验度来说,都要重新写控件的来展示漂亮的界面,这里就对圆形进
这次主要是练习一下Android的自定义view和path的相关使用,所以做了一个简单的demo:自定义一个view,并用path在上面画一个可以动态改变圆角大
本文实例为大家分享了Android自定义View实现抖音飘动红心效果的具体代码,供大家参考,具体内容如下自定义View——抖音飘动红心效果展示动画效果使用自定义
一个自定义View,记录一下思路和代码以备以后使用。思路:1.首先要画一个圆形图片和一个圆形背景图(通过自定义View);2.自定义View基本步骤初始化属性,