如何让这个 android 材质看起来不错？答案

【问题标题】：how do I make this android material look nice?如何让这个 android 材质看起来不错？
【发布时间】：2019-12-02 14:20:38
【问题描述】：

我只想稍微微调和调整这种风格.. 有人知道我应该怎么做吗？我正在使用implementation 'com.google.android.material:material:1.1.0-alpha08'

我想把灰色的“底层”正好放在盒子下面
我希望能够更改边框的颜色（聚焦或不聚焦）
如果可能，我想更改提示颜色、叠加标签颜色和文本类型颜色

这是我的代码：

    <ScrollView android:layout_width="fill_parent"
        android:layout_height="wrap_content">

        <LinearLayout android:layout_width="fill_parent"
            android:layout_height="fill_parent" android:orientation="vertical">

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

                <com.google.android.material.textfield.TextInputEditText
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:hint="This is a Hint"/>

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

        </LinearLayout>
  </ScrollView>

那么我们有res\values\styles.xml

 <resources>
    <style name="TextTheme" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
        <item name="colorPrimary">#212121</item>
        <item name="colorPrimaryVariant">#000000</item>
        <item name="colorOnPrimary">#FFFFFF</item>
        <item name="colorSecondary">#2962FF</item>
        <item name="colorSecondaryVariant">#0039CB</item>
        <item name="colorOnSecondary">#FFFFFF</item>
        <item name="colorError">#F44336</item>
        <item name="colorOnError">#FFFFFF</item>
        <item name="colorSurface">#FFFFFF</item>
        <item name="colorOnSurface">#212121</item>
        <item name="colorOnBackground">#212121</item>
        <item name="android:background">@drawable/nice_text</item>
    </style>
</resources>

终于在res\drawable\nice_text.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:top="5dp" android:bottom="5dp">
        <shape
            android:shape="rectangle">
            <padding android:top="5dp"/>
            <stroke android:width="1dp" android:color="#4c5a67" />
            <solid android:color="#4c5a67" />

        </shape>
    </item>

    <item android:top="4dp" android:bottom="4dp">
        <shape
            android:shape="rectangle">
            <stroke android:width="1dp" android:color="#4c5a67" />
            <solid android:color="#4c5a67" />
        </shape>
    </item>

</layer-list>

【问题讨论】：

fill_parent 已经不是 2008 年了，使用 match_parent

标签： java android android-studio material-design

【解决方案1】：

使用下面删除TextInputLayout的背景

android:background="@null"

【讨论】：

【解决方案2】：

尝试将 paddingTop 赋予 TextInputEditText 与 layerlist 项的 top 属性相同，在您的情况下为 5dp 所以，代码会是这样的

 <com.google.android.material.textfield.TextInputEditText
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:paddingTop="5dp"
                    android:hint="This is a Hint"/>

【讨论】：

【解决方案3】：

为 TextInputLayout 提供更小的自定义。只需使用 FilledBox 样式

我认为这种风格会以某种方式帮助您：

 <com.google.android.material.textfield.TextInputLayout
    style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox"
    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" />
</com.google.android.material.textfield.TextInputLayout>

【讨论】：