代码之家 › 专栏 › 技术社区 › Alexa289

如何使用形状材料组件制作完整的圆角编辑文本?

material-components material-components-android android-xml android-edittext android

0

Alexa289 · 技术社区 · 6 年前

我需要做一个完整的圆形编辑文本,如下图所示。我用的是材料成分。在材料组件中,我们有可以修改的形状,对吗?所以我尝试使用样式来修改形状,我假设我可以使用样式来修改edittext形状

使用这种风格?

<style name="roundedEditText" parent="ShapeAppearance.MaterialComponents.SmallComponent">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSize">32dp</item>
    </style>

 <EditText
            android:id="@+id/editText_search_toolbar"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_marginStart="8dp"
            android:layout_marginEnd="4dp"
            android:background="@color/grey_light_top"
            android:ems="10"
            android:hint="Ketik nama ustadz, lokasi, atau acara"
            android:imeOptions="actionSearch"
            android:inputType="textPersonName"
            android:maxLines="1"
            android:paddingStart="16dp"
            android:textSize="12sp"
            style="@style/roundedEditText"
            app:layout_constraintBottom_toBottomOf="@+id/base_searchView_toolbar_keyword_search_result"
            app:layout_constraintEnd_toEndOf="@+id/base_searchView_toolbar_keyword_search_result"
            app:layout_constraintStart_toEndOf="@+id/imageView_back_icon"
            app:layout_constraintTop_toTopOf="@+id/base_searchView_toolbar_keyword_search_result" />

但它对我的edittext没有影响,它仍然是一个这样的矩形

如果不使用形状,我可以在材质组件中使用其他方式设置它吗?

1 回复 | 直到 6 年前

1

0

Gabriele Mariotti 6 年前

如果你想使用 TextInputLayout app:shapeAppearanceOverlay 属性:

   <com.google.android.material.textfield.TextInputLayout
        app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.MyApp.TextInputLayout.Rounded"
        ....

        app:hintEnabled="false"
        app:endIconDrawable="@drawable/..."
        app:endIconMode="custom"
        android:clipToPadding="true"
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        ...>

使用:

<style name="ShapeAppearanceOverlay.MyApp.TextInputLayout.Rounded" parent="">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">50%</item>
  </style>

如果你想用一个简单的 ExitText MaterialShapeDrawable 到 draw custom shapes .
Check this answer .