Android EditText具有不同的浮动标签和占位符

Moh*_*osa 14 android material-design

我如何创建一个看起来像这样的editText?

使用占位符和标签编辑文本

Fer*_*med 21

您可以使用TextInputLayout和执行此操作EditText.

这是你的XML:

<android.support.design.widget.TextInputLayout
    android:id="@+id/text_input_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="Label">

    <EditText
        android:id="@+id/edit_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="text" />

</android.support.design.widget.TextInputLayout>
Run Code Online (Sandbox Code Playgroud)

1.添加属性android:hint="Label"以始终TextInputLayout显示其提示Label.

2.仅在获得焦点时以编程方式设置EditText提示.PlaceholderEditText

在您的活动中添加以下行:

    .........
    .................

    final EditText editText = (EditText) findViewById(R.id.edit_text);

    editText.setOnFocusChangeListener(new View.OnFocusChangeListener() {
        @Override
        public void onFocusChange(View view, boolean hasFocus) {
            if (hasFocus) {
                editText.setHint("Placeholder");
            } else {
                editText.setHint("");
            }
        }
    });

    .........
    ..................
Run Code Online (Sandbox Code Playgroud)

OUTPUT:

在此输入图像描述

希望这会有所帮助〜

  • 有没有办法让标签和占位符(如屏幕截图)保持未聚焦状态? (2认同)
  • 浮动标签和提示确实有效,但我需要在字段上点击两次才能显示键盘。有什么建议么? (2认同)

Gab*_*tti 14

通过材料组件库,您可以使用:

  • app:placeholderText:在EditText中添加占位符文本
  • android:hint:添加浮动标签

他们可以一起工作:

<com.google.android.material.textfield.TextInputLayout
        android:hint="Label"
        app:placeholderText="Placeholder Text"
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述

注意:它至少需要版本1.2.0-alpha03.

  • 请注意,这仅在编辑文本处于焦点时才有效。当未聚焦时,将显示提示(“标签”)而不是占位符 (2认同)

Flo*_*lin 8

<android.support.design.widget.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="Label">

    <android.support.design.widget.TextInputEditText
        android:hint="Placeholder"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textEmailAddress" />

</android.support.design.widget.TextInputLayout>
Run Code Online (Sandbox Code Playgroud)

请注意,android:hint="Placeholder"TextInputEditText在同一时间看到android:hint="Label"TextInputLayout当视图不集中。您可以在 Java 代码中进行一些额外检查以显示和隐藏该标签。还是见好就收android:hint="Placeholder"TextInputLayout

要更改颜色,您需要使用android:theme="@style/TextLabelfor设置主题TextInputLayout并设置您的颜色强调。

<style name="TextLabel" parent="TextAppearance.AppCompat.Light">
   <item name="colorAccent">@color/yourColor</item>
</style>
Run Code Online (Sandbox Code Playgroud)


Sri*_*Sri 0

您可以使用下面的布局 xml 文件,如下所示。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
    android:text="Label"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/textView2"
    android:textColor="@color/wallet_holo_blue_light" />
<EditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:inputType="textPersonName"
    android:text="Name"
    android:ems="10"
    android:id="@+id/editText2"
    android:hint="Placeholder" />
    </LinearLayout>
Run Code Online (Sandbox Code Playgroud)