Измените Версию Материала 1.1.0 на 1.3.0

#android #styles #material-components-android #android-textinputlayout

Вопрос:

И мой второй вопрос : я использую TextInputLayout :

 <com.google.android.material.textfield.TextInputLayout              
  style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColorHint="@color/LightBlue"              
 android:theme="@style/ThemeOverlay.AppTheme.TextInputEditText.Outlined"
                app:boxStrokeColor="@color/selector"
                app:boxStrokeWidth="3dp"
                app:startIconTint="@color/white">

                <com.google.android.material.textfield.TextInputEditText
                    android:id="@ id/numberOfPlayer_txt"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:focusable="true"
                    android:focusableInTouchMode="true"
                    android:inputType="numberDecimal"
                    android:textColor="@color/gold" />

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

Файл стилей

  <style name="AppTheme" 
  parent="Theme.MaterialComponents.Light.NoActionBar.Bridge">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>

        <item name="android:windowBackground">@color/Thistle</item>
                   <!-- use in get player information -->
       <item name="CustomTextStyle">@style/Widget.App. TextInputLayout. 
       OutlinedBox</item>
  </style>


    <style name="ThemeOverlay.AppTheme.TextInputEditText.Outlined" 
     parent="">
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="boxCornerRadiusBottomEnd">20dp</item>
        <item name="boxCornerRadiusBottomStart">20dp</item>
        <item name="boxCornerRadiusTopEnd">20dp</item>
        <item name="boxCornerRadiusTopStart">20dp</item>
        <item name="android:hint">Number of player</item>
        <item name="hintTextColor">@color/card1</item>
        <item name="startIconDrawable">@drawable/ic_people</item>
    </style>

    <style name="Widget.App.TextInputLayout.OutlinedBox" 
    parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
        <item name="boxStrokeColor">@color/player_information</item>
        <item name="boxCornerRadiusBottomEnd">15dp</item>
        <item name="boxCornerRadiusBottomStart">15dp</item>
        <item name="boxCornerRadiusTopEnd">15dp</item>
        <item name="boxCornerRadiusTopStart">15dp</item>
        <item name="android:textColorHint">@color/white</item>
        <item name="startIconDrawable">@drawable/player</item>
        <item name="startIconTint">@color/gold</item>
        <item name="elevation">5dp</item>
        <item name="boxStrokeWidth">2dp</item>
        <itemname="materialThemeOverlay">@style/ThemeOverlay.App. 
         TextInputEditText.OutlinedBox</item>
        <item name="hintTextColor">@color/AntiqueWhite</item>
        <!-- .... -->
    </style>

    <style name="ThemeOverlay.App.TextInputEditText.OutlinedBox"  
    
   parent="ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox">
        <!-- to change the cursor color -->
        <item name="colorControlActivated">@color/white</item>
    </style>
 

Это мой файл селектора

 <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/DarkSeaGreen" 
    android:state_focused="true"/>
    <item android:color="@color/white"/>
    </selector>
 

и Attrs

  <resources>
   <attr name="customTextInputStyle" format="reference" />
   <attr name="CustomTextStyle" formet ="reference"/>
   </resources>
 

Когда я изменяю версию материала 1.1.0 на 1.3.0 ,форма макета ввода текста 1, который я создал ранее, искажается. Она стала шире, чем была раньше. Я не мог найти причину этой перемены.Как вы можете видеть на рисунке, ввод текста очень широк, а текст на обратной стороне по-прежнему выглядит черным.

введите описание изображения здесь

Ответ №1:

Главная проблема заключается в том, что тема закрыта. Вы должны добавить родителя ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox .

 <style name="ThemeOverlay.App.TextInputEditText.OutlinedBox" parent="@style/ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox">
    <item name="colorPrimary">@color/...</item>
</style>
 

Это необходимо, потому что стиль по умолчанию Widget.MaterialComponents.TextInputLayout.OutlinedBox , который вы расширяете, определил собственный materialThemeOverlay , и
без родительской зависимости вы теряете поведение по умолчанию.

Также в вашем xml-макете удалите android:theme="@style/ThemeOverlay.AppTheme.TextInputEditText.Outlined" . Вам это не нужно, потому что вы уже используете materialThemeOverlay стиль, а тема, определенная в xml-макете, переопределяет его, и это наложение темы неверно.

Также:

  • используйте минимальную ширину, потому что вы используете большой радиус угла 15dp
         <com.google.android.material.textfield.TextInputLayout
            android:minWidth="150dp"
            android:layout_width="wrap_content"
 
  • Наконец, цвет, используемый подсказкой:
         <item name="android:textColorHint">@color/red600Dark</item>
        <item name="hintTextColor">@color/teal_700</item>
 

введите описание изображения здесь
введите описание изображения здесь
введите описание изображения здесь

Окончательный макет:

    <com.google.android.material.textfield.TextInputLayout              
      style="@style/Widget.App.TextInputLayout.OutlinedBox"
            android:minWidth="150dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:startIconTint="@color/white">

                <com.google.android.material.textfield.TextInputEditText
                    android:id="@ id/numberOfPlayer_txt"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:inputType="numberDecimal"
                    android:textColor="@color/gold" />

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

с:

 <style name="Widget.App.TextInputLayout.OutlinedBox"
    parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
    <item name="boxStrokeColor">@color/text_input_stroke_selector</item>
    <item name="boxCornerRadiusBottomEnd">15dp</item>
    <item name="boxCornerRadiusBottomStart">15dp</item>
    <item name="boxCornerRadiusTopEnd">15dp</item>
    <item name="boxCornerRadiusTopStart">15dp</item>
    <item name="startIconDrawable">@drawable/ic_...</item>
    <item name="startIconTint">@color/...</item>
    <item name="elevation">5dp</item>
    <item name="boxStrokeWidth">2dp</item>
    <item name="materialThemeOverlay">@style/ThemeOverlay.App.TextInputEditText.OutlinedBox</item>
    <item name="android:textColorHint">@color/....</item>
    <item name="hintTextColor">@color/....</item>
</style>

<style name="ThemeOverlay.App.TextInputEditText.OutlinedBox" parent="@style/ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox">
    <item name="colorPrimary">@color/....</item>
</style>
 

Комментарии:

1. Я добавил картинку к проблеме

2. Мне просто нужно сделать <style name="ThemeOverlay.AppTheme.TextInputEditText.Outlined" parent="ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox"> , я прав ?

3. @Neo Да. Удалить android:theme="@style/ThemeOverlay.AppTheme.TextInputEditText.Outlined" в xml-макете. Вам это не нужно, и это неправильно. Обратите внимание wrapContent , потому что с огромным радиусом угла поле может быть выше.

4. Почему мне нужно добавить <item name="materialThemeOverlay"> @style/ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox </item> что-то внутрь <style name="ThemeOverlay.App.TextInputEditText.OutlinedBox" parent="@style/ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox"> <item name="colorPrimary">@color/...</item> </style> ?

5. Большое вам спасибо 🙂