你的位置:首页 > 操作系统

[操作系统]自定义加载loading view动画组件的使用。


在github上找的一个有点酷炫的loading动画https://github.com/Fichardu/CircleProgress

我写写使用步骤

 

 

自定义view(CircleProgress )的代码

package com.hysmarthotel.view;import com.hysmarthotel.roomcontrol.R;import com.hysmarthotel.util.EaseInOutCubicInterpolator;import android.animation.TimeInterpolator;import android.content.Context;import android.content.res.TypedArray;import android.graphics.Canvas;import android.graphics.Paint;import android.graphics.Point;import android.util.AttributeSet;import android.view.View;import android.view.animation.AnimationUtils;public class CircleProgress extends View {  private static final int RED = 0xFFE5282C;  private static final int YELLOW = 0xFF1F909A;  private static final int BLUE = 0xFFFC9E12;  private static final int COLOR_NUM = 3;  private int[] COLORS;  private TimeInterpolator mInterpolator = new EaseInOutCubicInterpolator();  private final double DEGREE = Math.PI / 180;  private Paint mPaint;  private int mViewSize;  private int mPointRadius;  private long mStartTime;  private long mPlayTime;  private boolean mStartAnim = false;  private Point mCenter = new Point();  private ArcPoint[] mArcPoint;  private static final int POINT_NUM = 15;  private static final int DELTA_ANGLE = 360 / POINT_NUM;  private long mDuration = 3600;  public CircleProgress(Context context) {    super(context);    init(null, 0);  }  public CircleProgress(Context context, AttributeSet attrs) {    super(context, attrs);    init(attrs, 0);  }  public CircleProgress(Context context, AttributeSet attrs, int defStyle) {    super(context, attrs, defStyle);    init(attrs, defStyle);  }  private void init(AttributeSet attrs, int defStyle) {    mArcPoint = new ArcPoint[POINT_NUM];    mPaint = new Paint();    mPaint.setAntiAlias(true);    mPaint.setStyle(Paint.Style.FILL);    TypedArray a = getContext().obtainStyledAttributes(attrs, R.styleable.CircleProgress, defStyle, 0);    int color1 = a.getColor(R.styleable.CircleProgress_color1, RED);    int color2 = a.getColor(R.styleable.CircleProgress_color2, YELLOW);    int color3 = a.getColor(R.styleable.CircleProgress_color3, BLUE);    a.recycle();    COLORS = new int[]{color1, color2, color3};  }  @Override  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {    int defaultSize = getResources().getDimensionPixelSize(R.dimen.default_circle_view_size);    int width = getDefaultSize(defaultSize, widthMeasureSpec);    int height = getDefaultSize(defaultSize, heightMeasureSpec);    mViewSize = Math.min(width, height);    setMeasuredDimension(mViewSize, mViewSize);    mCenter.set(mViewSize / 2, mViewSize / 2);    calPoints(1.0f);  }  @Override  protected void onDraw(Canvas canvas) {    canvas.save();    canvas.translate(mCenter.x, mCenter.y);    float factor = getFactor();    canvas.rotate(36 * factor);    float x, y;    for (int i = 0; i < POINT_NUM; ++i) {      mPaint.setColor(mArcPoint[i].color);      float itemFactor = getItemFactor(i, factor);      x = mArcPoint[i].x - 2 * mArcPoint[i].x * itemFactor;      y = mArcPoint[i].y - 2 * mArcPoint[i].y * itemFactor;      canvas.drawCircle(x, y, mPointRadius, mPaint);    }    canvas.restore();    if (mStartAnim) {      postInvalidate();    }  }  private void calPoints(float factor) {    int radius = (int) (mViewSize / 3 * factor);    mPointRadius = radius / 12;    for (int i = 0; i < POINT_NUM; ++i) {      float x = radius * -(float) Math.sin(DEGREE * DELTA_ANGLE * i);      float y = radius * -(float) Math.cos(DEGREE * DELTA_ANGLE * i);      ArcPoint point = new ArcPoint(x, y, COLORS[i % COLOR_NUM]);      mArcPoint[i] = point;    }  }  private float getFactor() {    if (mStartAnim) {      mPlayTime = AnimationUtils.currentAnimationTimeMillis() - mStartTime;    }    float factor = mPlayTime / (float) mDuration;    return factor % 1f;  }  private float getItemFactor(int index, float factor) {    float itemFactor = (factor - 0.66f / POINT_NUM * index) * 3;    if (itemFactor < 0f) {      itemFactor = 0f;    } else if (itemFactor > 1f) {      itemFactor = 1f;    }    return mInterpolator.getInterpolation(itemFactor);  }  public void startAnim() {    mPlayTime = mPlayTime % mDuration;    mStartTime = AnimationUtils.currentAnimationTimeMillis() - mPlayTime;    mStartAnim = true;    postInvalidate();  }  public void reset() {    stopAnim();    mPlayTime = 0;    postInvalidate();  }  public void stopAnim() {    mStartAnim = false;  }  public void setInterpolator(TimeInterpolator interpolator) {    mInterpolator = interpolator;  }  public void setDuration(long duration) {    mDuration = duration;  }  public void setRadius(float factor) {    stopAnim();    calPoints(factor);    startAnim();  }  static class ArcPoint {    float x;    float y;    int color;    ArcPoint(float x, float y, int color) {      this.x = x;      this.y = y;      this.color = color;    }  }}

 

 

EaseInOutCubicInterpolator是自定义view(CircleProgress )中要是用的一个工具

package com.hysmarthotel.util;import android.animation.TimeInterpolator;public class EaseInOutCubicInterpolator implements TimeInterpolator {  @Override  public float getInterpolation(float input) {    if ((input *= 2) < 1.0f) {      return 0.5f * input * input * input;    }    input -= 2;    return 0.5f * input * input * input + 1;  }}

 

 

在activity中的调用(还有一些其他用法可以自己看看github上的源代码)

mProgressView = (CircleProgress)findViewById(R.id.progress_vie);mProgressView.startAnim(); //开始mProgressView.stopAnim(); //结束mProgressView.setRadius(factor); //半径mProgressView.reset(); //复原

 

 

 

<?AbsoluteLayout   ="http://schemas.android.com/apk/res/android"  ="http://schemas.android.com/apk/res/com.hysmarthotel.roomcontrol"   //这个地方记得要加  //包名  android:layout_width="match_parent"  android:layout_height="match_parent"  android:background="@drawable/bg1" >    <com.hysmarthotel.view.CircleProgress                                     //类名    android:id="@+id/progress_vie"    android:layout_x="350.5px"    android:layout_y="150.0px"    android:layout_width="1140.0px"    android:layout_height="700.0px"    circleprogress:color1="@android:color/holo_red_light"      //这些参数就是通过
     circleprogress:color2="@android:color/holo_green_light"

    circleprogress:color3="@android:color/holo_blue_light" />

 

 

自己在values目录中新建的attrs文件,这是与自定义view中自定义参数相关的

  <declare-styleable name="CircleProgress">    <attr name="color1" format="reference|color"/>    <attr name="color2" format="reference|color"/>    <attr name="color3" format="reference|color"/>  </declare-styleable>

 

 

 

自己在values目录中新建的dimens文件,这个只是几个颜色参数

<?