Android 自定义控件——Simple_Loading

本文介一个简单的自定义加载圈的实现

先看看效果:

Android 自定义控件——Simple_Loading_第1张图片


继承View,和一系列的自定义属性在画布上实现的Loading的效果

效果总共三中:

1.弧度Loading

2.圆Loading

3.可以设置1-100的数字,表示百分比,并在Loading上表示相应的百分比效果

属性文件和属性的意义:




    
        
        
        
        
        
        
            
            
            
        
        
        
        
        
    

outer_width  外圈的宽

outer_color  外圈的颜色 

inner_width  内圈的宽

inner_color  内圈的颜色

inner_rotaing_speed  内圈的速度

mode  模式,arc:弧形的Loading,circle:圆形的Loading,custom:可以设置百分比度数的circle loading

inner_circle_speed 当mode=circle时有效,内圈的速度

inner_custom_degree 当mode=custom时有效,内圈的度数,百分比,1-100之间


LoadingView.java

/**
 * 自定义的一个LoadingView
 * 
 * @author mingwei
 */
public class LoadingView extends View {

	private final String TAG = "LoadingView";
	private Paint mTestPaint;
	private Paint mOuterPaint;
	private RectF mOuterRectF;
	private Paint mInnerPaint;
	private RectF mInnerRectF;
	/**
	 * mStart 起始值 弧度 mSweep 终点值 弧度
	 */
	int mStart = 0;
	int mSweep = 90;

	int mWidth, mHeight;
	int mArcLenght = 60;
	/**
	 * outer width
	 */
	int mOuterWidth;
	/**
	 * inner width
	 */
	int mInnerWidth;
	/**
	 * outer color
	 */
	int mOuterColor;
	/**
	 * inner color
	 */
	int mInnerColor;
	/**
	 * inner rotating speed
	 */
	int mInnerRotatingSpeed = 1;
	/**
	 * loading的模式
	 */
	LoadingMode mLoadingMode = LoadingMode.ARC;
	/**
	 * Circle degree
	 */
	int mCircle = 0;

	/**
	 * Circle speed,only mode==circle
	 */
	int mCircleSpeed = 1;

	/**
	 * custom degree,only mode==custom
	 */
	int mCustomDegree = 0;

	enum LoadingMode {
		ARC, CIRCLE, CUSTOM;
	}

	public LoadingView(Context context) {
		this(context, null);
	}

	public LoadingView(Context context, AttributeSet attrs) {
		this(context, attrs, 0);
	}

	public LoadingView(Context context, AttributeSet attrs, int defStyleAttr) {
		super(context, attrs, defStyleAttr);
		initAttr(context, attrs);

	}

	private void setBounds() {
		mOuterRectF = new RectF(getPaddingLeft(), getPaddingTop(), getWidth() - getPaddingRight(), getHeight()
				- getPaddingBottom());
		mInnerRectF = new RectF(mOuterRectF);
	}

	@Override
	protected void onSizeChanged(int w, int h, int oldw, int oldh) {
		super.onSizeChanged(w, h, oldw, oldh);
		setBounds();
		initPaint();
	}

	private void initPaint() {
		mOuterPaint = new Paint();
		mOuterPaint.setAntiAlias(true);
		mOuterPaint.setColor(mOuterColor);
		mOuterPaint.setStyle(Style.STROKE);
		mOuterPaint.setStrokeWidth(mOuterWidth);
		//
		mInnerPaint = new Paint();
		mInnerPaint.setAntiAlias(true);
		mInnerPaint.setColor(mInnerColor);
		mInnerPaint.setStyle(Style.STROKE);
		mInnerPaint.setStrokeWidth(mInnerWidth);
		//
		mTestPaint = new Paint();
		mTestPaint.setAntiAlias(true);
		mTestPaint.setColor(Color.BLACK);
		mTestPaint.setStyle(Style.STROKE);
	}

	private void initAttr(Context context, AttributeSet attrs) {
		TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.Loading);
		mOuterWidth = array.getDimensionPixelOffset(R.styleable.Loading_outer_width, 0);
		mOuterColor = array.getColor(R.styleable.Loading_outer_color, Color.GRAY);
		mInnerWidth = array.getDimensionPixelOffset(R.styleable.Loading_inner_width, R.styleable.Loading_inner_width);
		mInnerColor = array.getColor(R.styleable.Loading_inner_color, Color.BLACK);
		mInnerRotatingSpeed = array.getInt(R.styleable.Loading_inner_rotating_speed, 1);
		if (array.getInt(R.styleable.Loading_mode, 0) == 1) {
			mLoadingMode = LoadingMode.ARC;
		} else if (array.getInt(R.styleable.Loading_mode, 0) == 2) {
			mLoadingMode = LoadingMode.CIRCLE;
			mCircleSpeed = array.getInt(R.styleable.Loading_inner_circle_speed, 1);
		} else if (array.getInt(R.styleable.Loading_mode, 0) == 3) {
			mLoadingMode = LoadingMode.CUSTOM;
			mCustomDegree = array.getInt(R.styleable.Loading_inner_custom_degree, 1);
		}
		array.recycle();
	}

	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
		// canvas.drawRect(mOuterRectF, mTestPaint);
		canvas.drawArc(mOuterRectF, 360, 360, false, mOuterPaint);
		if (mLoadingMode == LoadingMode.ARC) {
			canvas.drawArc(mInnerRectF, mStart, mSweep + 2, false, mInnerPaint);
			// int d = mRandom.nextInt(8);
			mStart += mInnerRotatingSpeed;
			if (mStart > 360) {
				mStart -= 360;
			}
			invalidate();
		} else if (mLoadingMode == LoadingMode.CIRCLE) {
			canvas.drawArc(mInnerRectF, mStart, mCircle, false, mInnerPaint);
			mCircle += mCircleSpeed;
			if (mCircle > 360) {
				mCircle -= 360;
			}
			invalidate();
		} else if (mLoadingMode == LoadingMode.CUSTOM) {
			float f = (float) mCustomDegree / 100f;
			canvas.drawArc(mInnerRectF, mStart, 360f * f, false, mInnerPaint);
		}

	}
}

在Activity的XML中使用:



    


    

    


Activity中啥也没干,想要设置Custom时的度数,只需要改变mCustomDegree并调用invalidate()就可以了。


你可能感兴趣的:(Android自定义控件,Android,Android自定义控件)