根据Material Design文档创建文本字段框

Question

我一直在尝试创建一个文本字段框,如材料设计指南中所述.我无法弄清楚如何实现这一目标.这就是我想要实现的目标.

TextField Box材料设计截图

如果图像不够清晰,我还附上了具有材料设计指南的链接.我只需要创建一个文本字段框,但我无法弄明白.这是材料设计指南页面的链接

https://material.io/guidelines/components/text-fields.html#text-fields-text-field-boxes

还附加我想要创建的文本字段的xml代码.

<android.support.design.widget.TextInputLayout
                    android:id="@+id/firstNameTextInputLayout"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="20dp">

                        <android.support.design.widget.TextInputEditText
                            android:id="@+id/firstNameTextInputEditText"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:hint="@string/firstName"
                            android:inputType="textPersonName"
                            tools:ignore="MissingPrefix" />

                </android.support.design.widget.TextInputLayout>

提前致谢.请帮助.

Answer 1

欢迎您在Github上使用我的图书馆:

https://github.com/HITGIF/TextFieldBoxes

请注意,它需要Android 4.0.3 IceCreamSandwich(API lv 15)或更高版本.

首先在项目中添加依赖项:

对于Gradle:

allprojects {
    repositories {
      ...
      maven { url 'https://jitpack.io' }
    }
}

dependencies {
    compile 'com.github.HITGIF:TextFieldBoxes:1.3.9'
}

有关其他构建工具和说明,请参阅Github repo: README.md

然后将这些添加到您的布局:

...
<studio.carbonylgroup.textfieldboxes.TextFieldBoxes
    android:id="@+id/text_field_boxes"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:labelText="Label">

    <studio.carbonylgroup.textfieldboxes.ExtendedEditText
        android:id="@+id/extended_edit_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

</studio.carbonylgroup.textfieldboxes.TextFieldBoxes>
...

有关更多信息和用法,请参阅上面的Github repo.