Android 自定义 View ------ 基本步骤
一般都是去
Github上淘一个,但是居然没找到,囧,一想,应该是太简单了吧所以没人做,而且功能简单.于是就自己写一个......
懒,是病,得治!
这是需求样式:(右上角的那个=.=)
http://oahzrw11n.bkt.clouddn.com//pic/20160812/progressshow812.png
第一步:自定义属性
创建文件
values/attrs.xml
添加需要自定义的属性:
<declare-styleable name="ProgressShowView">
<attr name="color_up" format="color"></attr>
<attr name="color_down" format="color"></attr>
</declare-styleable>
第二步 开始自定义 View
1.继承View
public class ProgressShowView extends View
2.获得自定义的属性
/**
* 获取自定义属性的值
* @param context
* @param attrs
*/
private void getAttrs(Context context, AttributeSet attrs) {
TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.ProgressShowView);
//获取颜色,会指定默认值
mColorUp = ta.getColor(R.styleable.ProgressShowView_color_up, Color.GRAY);
mColorDown = ta.getColor(R.styleable.ProgressShowView_color_down, Color.RED);
ta.recycle();
}
3.重写 onDraw(Canvas canvas)
这个看最后完整的代码吧,重复的代码就不贴了.
4.在布局里的使用:
<didikee.com.progressshow.ProgressShowView
android:id="@+id/ps"
android:layout_centerInParent="true"
android:layout_width="160dp"
android:layout_height="12dp"
app:color_down="#eeeeee"
app:color_up="#ff6600"
/>
完整代码
/**
* Created by didik on 2016/8/12.
*/
public class ProgressShowView extends View {
private int mColorUp;//上层的颜色
private int mColorDown;//下层的颜色
private int mProgress=50;//默认值
public ProgressShowView(Context context) {
super(context);
}
public ProgressShowView(Context context, AttributeSet attrs) {
super(context, attrs);
getAttrs(context,attrs);
}
public ProgressShowView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
getAttrs(context,attrs);
}
/**
* 获取自定义属性的值
* @param context
* @param attrs
*/
private void getAttrs(Context context, AttributeSet attrs) {
TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.ProgressShowView);
mColorUp = ta.getColor(R.styleable.ProgressShowView_color_up, Color.GRAY);
mColorDown = ta.getColor(R.styleable.ProgressShowView_color_down, Color.RED);
ta.recycle();
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
int width = this.getWidth();
int height = this.getHeight();
Log.e("test","width :"+width);
Log.e("test","height :"+height);
//单位是dp而非px
//角度
int radius=height/2;
// 创建画笔
Paint p = new Paint();
//画圆角矩形
//画下层
p.setStyle(Paint.Style.FILL);//充满
p.setColor(mColorDown);
p.setAntiAlias(true);// 设置画笔的锯齿效果,true表示抗锯齿,false不需要处理
RectF ovalDown = new RectF(0, 0, width, height);// 设置个新的长方形
canvas.drawRoundRect(ovalDown, radius, radius, p);
//画上层
p.setColor(mColorUp);
int widthUp=width*mProgress/100;
RectF ovalUp = new RectF(0, 0, widthUp, height);// 设置个新的长方形
canvas.drawRoundRect(ovalUp, radius, radius, p);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
Log.e("test","widthMeasureSpec :"+widthMeasureSpec+" || "+"heightMeasureSpec :"+heightMeasureSpec);
}
/**
* 设置百分比 98% 输入98 即可
* @param progress
*/
public void setProgress(int progress){
mProgress=progress;
}
}
最后惯例放效果图
http://oahzrw11n.bkt.clouddn.com//pic/20160812/showprogressview.png
希望对你们有的帮助,o(*≧▽≦)ツ
