仿iReader切换皮肤进度条

仿iReader切换皮肤进度条

标签（空格分隔）： 自定义View

---

[TOC]

本以为使用paint.setXfermode(new PorterDuffXfermode(Mode.XOR));可以轻松搞定，没想到我对PorterDuffXfermode(参考APIDemos代码，路径/APIDemos/Graphics/Xfermodes)的理解有问题，比较悲催了。最后使用了ClipRect的方式实现了这个东西！

定义属性文件：

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="ProgressView">
        <attr name="text" format="string"/>
        <attr name="textSize" format="dimension"/>
        <attr name="color" format="color"/>
        <attr name="progress" format="integer"/>
        <attr name="maxProgress" format="integer"/>
        <attr name="crossColor" format="color"/>
    </declare-styleable>
</resources>

实现代码:

package com.example.testproject;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.view.View;
/**
 * 
 * @author 
 *
 */
public class ProgressView extends View {
	
	/** 最大进度 **/
	private int maxProgress;
	
	/** 当前进度 **/
	private int progress;
	
	/** 当前显示的文字 **/
	private String text;
	
	/** 进度和没有交叉的时候的文字的颜色 **/
	private int color;
	
	/** 文字和进度交叉的时候的文字的颜色 **/
	private int crossColor;
	
	/** 画进度和没有交叉的时候的文字的Paint **/
	private Paint paint;
	
	/** 表示进度的Rect **/
	private Rect rect;

	public ProgressView(Context context, AttributeSet attrs, int defStyleAttr) {
		super(context, attrs, defStyleAttr);
		init(context, attrs);
	}

	public ProgressView(Context context, AttributeSet attrs) {
		super(context, attrs);
		init(context, attrs);
	}

	public ProgressView(Context context) {
		super(context);
		init(context, null);
	}
	
	private void init(Context context, AttributeSet attrs){
		/** 得到XML属性 **/
		TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.ProgressView);
		
		maxProgress = ta.getInt(R.styleable.ProgressView_maxProgress, 100);
		progress = ta.getInt(R.styleable.ProgressView_progress, 0);
		text = ta.getString(R.styleable.ProgressView_text);
		color = ta.getColor(R.styleable.ProgressView_color, Color.GREEN);
		crossColor = ta.getColor(R.styleable.ProgressView_crossColor, Color.WHITE);
		float textSize = ta.getDimensionPixelOffset(R.styleable.ProgressView_textSize, 20);
		ta.recycle();
		
		/** 设置默认的Paint属性 **/
		paint = new Paint();
		paint.setAntiAlias(true);
		paint.setFlags(Paint.ANTI_ALIAS_FLAG);
        paint.setStyle(Paint.Style.FILL);
        paint.setTextSize(textSize);
        paint.setColor(color);
		
	}
	@Override
	protected void onDraw(Canvas canvas) {
		/** 白色背景 **/
		canvas.drawColor(Color.WHITE);
		
		/** 恢复颜色 **/
		paint.setColor(color);
		
		/** 得到画文字的左上角顶点 **/
		int offsetX = (int) ((getWidth() - text.length() * paint.getTextSize()) / 2);
		int offsetY = (int) ((getHeight() - paint.getTextSize()) / 2);
		
		/** 画默认文字 **/
		canvas.drawText(text, offsetX, offsetY, paint);
		
		/** 画进度 **/
		if(rect == null){
			rect = new Rect();
			rect.left = 0;
			rect.top = 0;
			rect.bottom = getHeight();
		}
		rect.right = (int) (getWidth() * progress / (float)maxProgress);
		canvas.drawRect(rect, paint);
        
		/** 画交叉的时候的文字 **/
        canvas.save();
        
        canvas.clipRect(rect);
        paint.setColor(crossColor);
        canvas.drawText(text, offsetX, offsetY, paint);
        
        canvas.restore();
	}
	/**
	 * 设置最大进度
	 * @return
	 */
	public int getMaxProgress() {
		return maxProgress;
	}
	/**
	 * 得到最大进度
	 * @param maxProgress
	 */
	public void setMaxProgress(int maxProgress) {
		this.maxProgress = maxProgress;
		invalidate();
	}
	/**
	 * 得到当前进度
	 * @return
	 */
	public int getProgress() {
		return progress;
	}
	/**
	 * 设置当前进度
	 * @param progress
	 */
	public void setProgress(int progress) {
		this.progress = progress;
		invalidate();
	}
	/**
	 * 得到显示的文字
	 * @return
	 */
	public String getText() {
		return text;
	}
	/**
	 * 设置显示的文字
	 * @param text
	 */
	public void setText(String text) {
		this.text = text;
		invalidate();
	}

	/***
	 * 设置提示文字的大小
	 * @param textSize
	 */
	public void setTextSize(int textSize) {
		paint.setTextSize(textSize);
		invalidate();
	}

	/***
	 * 设置进度和没有交叉的时候的文字的颜色
	 * @param color
	 */
	public void setColor(int color) {
		this.color = color;
        paint.setColor(color);
		invalidate();
	}
	/**
	 * 设置进度和文字交叉之后的文字颜色
	 * @param color
	 */
	public void setCrossColor(int color){
		crossColor = color;
		invalidate();
	}
	
}

简单测试代码：

package com.example.testproject;

import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.view.ViewGroup.LayoutParams;

public class ProgressTextViewActivity extends Activity {
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		
		LayoutParams params = new LayoutParams(LayoutParams.MATCH_PARENT,500);
		ProgressView view = new ProgressView(ProgressTextViewActivity.this);
		view.setText("正在下载...");
		view.setTextSize(40);
		view.setMaxProgress(10000);
		view.setProgress(5000);
		view.setColor(Color.parseColor("#FF336699"));
		view.setLayoutParams(params);
		view.setCrossColor(Color.WHITE);
		setContentView(view);
	}
}