【小王的安卓之路】自定义控件开发（一）

自定义控件开发（基础篇）

当我们频繁使用某些控件的组合，并且要求这个控件能够响应事件时，我们就可以创建自定义控件。
本文以登录时的输入框为例：

一.创建过程：

1.1在res/values目录下新建 values resource file，用来定义控件的属性
代码如下：

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="inputview">
        <!--左侧显示的图片-->
        <attr name="inputicon" format="reference"></attr>
        <!--输入提示-->
        <attr name="inputhint" format="string"></attr>
        <!--判断是否密文显示-->
        <attr name="ispassword" format="boolean"></attr>
    </declare-styleable>
</resources>

1.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="@dimen/layoutheight"
    android:layout_gravity="center_horizontal"
    android:orientation="horizontal"
    android:paddingLeft="@dimen/marginsize"
    android:paddingRight="@dimen/marginsize">

    <ImageView
        android:id="@+id/icon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_phone"/>
    <EditText
        android:id="@+id/inputTest"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/hintString"
        android:paddingLeft="@dimen/marginsize"
        android:paddingRight="@dimen/marginsize"
        android:background="@null"
        android:textSize="@dimen/titlesize"/>

</LinearLayout>

1.3 新建包，然后新建InputView.java文件，继承自FrameLayout,并实现它的几个构造方法。
代码如下：

package views;

import android.content.Context;
import android.content.res.TypedArray;
import android.text.InputType;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.EditText;
import android.widget.FrameLayout;
import android.widget.ImageView;

import com.example.viewtest.R;

public class InputView extends FrameLayout {
    private int inputIcon;//获取icon的resourceId
    private String inputHint;//获取提示内容
    private boolean isPassword;//获取是否密文

    private View mView;
    private ImageView mIcon;
    private EditText inputText;

    public InputView(@androidx.annotation.NonNull Context context) {
        super(context);
        init(context,null);
    }

    public InputView(@androidx.annotation.NonNull Context context, @androidx.annotation.Nullable AttributeSet attrs) {
        super(context, attrs);
        init(context,attrs);
    }

    public InputView(@androidx.annotation.NonNull Context context, @androidx.annotation.Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context,attrs);
    }

    public InputView(@androidx.annotation.NonNull Context context, @androidx.annotation.Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
        init(context,attrs);
    }
    private void init(Context context,AttributeSet attributeSet)
    {
        if (attributeSet==null)
        {
            return;
        }
 //	获取自定义属性
       TypedArray typedArray= context.obtainStyledAttributes(attributeSet, R.styleable.inputview);
        inputIcon=typedArray.getResourceId(R.styleable.inputview_inputicon,R.mipmap.ic_launcher);
        inputHint = typedArray.getString(R.styleable.inputview_inputhint);
        isPassword =typedArray.getBoolean(R.styleable.inputview_ispassword,false);
        typedArray.recycle();

//        绑定布局
       mView= LayoutInflater.from(context).inflate(R.layout.inputview,this,false);
       mIcon=mView.findViewById(R.id.icon);
       inputText= mView.findViewById(R.id.inputTest);

//       布局关联属性

        mIcon.setImageResource(inputIcon);
        inputText.setHint(inputHint);
        inputText.setInputType(isPassword?InputType.TYPE_CLASS_TEXT|InputType.TYPE_TEXT_VARIATION_PASSWORD:InputType.TYPE_CLASS_PHONE);

       addView(mView);

    }
    public String getInputStr()
    {
        return inputText.getText().toString().trim();
    }
}

在另一个布局中使用我们的控件：

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

    android:gravity="center_vertical"
    tools:context=".MainActivity">
  <views.InputView
    android:id="@+id/inputview"
    android:layout_width="match_parent"
    android:layout_height="@dimen/layoutheight"
    app:inputicon = "@drawable/ic_phone"
    app:inputhint = "@string/phoneNumber"
    app:ispassword = "false">


    </views.InputView>
    <View
        android:layout_height="1dp"
        android:layout_width="match_parent"
        style="@style/line"/>





</LinearLayout>

效果如下：

就是简单地自定义小控件的实现。