Android验证码输入框仿照滴滴风格的实现方案

最近一直在忙着从零开始开发一个独立项目，真是累得像条狗一样啊。。。。 项目中有一个需求，需要实现一个类似于滴滴出行验证码输入的界面。这个输入框其实就是用shape画的背景，通过监听EditText获取焦点来改变背景。废话少说，直接上代码吧。

1. 首先，需要创建一个shape文件，用于定义验证码输入框的背景。

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/white" />
    <stroke android:width="1dp" android:color="@color/gray" />
    <corners android:radius="4dp" />
</shape>

2. 然后，需要在布局文件中使用这个shape来定义验证码输入框的背景。

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <EditText
        android:id="@+id/et_code1"
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="1"
        android:background="@drawable/code_background"
        android:gravity="center"
        android:inputType="number"
        android:maxLength="1" />

    <EditText
        android:id="@+id/et_code2"
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="1"
        android:background="@drawable/code_background"
        android:gravity="center"
        android:inputType="number"
        android:maxLength="1" />

    <EditText
        android:id="@+id/et_code3"
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="1"
        android:background="@drawable/code_background"
        android:gravity="center"
        android:inputType="number"
        android:maxLength="1" />

    <EditText
        android:id="@+id/et_code4"
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="1"
        android:background="@drawable/code_background"
        android:gravity="center"
        android:inputType="number"
        android:maxLength="1" />

    <EditText
        android:id="@+id/et_code5"
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="1"
        android:background="@drawable/code_background"
        android:gravity="center"
        android:inputType="number"
        android:maxLength="1" />

    <EditText
        android:id="@+id/et_code6"
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="1"
        android:background="@drawable/code_background"
        android:gravity="center"
        android:inputType="number"
        android:maxLength="1" />

</LinearLayout>

3. 最后，需要在代码中监听EditText获取焦点事件，并根据焦点状态改变验证码输入框的背景。

EditText[] ets = {et_code1, et_code2, et_code3, et_code4, et_code5, et_code6};
for (EditText et : ets) {
    et.setOnFocusChangeListener(new View.OnFocusChangeListener() {
        @Override
        public void onFocusChange(View v, boolean hasFocus) {
            if (hasFocus) {
                et.setBackgroundResource(R.drawable.code_background_focused);
            } else {
                et.setBackgroundResource(R.drawable.code_background);
            }
        }
    });
}

这样，就实现了一个仿照滴滴出行验证码输入框的效果。