检测android编辑文本中用户输入的位数

Question

我正在处理一个项目，我需要使用PIN码锁定自己的应用。

我想使用四个圆圈作为edittext的背景，并在用户输入数字时填充每个圆圈。就像iOS锁屏一样。

如果有输入，我如何填写这些圈子？

Answer 1

这是我为您开始的一个快速示例。

首先应该定义传递代码的椭圆形状，我已经在drawable文件夹中的两个文件中定义了：

elipse.xml：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" >
    <gradient android:startColor="#8BE807" android:endColor="#68B002" android:angle="270" />
</shape>

ellipse_checked.xml：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" >
    <gradient android:startColor="#C7C7C7" android:endColor="#8A8A8A" android:angle="270"/>
</shape>

接下来，我已将四个ellipses（View＆＃39; s）和ExitText添加到我的视图中，如下所示：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:gravity="center_vertical|center_horizontal"
android:orientation="vertical">

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

    <View
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:background="@drawable/ellipse"
        android:id="@+id/elipse1"
        android:layout_margin="10dip" />

    <View
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:background="@drawable/ellipse"
        android:id="@+id/elipse2"
        android:layout_margin="10dip" />

    <View
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:background="@drawable/ellipse"
        android:id="@+id/elipse3"
        android:layout_margin="10dip" />

    <View
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:background="@drawable/ellipse"
        android:id="@+id/elipse4"
        android:layout_margin="10dip" />

</LinearLayout>

<EditText
    android:layout_width="100dip"
    android:layout_height="wrap_content"
    android:inputType="textPassword"
    android:ems="10"
    android:id="@+id/txtPass"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="30dip"
    android:textAlignment="center"
    android:maxLength="4"
    android:gravity="center" />

</LinearLayout>

然后我的MainActivity内有：

int passlen = 0;
Drawable mDrawableElipseChecked;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    // Used to change our pass-code ellipses style
    mDrawableElipseChecked = this.getResources().getDrawable(R.drawable.ellipse_checked);

    // Ellipses
    final View elipse1 = findViewById(R.id.elipse1);
    final View elipse2 = findViewById(R.id.elipse2);
    final View elipse3 = findViewById(R.id.elipse3);
    final View elipse4 = findViewById(R.id.elipse4);

    // Listen for text changes to our pass-code EditText
    final EditText txtPass = (EditText) findViewById(R.id.txtPass);
    txtPass.setOnKeyListener(new View.OnKeyListener() {
        @Override
        public boolean onKey(View view, int i, KeyEvent keyEvent) {

            if (keyEvent.getAction() == KeyEvent.ACTION_UP) {

                // Crude example of how to "check" / "un-check" our 
                // ellipses NOTE: You should write a better implementation 
                // for handling deletes etc
                passlen = txtPass.getText().length();
                if (passlen == 1) {
                    elipse1.setBackground(mDrawableElipseChecked);
                } else if (passlen == 2)
                    elipse2.setBackground(mDrawableElipseChecked);
                else if (passlen == 3)
                    elipse3.setBackground(mDrawableElipseChecked);
                else if (passlen == 4)
                    elipse4.setBackground(mDrawableElipseChecked);
                else {
                    return true;
                }
            }
            return false;
        }
    });

}

您现在应该有一个非常简单的示例，说明如何为应用程序实现类似功能的传递代码。

注意：这是一个如何开始实施类似屏幕的密码的简单演示，您应该根据自己的需要进行调整和改进。