如何使这个Android材质看起来不错?

时间:2019-07-24 12:17:01

标签: java android android-studio material-design

我只想微调和调整此样式..有没有人知道我该怎么做?我正在使用implementation 'com.google.android.material:material:1.1.0-alpha08'

enter image description here

  • 我想将灰色的“衬垫”准确地放在框下
  • 我希望能够更改边框的颜色(聚焦或不聚焦)
  • 如果可能的话,我想更改提示颜色,上位标签颜色和文本键入的颜色

这是我的代码:

    <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>

3 个答案:

答案 0 :(得分:1)

  

为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>

答案 1 :(得分:0)

尝试将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"/>

答案 2 :(得分:0)

使用下面的方法删除TextInputLayout的背景

android:background="@null"