Material 使用 androidx 的 OutlinedBox 提示

Question

我指的是：答案与过时的支持库有关，而不是 androidx。

如何创建带有 提示的 OutlinedBox 在左上角框架 而不是在框内？整个上午都没有成功。我想要的是这样的：

我的成绩：

implementation 'androidx.appcompat:appcompat:1.1.0'
implementation 'com.google.android.material:material:1.1.0'

我的应用主题：

style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar"

我的布局：

<com.google.android.material.textfield.TextInputLayout
                android:id="@+id/textField"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="20dp"
                style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
                android:hint="Full name" >

                <com.google.android.material.textfield.TextInputEditText
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    />
            </com.google.android.material.textfield.TextInputLayout>

我的结果（帧是连续的，左上角没有嵌入提示）：

Answer 1

        <com.google.android.material.textfield.TextInputLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="5dp">

            <com.google.android.material.textfield.TextInputEditText
                android:id="@+id/etProposalTitle"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:fontFamily="@font/medium"
                android:hint="Title."
                android:inputType="text"
                android:textSize="18sp" />
        </com.google.android.material.textfield.TextInputLayout>

Answer 2

试试下面的代码：

<com.google.android.material.textfield.TextInputLayout
            android:id="@+id/etlFirst"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
            app:hintTextColor="@color/colorPrimary"
            android:focusable="true"
            android:hint="Label">
            <com.google.android.material.textfield.TextInputEditText
                android:id="@+id/etFirst"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColorHint="@color/colorAccent"
                android:hint="PlaceHolder"/>
        </com.google.android.material.textfield.TextInputLayout>

要显示两个提示，请尝试 .java 文件中的以下代码：

etFirst.setOnFocusChangeListener(new View.OnFocusChangeListener() {
        @Override
        public void onFocusChange(View v, boolean hasFocus) {
            if (hasFocus) {
                etFirst.setHint("Place Holder");

            } else {
                etFirst.setHint("Label");
            }
        }
    });

以上代码的输出是：

希望对您有所帮助

Answer 3

如果你想同时显示左上角的提示标签和 EditText 中的占位符文本，你可以使用：

app:placeholderText: 在EditText
android:hint: 添加浮动标签

他们可以一起工作：

<com.google.android.material.textfield.TextInputLayout
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        android:hint="Label"
        app:placeholderText="Placeholder Text"

注意： 至少需要 1.2.0-alpha03.

版本

Material 使用 androidx 的 OutlinedBox 提示

Material OutlinedBox hint with androidx

android

android-layout

material-design

android-textinputlayout

androidx