【问题标题】:MaterialComponents.TextInputLayout.OutlinedBox it doesn't work properly boxBackgroundColorMaterialComponents.TextInputLayout.OutlinedBox 它不能正常工作 boxBackgroundColor
【发布时间】:2020-07-08 22:57:12
【问题描述】:

我使用材料。我将为 TextInputLayout 使用一种颜色作为背景,但类似于下面的颜色!提示背景未更改。我使用了样式并想进行更改,但没有用。在布局本身中,我尝试再次应用更改!如何解决这个问题?

注意

图片中label username的背景不是透明,它覆盖一些TextInputEditText

build.gradle

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

风格

 <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="textAppearanceSubtitle1">@style/TextAppearance.App.Subtitle1</item>
        <item name="textAppearanceCaption">@style/TextAppearance.App.Caption</item>
        <item name="shapeAppearanceSmallComponent">@style/ShapeAppearance.App.SmallComponent</item>
    </style>

    <style name="AppTheme.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>

    <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.MaterialComponents.Dark.ActionBar"/>

    <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.MaterialComponents.Light"/>


    <style name="TextAppearance.App.Subtitle1" parent="TextAppearance.MaterialComponents.Subtitle1">
        <item name="colorControlActivated">@color/white</item>
        <item name="android:colorControlActivated">@color/white</item>
    </style>

    <style name="TextAppearance.App.Caption" parent="TextAppearance.MaterialComponents.Caption">
        <item name="android:textColorTertiary">@color/white</item>
        <item name="android:textColorTertiaryInverse">@color/white</item>
        <item name="colorControlActivated">@color/white</item>
        <item name="android:colorControlActivated">@color/white</item>
    </style>

    <style name="ShapeAppearance.App.SmallComponent" parent="ShapeAppearance.MaterialComponents.SmallComponent">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSize">16dp</item>
        <item name="colorControlActivated">@color/white</item>
        <item name="android:colorControlActivated">@color/white</item>
    </style>

布局中

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:background="@color/gray"
  android:gravity="center"
  android:orientation="vertical"
  android:padding="32dp">

  <com.google.android.material.textfield.TextInputLayout
    android:id="@+id/linUsername"
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="16dp"
    android:hint="@string/label_username"
    android:textColorHint="#AEB0C6"
    app:boxBackgroundColor="#33385E"
    app:boxStrokeColor="@color/red"
    app:endIconDrawable="@drawable/ic_clear_white_24dp"
    app:endIconMode="password_toggle"
    app:endIconTint="#AEB0C6"
    app:hintTextColor="#AEB0C6"
    app:startIconDrawable="@drawable/ic_info_outline_white_24dp"
    app:startIconTint="#AEB0C6">

    <com.google.android.material.textfield.TextInputEditText
      android:id="@+id/edtUsername"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:inputType="textPersonName"
      android:textColor="@color/white"
      android:textColorHint="@color/white"
      app:hintTextColor="#AEB0C6" />

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


  <com.google.android.material.button.MaterialButton
    android:id="@+id/btnSelectText"
    android:layout_width="168dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="24dp"
    android:fontFamily="@font/iran_sans_mobile"
    android:text="login"
    android:visibility="visible"
    app:cornerRadius="@dimen/radiusButton" />
</LinearLayout>

【问题讨论】:

  • 谢谢。我也很高兴见到你@MohammadMoeinGolchin
  • 你哥哥在马什哈德工作?!
  • 不,他们来自我的远房亲戚,(兄弟小姐,我的堂兄:))@MohammadMoeinGolchin
  • 我不明白你的问题是什么。你不能显示“用户名”?
  • 看图,如果看用户名背景,背面颜色有问题,背面一定是透明的@MohammadMoeinGolchin

标签: android material-design android-textinputlayout android-textinputedittext


【解决方案1】:

如果你不喜欢使用自定义编辑文本,你可以这样修改你的代码:

activity_main.xml

 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical"
    android:padding="32dp">

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/linUsername"
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="username"
        android:textColorHint="#ED0A0A"
        app:boxBackgroundColor="#1A33385E"
        app:endIconMode="password_toggle"
        app:endIconTint="#AEB0C6">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/edtUsername"
            android:background="@drawable/boarder"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="textPersonName"
            android:textColor="#fff"
            android:text="User"
            android:textColorHint="#fff"
            app:hintTextColor="#AEB0C6" />

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


    <com.google.android.material.button.MaterialButton
        android:id="@+id/btnSelectText"
        android:layout_width="168dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="24dp"
        android:text="login"
        android:visibility="visible"
        app:cornerRadius="10dp" />
</LinearLayout>

在 boarder.xml 中

   <?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#8033385E"/>
    <corners android:radius="12dp" />
</shape>

输出将是:

【讨论】:

  • 非常感谢我以前尝试过这种方式。问题是它必须与 TextInputLayout 中的颜色相同。这不是解决方案。它看起来像 com.google.android.material.textfield.TextInputLayout 的错误
  • 我认为有可能。您可以为 textinputlayer 定义一个 wrap-content 层。然后你可以为它设置背景。正如你所说,也许这个组件有错误。@abolfazl bazghandi
  • 非常感谢您的跟进。绝对是一个错误。如果我按照你说的方式尝试,边距会很好,而且不漂亮。
  • 你的意思是它的寄宿生?你不能为其布局设置边界?@abolfazlbazghandi
  • 是边界,那不好。我不认为它会,检查火箭聊天:)
【解决方案2】:

您可以使用带边框的自定义编辑文本,这样您就可以轻松设置所需的背景。例如试试这个代码: activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical"
    android:padding="32dp">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="60dp">

        <EditText
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="15dp"
            android:background="@drawable/boarder"
            android:paddingLeft="5dp"
            android:text="input"
            app:endIconMode="password_toggle"
            app:endIconTint="#EF0707" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="7dp"
            android:background="#fff"
            android:text="Label" />
    </RelativeLayout>

    <com.google.android.material.button.MaterialButton
        android:id="@+id/btnSelectText"
        android:layout_width="168dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="24dp"
        android:text="login"
        android:visibility="visible"
        app:cornerRadius="10dp" />
</LinearLayout>

寄宿生.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <stroke
        android:width="2dp"
        android:color="#03A6F0" />

    <corners android:radius="12dp" />
</shape>

另见此处:Custom edit text with borders

【讨论】:

  • 非常感谢,但是如果您使用 MaterialComponents.TextInputLayout.OutlinedBox,它确实会使动画消失,您会注意到它的动画(以及许多其他东西,例如它的图标)。我想使用 MaterialComponents.TextInputLayout.OutlinedBox.
  • 嗨@abolfazl bazghandi,欢迎您,我用风格给出另一个答案
猜你喜欢
  • 2022-10-15
  • 2017-08-11
  • 1970-01-01
  • 2019-01-14
  • 1970-01-01
  • 2013-03-30
  • 2010-11-30
  • 2021-10-02
  • 2017-08-06
相关资源
最近更新 更多