? ? ?需要做一個android的自定義ProgressBar的進度條
? ? 展示一下效果圖:
? ? ? 這里最簡單就是繼承ProgressBar,這樣就不對自定義的進度條的生命周期之類方法的重新寫了。只要簡單的完成onMeasure()方法,onDraw()方法就可以了,以及配置文件的自定義屬性的配置就可以了。
1.配置自定義的ProgressWithNum進度條的自定義屬性
配置你想要的關于進度條的自定義屬性,在繪制的時候就會調用需要的參數。
首先在values文件下面建一個xml資源文件
配置的相關自定義屬性參數:
2.在自定義ProgressWithNum的構造方法中獲取了
? 繼承ProgressBar重寫他的構造方法。
public classProgressWithNumextendsProgressBar{
//各種控件屬性的默認值
//字體大小
private static final int DEFAULT_TEXT_SIZE=15;
//字體顏色
private static final int DEFAULT_TEXT_COLOR=0XFFFC00D1;
//進度條寬度
private static final int DEFAULT_LINE_HEIGHT=10;
//進度條漸變前顏色
private static final int DEFAULT_LINE_START_COLOR=0XFF95dee1;
//進度條漸變后的顏色
private static final int DEFAULT_LINE_END_COLOR=0XFF1AA0E5;
//背景進度條顏色
private static final int DEFAULT_BG_LINE_COLOR=0xFFd3d6da;
//字體是否顯示
protected static final int DEFAULT_TEXT_VISIBLE=0;
//默認值的賦值
protected int textSize=DEFAULT_TEXT_SIZE;
protected int textColor=DEFAULT_TEXT_COLOR;
protected int lineHeight=DEFAULT_LINE_HEIGHT;
protected int lineStartColor=DEFAULT_LINE_START_COLOR;
protected intl ineEndColor=DEFAULT_LINE_END_COLOR;
protected int bgLineColor=DEFAULT_BG_LINE_COLOR;
protected int textVisible=DEFAULT_TEXT_VISIBLE;
protected boolean mTextVisible=true;
privatePaintmPaint=newPaint();
private int progressBarWidth=0;
//構造方法
public ProgressWithNum(Context context, AttributeSet attrs) {
this(context,attrs,0);
}
public ProgressWithNum(Context context, AttributeSet attrs,intdefStyleAttr) {
super(context, attrs, defStyleAttr);
setHorizontalScrollBarEnabled(true);
//設置進度條自定義的屬性
obtainStyledAttributes(attrs);
mPaint.setTextSize(textSize);
mPaint.setColor(textColor);
}
private voidobtainStyledAttributes(AttributeSet attrs){
//找到資源styleable文件
final TypedArray attributes=getContext().obtainStyledAttributes(attrs,R.styleable.ProgressWithNum);
//各種屬性的賦值
textSize= (int) attributes.getDimension(R.styleable.ProgressWithNum_textSize,DEFAULT_TEXT_SIZE);
textColor=attributes.getColor(R.styleable.ProgressWithNum_textColor,DEFAULT_TEXT_COLOR);
textVisible=attributes.getInt(R.styleable.ProgressWithNum_textVisiable,DEFAULT_TEXT_VISIBLE);
if(textVisible==1){
mTextVisible=false;
}
lineHeight= (int) attributes.getDimension(R.styleable.ProgressWithNum_lineHeight,DEFAULT_LINE_HEIGHT);
lineStartColor=? attributes.getColor(R.styleable.ProgressWithNum_lineStartColor,DEFAULT_LINE_START_COLOR);
lineEndColor= attributes.getColor(R.styleable.ProgressWithNum_lineEndColor,DEFAULT_LINE_END_COLOR);
bgLineColor=attributes.getColor(R.styleable.ProgressWithNum_bgLineColor,DEFAULT_BG_LINE_COLOR);
attributes.recycle();
}
}
雖然這段代碼很長但是其實并沒有什么技術含量,總結來說就是在進行layout布局文件中進行自定義屬性的配置。
eg:
3.對onMeasure()方法的重寫
這個方法的作用主要就是對空間布局的修改,因為自定義控件的時候產生高度寬度等等的修改,這里就需要重新定義。
@Override
protected synchronized void onMeasure(intwidthMeasureSpec,intheightMeasureSpec) {
int widthModule=MeasureSpec.getMode(widthMeasureSpec);
int heightModule=MeasureSpec.getMode(heightMeasureSpec);
int width=MeasureSpec.getSize(widthMeasureSpec);
int height=MeasureSpec.getSize(heightMeasureSpec);
if(widthModule!=MeasureSpec.EXACTLY){
width=width+getPaddingLeft()+getPaddingBottom();
}
if(heightModule!=MeasureSpec.EXACTLY){
float textHeight=mPaint.ascent()+mPaint.descent();
int result=getPaddingBottom()+getPaddingTop()+(int) Math.max(lineHeight,textHeight);
if(heightModule==MeasureSpec.AT_MOST){
height=Math.min(height,result);
}
}
progressBarWidth=width-getPaddingLeft()-getPaddingRight();
//把修改后的寬高上傳
setMeasuredDimension(width, height);
}
4.重寫onDraw()進行繪圖制作。
主要就是為了計算每個組件之間的長度問題 以及漸變色的結果。
@Override
protected synchronized void onDraw(Canvas canvas) {
canvas.save();
canvas.translate(getPaddingLeft(), getHeight() /2);
float percent=getProgress()*1.0f/getMax();
String percentText=percent*100+"%";
float textWidth =mPaint.measureText(percentText);
float textHeight = (mPaint.descent() +mPaint.ascent()) /2;
floatprogressLeftWith=percent*progressBarWidth-textWidth/2;
booleanrightShow=true;
if(progressLeftWith+textWidth/2>=progressBarWidth){
progressLeftWith =progressBarWidth- textWidth;
rightShow=false;
}
//繪畫漸變進度條
float endX = progressLeftWith;
if(endX>0){
int[] mColors = {lineStartColor,lineEndColor};
//漸變顏色
Shader oShader =mPaint.getShader();
LinearGradient shader =newLinearGradient(0,0, endX ,0, mColors,null,
Shader.TileMode.CLAMP);
mPaint.setShader(shader);
//漸變結束
//線的圓角
mPaint.setStrokeCap(Paint.Cap.ROUND);
//線的高度
mPaint.setStrokeWidth(lineHeight);
//繪畫線
canvas.drawLine(0,0, endX,0,mPaint);
mPaint.setShader(oShader);
}
//繪畫顯示百分比
if(mTextVisible) {
mPaint.setColor(textColor);
canvas.drawText(percentText, progressLeftWith, -textHeight,mPaint);
}
//繪畫背景進度條
if(rightShow){
float start = progressLeftWith + textWidth;
mPaint.setColor(bgLineColor);
mPaint.setStrokeWidth(lineHeight);
canvas.drawLine(start,0,progressBarWidth,0,mPaint);
}
canvas.restore();
}
這樣一個控件就自定義完成了,
5.怎么使用這個ProgressWithNum控件
在xml的layout文件當中
自定義控件需要在layout的配置一個要不然自定義屬性會報錯
xmlns:app="http://schemas.android.com/apk/res-auto"
其次
<reactmdoule.zd.com.httpconnection.ProgressWithNum
android:id="@+id/progress"
android:paddingRight="20dp"
android:paddingLeft="20dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:textSize="16dp"
app:textColor="@color/colorAccent"
/>
最后在activity中運用
6.擴展方法
如果你想通過代碼進行對顏色或者某種自定義屬性的修改,又不想再xml中配置各種屬性,覺得很麻煩。那么現在有一種方法
eg:修改字體大小
添加這樣一個方法,而這個方法最重要的就是invalidate()方法,如果不添加。那么就會發現什么效果都沒有。
invalidate()方法主要就是為了刷新ondraw()從而能夠讓你setTextColor()字體大小修改得到實現。
//控件設置百分比字體大小
public void setTextColor(inttextColor){
this.textColor=textColor;
invalidate();
}
最后在使用的時候就是進行調用方法了:
progressWithNum.setTextColor(0XFF95dee1);