【小王的安卓之路】自定義控件開發（一）

自定義控件開發（基礎篇）

當我們頻繁使用某些控件的組合，並且要求這個控件能夠響應事件時，我們就可以創建自定義控件。
本文以登錄時的輸入框爲例：

一.創建過程：

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>

效果如下：

就是簡單地自定義小控件的實現。