Android群英传-自定义View、控件

注意点

1. 绘制View的显示内容，需要重写onDraw()方法
2. 该View若要使用wrap_content属性，必须重写onMeasure()方法
3. 通过自定义attrs属性，还可以设置新的属性配置值

View中重要的回调方法

1. ++onFinishInflate()++： 从XML加载组件后回调
2. ++onSizeChanged()++：组件大小改变时
3. onMeasure()：进行测量
4. onLayout()： 确定显示的位置
5. onTouchEvent()： 监听触摸事件时回调

自定义控件三大方法

一、现有控件进行扩展

比如扩展TextView
思路如下：

    @Override    protected void onDraw(Canvas canvas) {        //回调父类方法前，实现自己的逻辑，对TextView来说在“绘制文本”内容之前        super.onDraw(canvas);        //回调父类方法后，实现自己的逻辑，对TextView来说在“绘制文本”内容之后    }

1.利用画笔绘制矩形框

public class MyTextView extends TextView {    public MyTextView(Context context) {        super(context);    }    public MyTextView(Context context,AttributeSet attrs) {        super(context, attrs);    }    @Override    protected void onDraw(Canvas canvas) {        //回调父类方法前，实现自己的逻辑，对TextView来说在“绘制文本”内容之前        Paint mPaint1 = new Paint();        mPaint1.setColor(ContextCompat.getColor(getContext(), R.color.colorAccent));        mPaint1.setStyle(Paint.Style.FILL);        canvas.drawRect(0, 0, getMeasuredWidth(), getMeasuredHeight(), mPaint1);        canvas.save();        //绘制文字前平移10像素(px)        canvas.translate(10, 0);        super.onDraw(canvas);        canvas.restore();    }}

2.LinearGradient Shader和Matrix实现动态的文字闪动效果

需要onDraw()和onSizeChanged()

    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        if(mMatrix != null){            mTranslate += mViewWidth/5;            if(mTranslate > 2*mViewWidth){                mTranslate = -mViewWidth;            }            mMatrix.setTranslate(mTranslate, 0);            mLinearGradient.setLocalMatrix(mMatrix);            postInvalidateDelayed(100);        }    }@Override    protected void onSizeChanged(int w, int h, int oldw, int oldh) {        super.onSizeChanged(w, h, oldw, oldh);        if(mViewWidth == 0){            mViewWidth = getMeasuredWidth();            if(mViewWidth > 0){                mPaint = getPaint();                mLinearGradient = new LinearGradient(                        0,                        0,                        mViewWidth,                        0,                        new int[]{                                Color.BLUE, 0xffffffff,                                Color.BLUE},                        null,                        Shader.TileMode.CLAMP);                mPaint.setShader(mLinearGradient);                mMatrix = new Matrix();            }        }    }

---

二、复合控件

简单的组合控件：
链接：http://blog.csdn.net/yelangjueqi/article/details/8879340

1.定义属性

为一个View提供自定义的属性，只需要在res的values目录下创建一个attrs.xml的属性定义文件，代码参考下面：

使用UI模板需要引用第三方控件的名字空间
* 下列引用android的系统属性

xmlns:android="http://schemas.android.com/apk/res/android"

• 第三方的控件都使用如下代码来引用名字空间

xmlns:app="http://schemas.android.com/apk/res-auto"

android studio需要使用xmlns:app

<?xml version="1.0" encoding="utf-8"?><resources>    <declare-styleable name="TopBar">        <attr name="Title" format="string"/>        <attr name="TitleTextSize" format="dimension"/>        <attr name="TitleTextColor" format="color"/>        <attr name="RightText" format="string"/>        <attr name="RightTextSize" format="dimension"/>        <attr name="RightTextColor" format="color"/>        <attr name="LeftImageSize" format="integer"/>    </declare-styleable></resources>

2.自定义控件类

package com.example.lenovo.qqdemos.CustomView;import android.content.Context;import android.content.res.TypedArray;import android.graphics.Color;import android.util.AttributeSet;import android.view.LayoutInflater;import android.view.View;import android.widget.ImageView;import android.widget.LinearLayout;import android.widget.TextView;import com.example.lenovo.qqdemos.R;/** * Created by feather on 2016/8/19. */public class TopBar extends LinearLayout{    private ImageView mHeadImage;    private TextView mTitleText;    private TextView mRightText;    //标题    String mTitle;    int mTitleTextColor;    float mTitleTextSize;    //左侧头像    float mHeadImageSize;    //右侧文本    String mRightTextStr;    int mRightTextColor;    float mRightTextSize;    //接口    topbarClickListener mListener;    public TopBar(Context context, AttributeSet attrs) {        super(context, attrs);        //注意参数: root=this, 及 attachToRo        LayoutInflater.from(context).inflate(R.layout.feather_topbar, this, true);        mHeadImage = (ImageView) findViewById(R.id.topbar_head_image);        mTitleText = (TextView) findViewById(R.id.topbar_title);        mRightText = (TextView) findViewById(R.id.topbar_right_text);        //将在 atts.xml中定义的 declare-styleable的所有属性的值存储到 TypedArray中        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.TopBar);        /*-----------------------------------------------------------         *   标题-根据属性初始化         * ----------------------------------------------------------*/        String mTitle = typedArray.getString(R.styleable.TopBar_Title);        int mTitleTextColor = typedArray.getColor(R.styleable.TopBar_TitleTextColor, Color.WHITE);        float mTitleTextSize = typedArray.getDimension(R.styleable.TopBar_TitleTextSize, 20);        if(mTitle != null) mTitleText.setText(mTitle);        mTitleText.setTextColor(mTitleTextColor);        mTitleText.setTextSize(mTitleTextSize);        /*-----------------------------------------------------------         *   左侧头像-根据属性初始化         * ----------------------------------------------------------*/        int mHeadImageSize = typedArray.getInt(R.styleable.TopBar_LeftImageSize, 20);        mHeadImage.setMaxWidth(mHeadImageSize);        mHeadImage.setMaxHeight(mHeadImageSize);        //监听器        mHeadImage.setOnClickListener(new OnClickListener() {            @Override            public void onClick(View v) {                mListener.leftImageClick();            }        });        /*-----------------------------------------------------------         *   右侧文本-根据属性初始化         * ----------------------------------------------------------*/        String mRightTextStr = typedArray.getString(R.styleable.TopBar_RightText);        int mRightTextColor = typedArray.getColor(R.styleable.TopBar_RightTextColor, Color.WHITE);        float mRightTextSize = typedArray.getDimension(R.styleable.TopBar_RightTextSize, 20);        if(mRightTextStr != null) mRightText.setText(mRightTextStr);        mRightText.setTextColor(mRightTextColor);        mRightText.setTextSize(mRightTextSize);        //监听器        mRightText.setOnClickListener(new OnClickListener() {            @Override            public void onClick(View v) {                mListener.rightTextClick();            }        });    }    public interface topbarClickListener{        void leftImageClick();        void rightTextClick();    }}

1.其中使用属性的办法

        //将在 atts.xml中定义的 declare-styleable的所有属性的值存储到 TypedArray中        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.TopBar);        /*-----------------------------------------------------------         *   根据属性初始化         * ----------------------------------------------------------*/        String mTitle = typedArray.getString(R.styleable.TopBar_Title);        int mTitleTextColor = typedArray.getColor(R.styleable.TopBar_TitleTextColor, Color.WHITE);        float mTitleTextSize = typedArray.getDimension(R.styleable.TopBar_TitleTextSize, 20);        int mHeadImageSize = typedArray.getInt(R.styleable.TopBar_LeftImageSize, 20);        String mRightTextStr = typedArray.getString(R.styleable.TopBar_RightText);        int mRightTextColor = typedArray.getColor(R.styleable.TopBar_RightTextColor, Color.WHITE);        float mRightTextSize = typedArray.getDimension(R.styleable.TopBar_RightTextSize, 20);        //避免重新创建时的错误        typedArray.recycle();

2.该控件的布局

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:background="@color/colorBlue"    android:orientation="vertical" >    <RelativeLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:background="#00000000">        <com.pkmmte.view.CircularImageView            android:id="@+id/topbar_head_image"            android:layout_width="40dp"            android:layout_height="40dp"            android:src="@drawable/default_user_head"            android:layout_alignParentLeft="true"            android:layout_centerVertical="true"            android:visibility="invisible"            >        </com.pkmmte.view.CircularImageView>        <TextView            android:id="@+id/topbar_title"            android:layout_width="wrap_content"            android:layout_height="match_parent"            android:text="标题"            android:textSize="20dp"            android:gravity="center"            android:textColor="@color/white"            android:layout_centerInParent="true"            android:visibility="invisible"/>        <TextView            android:id="@+id/topbar_right_text"            android:layout_width="wrap_content"            android:layout_height="match_parent"            android:layout_centerInParent="true"            android:text="编辑"            android:textSize="20dp"            android:layout_alignParentRight="true"            android:layout_marginRight="4dp"            android:textColor="@color/white"            android:gravity="center"            android:visibility="invisible"/>    </RelativeLayout></LinearLayout>

3.使用该控件

• 可以通过xmlns:app="http://schemas.android.com/apk/res-auto"使用自定义属性，如下面app:Title部分

    <com.example.lenovo.qqdemos.CustomView.TopBar        xmlns:app="http://schemas.android.com/apk/res-auto"        android:id="@+id/chat_menu_topbar"        android:layout_width="match_parent"        android:layout_height="55dp"        app:Title="hello">    </com.example.lenovo.qqdemos.CustomView.TopBar>

错误提示

1.android.view.InflateException: Binary XML file line #9: Error inflating class com.feather.past.MyTextView

2.java.lang.NoSuchMethodException: [class android.content.Context, interface android.util.AttributeSet]

1.报错原因：

在自定义view时，没有重写含有(Context context,AttributeSet attrs)的构造器

解决办法：

重新对于构造器，例如：

 public ControlKeyboardLinearLayout(Context context,AttributeSet attrs){         super(context, attrs);     }

2.报错原因：

自定义view为内部类时，没有将内部类设置为static，例如：

public class a{   public class b extents TextVIew{           ...   }}

解决办法：

为内部类加上static关键字，例如：

public class a{    public static class b extents TextVIew{       ...    }}