Как я могу применить пользовательскую форму TextInputLayout как в состоянии Focused, так и в нормальном состоянии без использования librery

Question

Я хочу создать собственный закругленный угол TextInputLayout. Как я показал мой пример изображения активного TextInputLayout ниже

Мой код в xml равен

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

            <com.google.android.material.textfield.TextInputEditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="@string/mobile_number"
                android:inputType="number"
                android:fontFamily="@font/montserrat_regular"
                android:maxLength="10" />
</com.google.android.material.textfield.TextInputLayout>

Это дает мне TextInputLayout по умолчанию. Как я могу получить мое мнение. Пожалуйста, помогите мне. Получение ошибки в объявлении стиля.

Answer 1

Просто используйте стиль Widget.MaterialComponents.TextInputLayout.OutlinedBox и примените пользовательскую форму:

    <com.google.android.material.textfield.TextInputLayout
        style="@style/OutlinedRoundedBox"
        ...>

с:

 <style name="OutlinedRoundedBox" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
    <item name="shapeAppearanceOverlay">
      @style/ShapeAppearanceOverlay.MyApp.TextInputLayout.Rounded
    </item>
  </style>

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

Answer 2

Если вы хотите реализовать дизайн без использования третьей библиотеки. просто создайте стиль как этот:

<style name="OutlinedRoundBox" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
    <item name="boxBackgroundMode">outline</item>
    <item name="boxCornerRadiusBottomEnd">32dp</item>
    <item name="boxCornerRadiusBottomStart">32dp</item>
    <item name="boxCornerRadiusTopEnd">32dp</item>
    <item name="boxCornerRadiusTopStart">32dp</item>
    <item name="android:paddingLeft">20dp</item>
</style>