色dy色帝国,Android实现渐变色的圆弧虚线效果_Android

关注

首先来看看效果图:

1,SweepGradient(梯度渲染)

public SweepGradient (float cx, float cy, int[] colors, float[] positions)

扫描渲染,就是以某个点位中心旋转一周所形成的效果!参数依次是:

      cx:扫描的中心x坐标

      cy:扫描的中心y坐标

      colors:梯度渐变的颜色数组

      positions:指定颜色数组的相对位置

public static final int[] SWEEP_GRADIENT_COLORS = new int[]{Color.GREEN, Color.GREEN, Color.BLUE, Color.RED, Color.RED};mColorShader = new SweepGradient(radius, radius,SWEEP_GRADIENT_COLORS,null);

效果图:

SweepGradient

2,DashPathEffect(Path的线段虚线化)

DashPathEffect(float[] intervals, float phase)

      intervals:为虚线的ON和OFF的数组,数组中元素数目需要 >= 2

      phase:为绘制时的偏移量

//计算路径的长度PathMeasure pathMeasure = new PathMeasure(mPath, false);float length = pathMeasure.getLength();float step = length / 60;dashPathEffect = new DashPathEffect(new float[]{step / 3, step * 2 / 3}, 0);

效果图:

DashPathEffect

3,下面是全部的代码:

package com.example.yyw.xfermodedemo;import android.animation.ValueAnimator;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.DashPathEffect;import android.graphics.Paint;import android.graphics.Path;import android.graphics.PathMeasure;import android.graphics.RectF;import android.graphics.SweepGradient;import android.util.AttributeSet;import android.view.View;/** * Created by yyw on 2016/10/11. */public class OilTableLine extends View { public static final int[] SWEEP_GRADIENT_COLORS = new int[]{Color.GREEN, Color.GREEN, Color.BLUE, Color.RED, Color.RED}; private int tableWidth = 50; private Paint mPaint; private Path mPath; private RectF mTableRectF; //把路径分成虚线段的 private DashPathEffect dashPathEffect; //给路径上色 private SweepGradient mColorShader; //指针的路径 private Path mPointerPath; private float mCurrentDegree = 60; public OilTableLine(Context context, AttributeSet attrs) {super(context, attrs);mPaint = new Paint();mPaint.setAntiAlias(true);mPaint.setDither(true);mPaint.setColor(Color.BLACK);mPath = new Path();mPointerPath = new Path();startAnimator(); } @Override protected void onSizeChanged(int w, int h, int oldw, int oldh) {super.onSizeChanged(w, h, oldw, oldh);float size = Math.min(w, h) - tableWidth * 2;//油表的位置方框mTableRectF = new RectF(0, 0, size, size);mPath.reset();//在油表路径中增加一个从起始弧度mPath.addArc(mTableRectF, 60, 240);//计算路径的长度PathMeasure pathMeasure = new PathMeasure(mPath, false);float length = pathMeasure.getLength();float step = length / 60;dashPathEffect = new DashPathEffect(new float[]{step / 3, step * 2 / 3}, 0);float radius = size / 2;mColorShader = new SweepGradient(radius, radius,SWEEP_GRADIENT_COLORS,null);//设置指针的路径位置mPointerPath.reset();mPointerPath.moveTo(radius, radius - 20);mPointerPath.lineTo(radius, radius + 20);mPointerPath.lineTo(radius * 2 - tableWidth, radius);mPointerPath.close(); } @Override protected void onDraw(Canvas canvas) {super.onDraw(canvas);float dx = (getWidth() - mTableRectF.width()) / 2;float dy = (getHeight() - mTableRectF.height()) / 2;//把油表的方框平移到正中间canvas.translate(dx, dy);canvas.save();//旋转画布canvas.rotate(90, mTableRectF.width() / 2, mTableRectF.height() / 2);mPaint.setStyle(Paint.Style.STROKE);mPaint.setStrokeWidth(tableWidth);mPaint.setPathEffect(dashPathEffect);mPaint.setShader(mColorShader);canvas.drawPath(mPath, mPaint);canvas.restore();//还原画笔mPaint.setPathEffect(null);mPaint.setShader(null);mPaint.setStyle(Paint.Style.FILL);mPaint.setStrokeWidth(tableWidth / 10);canvas.save();canvas.rotate(150 + mCurrentDegree, mTableRectF.width() / 2, mTableRectF.height() / 2);canvas.drawPath(mPointerPath, mPaint);canvas.restore(); } public void startAnimator() {ValueAnimator animator = ValueAnimator.ofFloat(0, 240);animator.setDuration(40000);animator.setRepeatCount(ValueAnimator.INFINITE);animator.setRepeatMode(ValueAnimator.RESTART);animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) {mCurrentDegree = (int) (0 + (Float) animation.getAnimatedValue());invalidate(); }});animator.start(); }}

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

您可能感兴趣的文章:Android自定义圆弧进度条加数字动态变化Android自定义View绘制彩色圆弧Android 自定义球型水波纹带圆弧进度效果(实例代码)一个简单的Android圆弧刷新动画Android自定义View实现圆弧进度效果利用Android画圆弧canvas.drawArc()实例详解Android TextView(圆弧)边框和背景实例详解Android 自定View实现仿QQ运动步数圆弧及动画效果Android使用ImageView 制作透明圆弧实例代码android实现简单圆弧效果