Material Design UI Android 中的 TextField

问题描述

我想做一个像下面这样的编辑文本。我不想使用 TableRow 来做到这一点。 Material Design TextField 有什么办法吗？我为 TextInputEditText 圆形设置了背景。

我的设计有问题。

第一行我想在文本和图像之间留出更多空间。
第二行图片和文字不在同一行。
TextInputLayout 的背景无法更改。

请帮帮我。提前致谢！

解决方法

您可以使用：

       <com.google.android.material.textfield.TextInputLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:placeholderText="Name"
            app:startIconDrawable="@drawable/..."
            app:startIconTint="@color/...."
            app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.App.rounded"
            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox">

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

        </com.google.android.material.textfield.TextInputLayout>

与：

<style name="ShapeAppearanceOverlay.App.rounded" parent="">
    <item name="cornerSize">50%</item>
</style>

这是使用 Material Design TextFiled 实现的方法

如果您想在文本和图像之间留出更多空间，请使用

android:drawablePadding="16dp"

设置文本重力

android:gravity="center"

用于圆角半径没有外线边框设置样式

style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox" 块引用

如果要实现圆角边框设置

 app:boxCornerRadiusBottomEnd="32dp"
 app:boxCornerRadiusBottomStart="32dp"
 app:boxCornerRadiusTopEnd="32dp"
 app:boxCornerRadiusTopStart="32dp"

下面是代码片段

  <com.google.android.material.textfield.TextInputLayout   
 style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
                 android:layout_marginStart="32dp"
                 android:layout_marginEnd="32dp"
                 app:boxCornerRadiusBottomEnd="32dp"
                 app:boxCornerRadiusBottomStart="32dp"
                 app:boxCornerRadiusTopEnd="32dp"
                 app:boxCornerRadiusTopStart="32dp"
                 app:boxStrokeColor="@color/color_red"
                 app:startIconDrawable="@drawable/ic_user">
 
                 <com.google.android.material.textfield.TextInputEditText
 
                     android:layout_width="match_parent"
                     android:layout_height="wrap_content"
                     android:drawablePadding="16dp"
                     android:gravity="center"
                     android:hint="hint"
                     android:inputType="text" />
             </com.google.android.material.textfield.TextInputLayout>

android android android-textinputlayout material-components-android material-design textfield textfield textfield