如何在材料设计按钮中删除额外的填充或边距？

Question

我正在尝试创建一个按钮,该按钮连接到按钮上方的TextView,如下图所示.

上面的截图来自Note 4,操作系统版本是5.0.1.

下面是用于实现UI的代码.

布局/ xyz.xml

    <Button
    android:layout_width="250dp"
    android:layout_height="50dp"
    android:theme="@style/myButton"
    android:text="Cancel"/>

值-V21/style.xml

    <style name="myButton" parent="@style/Base.Widget.AppCompat.Button">
    <item name="android:colorButtonNormal">#3578A9</item>
    <item name="android:inset">0dp</item>
    </style>

但是如果我在Nexus4 OS verison 5.1.1中运行相同的代码,则该按钮会占用所有4个边的边距,屏幕截图如下所示.

如果我删除"android:theme"并提供"android:background",则UI看起来像第一个图像.但它不会产生连锁反应.那么如何通过涟漪效应实现UI作为第一个图像.

Answer 1

机器人：插入底部=“0dp”

<com.google.android.material.button.MaterialButton
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        android:text="Edit"
        app:cornerRadius="0dp"
        android:insetBottom="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

Answer 2

第1步:将以下代码放在styles.xml中

    <style name="myColoredButton">
        <item name="android:textColor">#FF3E96</item>
        <item name="android:padding">0dp</item>
        <item name="android:minWidth">88dp</item>
        <item name="android:minHeight">36dp</item>
        <item name="android:elevation">1dp</item>
        <item name="android:translationZ">1dp</item>
        <item name="android:background">#FF0000</item>
    </style>

在这里你可以更改textColor(我上面使用了#FF3E96)和背景颜色(我使用了#FF0000)作为你的按钮.您还可以使用按钮覆盖与Button相关的布局xml中的textColor值android:colorButtonNormal.

步骤2:在drawables文件夹下创建一个新的XML文件并添加以下代码:我将我的XML文件命名为primary.xml

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@color/colorPrimary">
    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android">
            <corners android:radius="1dp" />
            <solid android:color="#8B8386" />
        </shape>
    </item>
</ripple>

第3步:使用Button中的样式和drawable,如下所示.

    <Button
        style="@style/myColoredButton"
        android:layout_width="250dp"
        android:layout_height="50dp"
        android:text="Cancel"
        android:gravity="center"
        android:background="@drawable/primary_round"
        android:colorButtonNormal="#3578A9" />

希望它能解决你的问题.