自定義View解析

阿新 • • 發佈：2018-12-21

首先我們先介紹組合View:
public class MyXHView extends LinearLayout {
private EditText mEditText;
private TextView mCancel;

public MyXHView(Context context, AttributeSet attrs) {
    super(context, attrs);
    LayoutInflater.from(context).inflate(R.layout.header_view, this);
    mEditText = findViewById(R.id.Search_Edit);
    mCancel = findViewById(R.id.Cancel_Text);
}

public String getEditStr() {
    return mEditText.getText().toString();
}

public TextView getmCancel() {
    return mCancel;
}

}

ball:
public class BallView extends View {

private Paint paint;
Context context;

//圓的初始位置座標
private int x = 38;
private int y = 38;
private int radius = 35;    //圓半徑

public BallView(Context context, AttributeSet attrs) {
    super(context, attrs);
    this.context = context;
}

/**
 * 實現onDraw()方法實現繪圖操作
 *
 * @param canvas
 */
@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    //用canvas將螢幕設為白色
    canvas.drawColor(Color.WHITE);

    //設定畫筆顏色為紅色
    paint = new Paint();
    paint.setColor(Color.RED);

    //設定消除鋸齒
    paint.setAntiAlias(true);
    //使用畫筆繪製圓為小球
    //x :圓心的x座標
    //y :圓心的y座標
    //radius ：圓的半徑
    //paint ：畫筆
    canvas.drawCircle(x, y, radius, paint);
}

//實現onTouchEvent方法，處理觸控事件
@Override
public boolean onTouchEvent(MotionEvent event) {
    //判斷觸控點
    switch (event.getAction()) {
        //實現MotionEvent.ACTION_DOWN，記錄按下的x，y座標：getRawX()和getRawY()獲得的是相對螢幕的位置
        case MotionEvent.ACTION_DOWN:
            x = (int) event.getX();
            y = (int) event.getY();
            System.out.println("按下時：  " + "x座標：" + event.getRawX() + "     " + "y座標：" + event.getRawY());

            //實現MotionEvent.ACTION_MOVE 記錄移動的x，y座標：getRawX()和getRawY()獲得的是相對螢幕的位置
        case MotionEvent.ACTION_MOVE:
            x = (int) event.getX();
            y = (int) event.getY();
            System.out.println("移動時：  " + "x座標：" + event.getRawX() + "     " + "y座標：" + event.getRawY());

            //實現MotionEvent.ACTION_UP 記錄擡起的x，y座標
        case MotionEvent.ACTION_UP:
            // 獲取當前觸控點的x,y座標，為X軸和Y軸座標重新賦值：getX()和getY()獲得的永遠是view的觸控位置座標
            x = (int) event.getX();
            y = (int) event.getY();
            System.out.println("擡起時：  " + "x座標：" + event.getRawX() + "     " + "y座標：" + event.getRawY());
            break;
    }

    //獲取螢幕寬高
    WindowManager manager = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
    int width = manager.getDefaultDisplay().getWidth();
    int height = manager.getDefaultDisplay().getHeight();

    //修正圓點座標，重新繪製圓 ,控制小球不會被移出螢幕
    if (x >= 18 && y >= 18 && x <= width - 18 && y <= height - 18) {
        /**
         *  Android提供了Invalidate方法實現介面重新整理，但是Invalidate不能直接線上程中呼叫，因為他是違背了單執行緒模型：
         1. Android UI操作並不是執行緒安全的，並且這些操作必須在UI執行緒中呼叫。
         　　 invalidate()是用來重新整理View的，必須是在UI執行緒中進行工作。比如在修改某個view的顯示時，呼叫invalidate()才能看到重新繪製的介面。invalidate()的呼叫是把之前的舊的view從主UI執行緒佇列中pop掉。
         2.Android 程式預設情況下也只有一個程序，但一個程序下卻可以有許多個執行緒。在這麼多執行緒當中，把主要是負責控
         制UI介面的顯示、更新和控制元件互動的執行緒稱為UI執行緒，由於onCreate()方法是由UI執行緒執行的，所以也可以把UI執行緒理解
         為主執行緒。其餘的執行緒可以理解為工作者執行緒。invalidate()得在UI執行緒中被調動，在工作者執行緒中可以通過Handler來通
         知UI執行緒進行介面更新。而postInvalidate()在工作者執行緒中被呼叫。
         */
        //使用 postInvalidate()方法實現重繪小球，跟隨手指移動

// postInvalidate();
postInvalidate();
}
/*
* 備註：此處一定要將return super.onTouchEvent(event)修改為return true，原因是：
* 1）父類的onTouchEvent(event)方法可能沒有做任何處理，但是返回了false。
* 2)一旦返回false，在該方法中再也不會收到MotionEvent.ACTION_MOVE及MotionEvent.ACTION_UP事件。
*/
//return super.onTouchEvent(event);
return true;
}

}
每點選一次+1:

public class CounterView extends View implements View.OnClickListener {
private Paint mPaint;
private Rect mRect;
// 計數值，每點選一次本控制元件，其值增加1
private int mCount;

public CounterView(Context context, AttributeSet attrs) {
    super(context, attrs);
    mPaint = new Paint();
    mRect = new Rect();
    setOnClickListener(this);
}


@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    mPaint.setColor(Color.RED);
    canvas.drawRect(0, 0, getWidth(), getHeight(), mPaint);
    String text = String.valueOf(mCount);
    mPaint.setColor(Color.YELLOW);
    mPaint.setTextSize(50);
    mPaint.getTextBounds(text, 0, text.length(), mRect);
    int width = mRect.width();
    int height = mRect.height();
    canvas.drawText(text, getWidth() / 2 - width / 2, getHeight() / 2 + height / 2, mPaint);
    Log.e("getWidth", getWidth() + "");
    Log.e("getHeight", getHeight() + "");
    Log.e("height", height + "");

}

@Override
public void onClick(View v) {
    mCount++;
    invalidate();
}

}
畫環畫圓 myView:
先在values建立xml檔案:

<?xml version="1.0" encoding="utf-8"?>

    <attr name="textSize" format="dimension" />
    <attr name="text" format="string" />
    <attr name="circleColor" format="color" />
    <attr name="arcColor" format="color" />
    <attr name="textColor" format="color" />
    <attr name="startAngle" format="integer" />
    <attr name="sweepAngle" format="integer" />
</declare-styleable>

然後在佈局中:

    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:startAngle="0"
    app:sweepAngle="270"
    app:text="hehe"
    app:textSize="30sp"
    app:textColor="@color/colorPrimaryDark"
    app:circleColor="@color/colorPrimary"
    app:arcColor="@color/colorAccent"

自己在value資料夾下新建attrs檔案就可以在它裡面定義自己想要的屬性了
咱們自定義View初始化的東西要放到建構函式之後執行
因為我們自己寫的View執行順序
1：構造方法
2：測量

*/
public class MyView extends View {

private String text;
private int circleColor;
private int arcColor;
private int textColor;
private float textSize;
private int startAngle;
private int sweepAngle;
private int mCircleXY;
private float mRadius;
private Paint mCirclePaint;
private RectF mRectF;
private Paint mArcPaint;
private Paint mTextPaint;

public MyView(Context context, AttributeSet attrs) {
    super(context, attrs);
    //得到我們自己定義的屬性集合
    TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.MyView);
    if (ta != null) {
        //兩個引數  引數1：R.styleable.MyView_circleColor 代表的咱們自己定義屬性集合
        //引數2：如果你在佈局檔案裡面沒有新增定義的屬性 就給一個預設值
        circleColor = ta.getColor(R.styleable.MyView_circleColor, 0);
        arcColor = ta.getColor(R.styleable.MyView_arcColor, 0);
        textColor = ta.getColor(R.styleable.MyView_textColor, 0);
        textSize = ta.getDimension(R.styleable.MyView_textSize, 50);
        text = ta.getString(R.styleable.MyView_text);
        startAngle = ta.getInt(R.styleable.MyView_startAngle, 0);
        sweepAngle = ta.getInt(R.styleable.MyView_sweepAngle, 90);
        ta.recycle();
        Log.e("text", text);
    }
}

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    drawSth(canvas);
}

private void drawSth(Canvas canvas) {
    init();
    canvas.drawCircle(mCircleXY, mCircleXY, mRadius, mCirclePaint);
    canvas.drawArc(mRectF, startAngle, sweepAngle, false, mArcPaint);
    canvas.drawText(text, 0, text.length(), mCircleXY, mCircleXY + textSize
            / 4, mTextPaint);
}

private void init() {
    //getWidth() 得到當前這個空間寬和高
    int length = Math.min(getWidth(), getHeight());
    Log.e("看看寬和高", "寬度：" + getWidth() + "高度：" + getHeight());
    mCircleXY = length / 2;
    mRadius = length * 0.5f / 2;
    mCirclePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    mCirclePaint.setColor(circleColor);
    mRectF = new RectF(length * 0.1f, length * 0.1f, length * 0.9f,
            length * 0.9f);

    mArcPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    mArcPaint.setColor(arcColor);
    mArcPaint.setStyle(Paint.Style.STROKE);
    mArcPaint.setStrokeWidth((getWidth() * 0.1f));

    mTextPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    mTextPaint.setTextSize(textSize);
    mTextPaint.setColor(textColor);
    mTextPaint.setTextAlign(Paint.Align.CENTER);

}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    Log.e("onMeasure", "onMeasure");
}

}

自定義View解析

自定義View解析

自定義View（三） Matrix的原理解析

自定義View（二）View的事件分發機制原始碼解析

我的Android進階之旅------>Android自定義View來實現解析lrc歌詞並同步滾動、上下拖動、縮放歌詞的功能

自定義View：View的Measure測量過程解析

自定義View，又一種進度條的呈現，CircleProgressView使用解析

Android自定義View（二、深入解析自定義屬性）

Android 自定義view完全解析--帶你通透了解自定義view

Android 自定義View 中attr屬性深入解析

Android自定義View來實現解析lrc歌詞同步滾動、上下拖動、縮放歌詞等功能

網路測速全解析之一：自定義View基礎知識（一）

Android自定義view組合控制元件解析

Android 自定義View的post(Runnable)方法非100%執行的原因和處理方法解析

自定義View框架完全解析

Android 自定義View

自定義VIew方法

自定義View總結

Android零基礎入門第24節：自定義View簡單使用

簡單自定義VIEW報錯問題

Android自定義view詳解

自定義View解析

相關推薦