Android 自定义View实现

首先定义构造方法 以及其父类

public class TranslateXView extends View ｛
    public TranslateXView(Context context, AttributeSet attrs) {
    super(context, attrs);
    init();}
  ｝

然后自定义view需要的属性（宽高，背景等不需要自定义）

如：

 <?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="TranslateXView">
    <attr name="textColor" format="color" />
    <attr name="textSize" format="dimension" />
</declare-styleable>
</resources>

获取属性

public TranslateXView(Context context,AttributeSet attrs)
{
    super(context,attrs);
    mPaint = new Paint();
    TypedArray a = context.obtainStyledAttributes(attrs,
            R.styleable.MyView);

    int textColor = a.getColor(R.styleable.TranslateXView_textColor,
            0XFFFFFFFF);
    float textSize = a.getDimension(R.styleable.TranslateXView_textSize, 36);

    mPaint.setTextSize(textSize);
    mPaint.setColor(textColor);
    a.recycle();
}

重写touch事件

@Override
  public boolean onTouchEvent(MotionEvent ev){
    {
    float currentX = ev.getX();
    float currentY = ev.getY();
    switch (ev.getAction()){
      case MotionEvent.ACTION_DOWN:
        startX = currentX;
        startY = currentY;
        this.currentX = startX;
        isTranslate = false;
        isSolid =false;
        break;
      case MotionEvent.ACTION_MOVE:
        isTranslate = Math.abs(currentX-startX) > moveSlop;
        this.currentX = currentX;
        if(isTranslate){
          if(currentX > getWidth())
          this.currentX = getWidth();
          if(currentX < 0)
            this.currentX = 0;
        }
        break;
      case MotionEvent.ACTION_CANCEL:
        isTranslate =false;
        break;
      case MotionEvent.ACTION_UP:
        this.currentX =currentX;
        isTranslate = true;
        isSolid = true;
        if(currentX > getWidth())
          this.currentX = getWidth();
        if(currentX < 0)
          this.currentX = getWidth()/4;
        double multiple = this.currentX/getWidth();
        if(multiple<=twenty)
          price = twenty;
        if(multiple>twenty&&multiple<=fourty){
          price = multiple-twenty>1/8?fourty:twenty;
        }
        if(multiple>fourty&&multiple<=sixty){
          price = multiple-fourty>1/8?sixty:fourty;
        }
        if(multiple>sixty&&multiple<=eighty){
          price = multiple-sixty>1/8?eighty:sixty;
        }
        break;
    }
    if(isTranslate)
      invalidate();
    return  true;
  }

invalidate()通知view进行重绘。

重写view的draw方法

@Override 
  protected void onDraw(Canvas canvas){
    super.onDraw(canvas);
    int redLineWidth;
    if(isSolid){
      changeText();
      redLineWidth = (int)(getWidth()*price);
    }else if(isTranslate){
      redLineWidth =(int)currentX;
    }else redLineWidth = getWidth()/4;
    drawProgressBar(canvas,redLineWidth);
    drawText(canvas,redLineWidth);
  }

然后使用canvas绘图就可以了，大致截图如下。

新来csdn，以后会持续写博客，希望大家一起进步。