この記事では、主に Android で円形の LoadingView エフェクトをカスタマイズする方法を詳しく紹介します。興味のある方は参考にしてください。
最近のプロジェクトでは、Github で入手可能な円形のプログレス バーを使用しています。ただし、ペイントの進行状況は、ブラシの点線効果を設定することによって間隔をあけられます。 progressPaint.setPathEffect(new DashPathEffect(new float[]{dashWith, dumpSpace}, dumpSpace)); 別の内側のレイヤーがある場合、リングを動的に設定する場合、内側のレイヤーと外側のレイヤーの間にわずかなずれがあったため、希望する効果を実現するために元のレイヤーを変更しました (進行状況を設定するときにアニメーションを追加するかどうかを選択できます)。実装:
1. 最初に下部に黒いリングを描画します。
2. 現在の進行状況の値に従って対応する比率を描画します
public interface OnValueChangeListener { void onValueChange(float value); }
コア描画クラス:
/** * @author Chuck */ public class InternalCirclePainterImp2 implements InternalCirclePainter { private RectF internalCircle;//画出圆弧时,圆弧的外切矩形 private Paint internalCirclePaint; private int color; private float startAngle = 270f; int arcQuantity=100;//等分(圆弧加间隔),比如arcQuantity=100时,表示将有100个圆弧,和100个空白间隔 float ratio=0.5f;//每段圆弧与圆弧加间隔之和的比例,ratio=0.5表示每个圆弧与相邻的间隔弧度比是1:1 private int width; private int height; private int internalStrokeWidth = 48;//圆环宽度 public InternalCirclePainterImp2(int color, int progressStrokeWidth, int arcQuantity,float ratio) { this.color = color; this.internalStrokeWidth = progressStrokeWidth; this.arcQuantity = arcQuantity; if(ratio>0&&ratio<1){ this.ratio = ratio; } init(); } private void init() { initExternalCirclePainter(); } private void initExternalCirclePainter() { internalCirclePaint = new Paint(); internalCirclePaint.setAntiAlias(true); internalCirclePaint.setStrokeWidth(internalStrokeWidth); internalCirclePaint.setColor(color); internalCirclePaint.setStyle(Paint.Style.STROKE); } //圆弧外切矩形 private void initExternalCircle() { internalCircle = new RectF(); float padding = internalStrokeWidth * 0.5f; internalCircle.set(padding, padding , width - padding, height - padding); initExternalCirclePainter(); } @Override public void draw(Canvas canvas) { float eachAngle=360f/arcQuantity; float eachArcAngle=eachAngle*ratio; for(int i=0;i ログイン後にコピー
Pro gressPainterImp2、内側の黒いリング:
/** * @author Chuck */ public class ProgressPainterImp2 implements ProgressPainter { private RectF progressCircle; private Paint progressPaint; private int color = Color.RED; private float startAngle = 270f; private int internalStrokeWidth = 48; private float min; private float max; private int width; private int height; private int currentPecent;//当前的百分比 int arcQuantity=100;//等分(圆弧加间隔),比如arcQuantity=100时,表示将有100个圆弧,和100个空白间隔 float ratio=0.5f;//每段圆弧与圆弧加间隔之和的比例,ratio=0.5表示每个圆弧与相邻的间隔弧度比是1:1 public ProgressPainterImp2(int color, float min, float max, int progressStrokeWidth, int arcQuantity,float ratio) { this.color = color; this.min = min; this.max = max; this.internalStrokeWidth = progressStrokeWidth; this.arcQuantity = arcQuantity; this.ratio = ratio; init(); Log.e("ProgressPainterImp","构造函数执行"); } private void init() { initInternalCirclePainter(); } private void initInternalCirclePainter() { progressPaint = new Paint(); progressPaint.setAntiAlias(true); progressPaint.setStrokeWidth(internalStrokeWidth); progressPaint.setColor(color); progressPaint.setStyle(Paint.Style.STROKE); } //初始化外切的那个矩形 private void initInternalCircle() { progressCircle = new RectF(); float padding = internalStrokeWidth * 0.5f; progressCircle.set(padding, padding , width - padding, height - padding); initInternalCirclePainter(); } @Override public void draw(Canvas canvas) { float eachAngle=360f/arcQuantity; float eachArcAngle=eachAngle*ratio; int quantity=2*arcQuantity*currentPecent/100; for(int i=0;i ログイン後にコピー
カスタマイズ可能な属性:
呼び出し:
main_activity.xml:MainActivity:
findViewById(R.id.button).setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { try { mDashedCircularProgress.setValue(66);//没有动画的,直接设置 } catch (Exception e) { e.printStackTrace(); } } }); findViewById(R.id.button3).setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { try { mDashedCircularProgress.setValue(0);//无动画,归零 mDashedCircularProgress.setValueWithAnimation(100,2000);//带动画 } catch (Exception e) { e.printStackTrace(); } } });
Githubアドレス: https://github.com/506954774/AndroidCircularLoadingView
上記がこの記事の全内容です。その他の関連コンテンツについては、PHP 中国語 Web サイトに注目してください。 関連する推奨事項: jQuery を使用して Ajax で BLOB ファイルをダウンロードする方法
以上がAndroid のカスタム円形 LoadingView 効果の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。