二之番外.Android自定义控件

作者: KaelQ | 来源:发表于2016-06-11 14:11 被阅读505次

    1.继承并在绘制前后添加 法

    一句话:

    继承常用的控件后,在绘制之前或之后进行逻辑添加。

    关键代码

      @Override
        public void onDraw(Canvas canvas){
            //绘制前进行自己绘制。
            super.onDraw(canvas);
            //绘制后进行自己绘制。
        }
    

    例子:

    • 继承一个TextView,然后先绘制一个矩形,然后显示字。
    public class MyFirstView extends TextView{
        private Paint mpain;
        public MyFirstView(Context context) {
            super(context);
        }
        public MyFirstView(Context context, AttributeSet attrs) {
            super(context, attrs);
        }
        public MyFirstView(Context context, AttributeSet attrs, int defStyleAttr) {
            super(context, attrs, defStyleAttr);
        }
    
        @Override
        public void onDraw(Canvas canvas){
            mpain=new Paint();
            mpain.setColor(Color.LTGRAY);
            mpain.setStyle(Paint.Style.FILL);
            canvas.drawRect(0,0,getMeasuredWidth(),getMeasuredHeight(),mpain);
            super.onDraw(canvas);
        }
    }
    
    

    覆盖onDraw方法,在super.onDraw(canvas)前绘制一个灰色矩形。

    2.添加额外属性组合控件 法

    一句话:

    自己定义在xml的属性,然后覆盖构造函数获取属性并赋值。

    要满足两点:

    • 创建attrs.xml。
    • 覆盖一个构造函数获取attrs.xml里的属性并赋值。

    创建attrs.xml,并设定每个属性名和数据类型。
    这里设定两个textview的四个属性。

    <resources>
        <declare-styleable name="MySecondView">
            <attr name="leftText" format="string"/>
            <attr name="leftTextSize" format="dimension"/>
            <attr name="leftTextColor" format="color"/>
            <attr name="leftBackground" format="reference|color"/>
    
            <attr name="rightText" format="string"/>
            <attr name="rightTextSize" format="dimension"/>
            <attr name="rightTextColor" format="color"/>
            <attr name="rightBackground" format="reference|color"/>
        </declare-styleable>
    </resources>
    

    覆盖构造函数获取上述的属性,并且将上述属性的值放入具体的属性。

    public MySecondView(Context context, AttributeSet attrs) {
            super(context, attrs);
    
            TypedArray ta=context.obtainStyledAttributes(attrs, R.styleable.MySecondView);
            leftText=ta.getString(R.styleable.MySecondView_leftText);
            leftTextSize=ta.getDimension(R.styleable.MySecondView_leftTextSize,10);
            leftTextColor=ta.getColor(R.styleable.MySecondView_leftTextColor,0);
            leftBackground=ta.getDrawable(R.styleable.MySecondView_leftBackground);
    
            rightText=ta.getString(R.styleable.MySecondView_rightText);
            rightTextSize=ta.getDimension(R.styleable.MySecondView_rightTextSize,10);
            rightTextColor=ta.getColor(R.styleable.MySecondView_rightTextColor,0);
            rightBackground=ta.getDrawable(R.styleable.MySecondView_rightBackground);
    
            ta.recycle();
    
            leftTextView =(TextView)new TextView(context);
            leftTextView.setText(leftText);
            leftTextView.setTextSize(leftTextSize);
            leftTextView.setTextColor(leftTextColor);
            leftTextView.setBackground(leftBackground);
    
            rightTextView=(TextView)new TextView(context);
            rightTextView.setText(rightText);
            rightTextView.setTextSize(rightTextSize);
            rightTextView.setTextColor(rightTextColor);
            rightTextView.setBackground(rightBackground);
    
            LeftParams=new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
            LeftParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT,TRUE);
            RightParams=new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
            RightParams.addRule(RelativeLayout.ALIGN_PARENT_RIGHT,TRUE);
            this.addView(leftTextView,LeftParams);
            this.addView(rightTextView,RightParams);
        }
    

    然后在具体的布局xml中使用:

    <com.example.myview.MyView.MySecondView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            two:leftText="这是左边"
            two:leftTextColor="#0288D1"
            two:leftTextSize="20sp"
            two:rightText="这是右边"
            two:rightTextColor="#FF5722"
            two:rightTextSize="20sp"/>
    

    显示如下:

    3.彻底自己绘制 法

    一句话:

    继承View后覆盖onDraw()各凭本事0.0

    自己绘制一个阶梯状的小正方形~

    关键代码:

      @Override
        public void onDraw(Canvas canvas) {
            mpaint.setColor(0xff03A9F4);
            mpaint.setStyle(Paint.Style.FILL);
            for (int i = 0; i < 5; i++) {
                canvas.drawRect(i * 100, i * 100, i * 100 + 100, i * 100 + 100, mpaint);
            }
        }
    

    其实这个功能是最强的,所有的view都可以靠自己的想象力绘制出来,所以说,各!凭!本!事!哈哈。

    Demo源码地址

    相关文章

      网友评论

      • yangjianan:请问 海马玩怎么跟android studio 连起来呢,我的adb搜不到,自带的跟真机都可以:joy:
        KaelQ:@yangjianan 打开海马玩,然后在cmd里输入 adb connect 127.0.0.1:26944

      本文标题:二之番外.Android自定义控件

      本文链接:https://www.haomeiwen.com/subject/kqvhdttx.html