Andriod:自定义控件

野性酷女 2021-11-11 00:02 378阅读 0赞

我们经常写如下这样的登录注册页面

![20190803214040761.png][]

我们发现这些输入框都大同小异，无非就是两个子控件,三个属性

#### 两个子控件: ####

1.  **ImageView:** iv\_input\_icon
2.  **EditText:** et\_input\_text

#### 三个属性: ####

1.  **inputIcon:** 图标
2.  **inputHint:** 提示
3.  **isPassword:** 文本是否以密文的形式

所以我们可以把这些**InputText**封装成自己的控件

#### 1.在values文件夹下新建attrs.xml ####

`attrs.xml`

<?xml version="1.0" encoding="utf-8"?>
    <resources>
        <declare-styleable name="InputView">
            <attr name="input_icon" format="reference"></attr>
            <attr name="input_hint" format="string"></attr>
            <attr name="is_password" format="boolean"></attr>
        </declare-styleable>
    </resources>

#### 2.在layout文件夹下新建input\_view.xml ####

<?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="44dp" android:orientation="horizontal" android:layout_gravity="center_vertical" android:paddingLeft="16dp" android:paddingRight="16dp" >
        <ImageView android:id="@+id/iv_icon" android:layout_marginTop="4dp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@mipmap/phone" />
        
        <EditText android:id="@+id/et_input" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@null" android:hint="用户名" android:paddingLeft="16dp" android:paddingRight="16dp" android:textSize="18sp" />
    </LinearLayout>

#### 3.在java文件夹下新建类InputView继承FrameLayout ####

`InputView.class`

public class InputView extends FrameLayout { 
        //三个属性
        private int inputIcon;
        private String inputHint;
        private Boolean isPassword;
        private View view;
        //两个控件
        private ImageView iv_input_icon;
        private EditText et_input_text;
    
        public InputView(Context context) { 
            super(context);
        }
    
        public InputView(Context context, AttributeSet attrs) { 
            super(context, attrs);
            initInputView(context,attrs);
        }
    
        public InputView(Context context, AttributeSet attrs, int defStyleAttr) { 
            super(context, attrs, defStyleAttr);
            initInputView(context,attrs);
        }
    
        @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
        public InputView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) { 
            super(context, attrs, defStyleAttr, defStyleRes);
            initInputView(context,attrs);
    
        }
    
        private void initInputView(Context context, AttributeSet attrs) { 
            if (attrs == null) return;
    
            //获取自定义属性
            TypedArray typedArray = context.obtainStyledAttributes(attrs,R.styleable.InputView);
            inputIcon = typedArray.getResourceId(R.styleable.InputView_input_icon, R.mipmap.logo);
            inputHint = typedArray.getString(R.styleable.InputView_input_hint);
            isPassword = typedArray.getBoolean(R.styleable.InputView_is_password, false);
            //记得调用recycle方法
            typedArray.recycle();
    
            //绑定layout布局
            view = LayoutInflater.from(context).inflate(R.layout.input_view, this, false);
            iv_input_icon = view.findViewById(R.id.iv_icon);
            et_input_text= view.findViewById(R.id.et_input);
    
            //布局关联属性
            iv_input_icon.setImageResource(inputIcon);
            et_input_text.setHint(inputHint);
            et_input_text.setInputType(isPassword ? InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_PASSWORD : InputType.TYPE_CLASS_PHONE);
            addView(view);
        }
    
        /** * 返回输入的内容 * @return */
    
        public String getInputStr(){ 
            return et_input_text.getText().toString().trim();
        }
    }

#### 4.这样我们就将自己的控件建立好了,然后在activity\_login中使用自己的控件 ####

<?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" tools:context=".LoginActivity">
        
        <include layout="@layout/nav_bar" />
    
        <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:layout_marginTop="@dimen/marginSize" android:src="@mipmap/logo" />
    
        <com.wantao.music.Views.InputView android:layout_width="match_parent" android:layout_height="46dp" android:layout_marginTop="16dp" app:input_hint="请输入手机号" app:input_icon="@mipmap/phone" app:is_password="false"></com.wantao.music.Views.InputView>
    
        <com.wantao.music.Views.InputView android:layout_width="match_parent" android:layout_height="46dp" android:layout_marginTop="16dp" app:input_hint="请输入密码" app:input_icon="@mipmap/password" app:is_password="true">
        </com.wantao.music.Views.InputView>
    </LinearLayout>

[20190803214040761.png]: /images/20211109/c6eb5ab930e043dab61c853188129260.png