使用onDraw()方法绘制出的自定义控件_ocx ondraw中显示控件

我理解的自定义控件

前言:

自定义控件是我们学习Android的必经之路.对于新手来说可能知道自定义控件的步骤:
1, 继承View 或ViewGroup;
2,重写onMeasure()方法;
3,重写onLayout()方法;
4,重写onDraw()方法;

---

自定义控件分3种情况:

一. 控件有我们自己完全绘制出来.

必须实现的方法是onDraw(),一般不需要写onLayout()方法.
因为:
我们要绘制这样一个控件时,肯定会根据宽和高来绘制,而绘制是的宽和高也有两种方法来获取,

a.根据xml中的宽和高来测量.此时xml中为warp_context(你应该懂得).

b.我们直接将宽和高写死.也就是我们控件大小就是固定的.如:200*200;
这种情况时下:
如果我们在xml中使用控件时 使用这两个属性

//我们的控件显示出来的就是200*200 ,下面两个属性是为这个控件指定在父布局中可以占的空间.
  android:layout_height="400dp"
   android:layout_width="400dp" 

//如果
  android:layout_height="100dp"
   android:layout_width="100dp" 
  // 那么我们的控件就不能完全显示出来,由于-----我们的大小是200*200可是xml中只给了我们100*100.所以控件不能完全显示出来
1
2
3
4
5
6
7
8

好了上代码:

1,定义自定义属性
studio中: values文件夹下创建一个attrs.xml文件

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

    <declare-styleable name="myTextView">
        <attr name="myText" format="string" />
        <attr name="myColor" format="color" />
    </declare-styleable>


</resources>
1
2
3
4
5
6
7
8
9
10

2.布局文件中
一定要记得引用xmlns —-xml命名空间:
studio引用时 xmlns:custom=”http://schemas.android.com/apk/res-auto”
eclipse引用时xmlns:custom=”http://schemas.android.com/apk/包名”

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:custom="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"

    tools:context="com.example.custom.activity.CustomActivity">

    <com.example.custom.view.myTextView
        android:id="@+id/my"
        android:layout_height="400dp"
        android:layout_width="200dp"
        custom:myColor="#654321"
        custom:myText="自定义"
        />


</RelativeLayout>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

/**
 * 作者 : fy on 2015/11/20.
 * 注释 :
 */
public class myTextView extends View {

    private Paint mPaint;
    private int color;
    private String text;
    private Rect mBounds;

    public myTextView(Context context) {
        this(context, null);
    }

    public myTextView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public myTextView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);

        mPaint = new Paint();

       //使用的自定义属性(其实可以不用)
        TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.myTextView);
        int count = a.getIndexCount();
        for (int i = 0; i < count; i++) {
            int attr = a.getIndex(i);

            switch (attr) {
                case R.styleable.myTextView_myColor:
                //得到我们定义的颜色
                    color = a.getColor(R.styleable.myTextView_myColor, Color.RED);
                    System.out.println("color---------------" + color);
                    break;
                case R.styleable.myTextView_myText:
                    text = a.getString(R.styleable.myTextView_myText);
                    System.out.println("text---------------" + text);
                    break;
            }

        }
        a.recycle();

    }


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

        mPaint.setColor(color);  //设置画笔的颜色.这个颜色我们是从自定义属性中得到的
        mPaint.setStyle(Paint.Style.STROKE);
        RectF rect = new RectF(0, 0, 150, 150);  //设置一个区域范围(坐标为父布局中的坐标左上(0,0),右下(150,150))

        canvas.drawArc(rect, 3, 270, false, mPaint);  //将圆形在rect这个范围内绘制
        canvas.drawText(text, 75, 75, mPaint);

    }
/**
*       为这个组件注册点击触摸事件
*/
    @Override
    public boolean onTouchEvent(MotionEvent event) {


        System.out.println("点击了控件");

        //   text = "点击后";  //改变了控件

        mOnsetText.change();
        invalidate();  //重新绘制
        return super.onTouchEvent(event);
    }

    public void setText(String t) {
        this.text = t;
    }

    public void setmOnsetText(OnsetText onsetText) {

        this.mOnsetText = onsetText;
    }

    private OnsetText mOnsetText;


    //给外部一个接口以便拓展
    public interface OnsetText {
        void change();
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93

在Activity中使用:

public class CustomActivity extends Activity {

    myTextView myTextView;
    int mCount = 0;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_custom);

        myTextView = (com.example.custom.view.myTextView) findViewById(R.id.my);

        myTextView.setmOnsetText(new myTextView.OnsetText() {
            @Override
            public void change() {
                    mCount++;
                    //每点击一次数字会加 1
                    myTextView.setText(mCount+"");
            }
        });
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

运行结果

---

这只是自定义的组件的很简单的实现.感觉心里想的完全不会去描述.还是技术有限吧.希望看到的童鞋能分享我更好的资料.

二. 自定义组合控件:

等待更新…