如何在Android中制作无阴影的彩色按钮

时间:2018-07-10 11:17:17

标签: android button themes borderless

我一直在尝试通过样式来实现此目的的各种方法,但无法获得我想要的。看来我可以有一个带阴影的彩色按钮,也可以有一个无阴影的按钮,只能更改文本和按下的颜色。

这是我的styles.xml中的内容:

<style name="PrimaryFlatButton"  parent="Theme.AppCompat.Light">
    <item name="colorControlHighlight">@color/colorPrimary</item>
    <item name="colorButtonNormal">@color/colorPrimaryLight</item>
</style>

这是我的布局中的内容:

<Button
    android:id="@+id/btn_search"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/pc_large_padding"
    android:theme="@style/PrimaryFlatButton"
    style="@style/Widget.AppCompat.Button"
    android:text="Search"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintRight_toRightOf="parent"/>

哪个给了我一个彩色按钮,当按下按钮时该按钮变暗但有阴影。

如果我将按钮更改为具有以下样式:

style="@style/Widget.AppCompat.Button.Borderless"

然后,我成功失去了阴影,但是除非按下该按钮,否则没有背景色。我认为Android的“无边界”概念意味着根本没有任何东西可以指示边框-只是纯文本-而不是平面按钮。

我想要的是标准主题按钮,具有背景色,按下该按钮时颜色会更改,并且没有阴影。

2 个答案:

答案 0 :(得分:0)

通过创建selector可绘制对象并将其指定为按钮的背景,您应该能够获得带有波纹效果的彩色按钮。像这样:

some_layout.xml

<Button
   style="@style/Theme.Flat.Button"
   <!-- Any other properties you want to set -->
   />

style.xml

<style name="Theme.Flat.Button" parent="@style/Widget.AppCompat.Button.Borderless">
    <item name="android:background">@drawable/ripple_selector</item>
    <!-- Any other items you want to add -->
</style>

ripple_selector.xml

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@color/colorPrimary">
    <item>
        <selector>
            <item android:state_enabled="false">
                <color android:color="@color/colorPrimaryLight" />
            </item>
            <item android:state_enabled="true" android:state_pressed="false">
                <color android:color="@color/colorPrimaryLight" />
            </item>
            <item android:state_enabled="true" android:state_pressed="true">
                <color android:color="@color/colorPrimary" />
            </item>
        </selector>
    </item>
</ripple>

答案 1 :(得分:0)

您可以通过在按钮的XML属性中添加android:stateListAnimator="@null"来删除高程/阴影。

全按钮XML:

<Button
    android:id="@+id/btn_search"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/pc_large_padding"
    android:theme="@style/PrimaryFlatButton"
    style="@style/Widget.AppCompat.Button"
    android:text="Search"
    android:stateListAnimator="@null"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintRight_toRightOf="parent"/>

您也可以将此行放入styles.xml中,以避免将其添加到您的每个按钮中

styles.xml:

<style name="PrimaryFlatButton"  parent="Theme.AppCompat.Light">
    <item name="colorControlHighlight">@color/colorPrimary</item>
    <item name="colorButtonNormal">@color/colorPrimaryLight</item>
    <item name="android:stateListAnimator">@null</item>
</style>

迈克尔的答案在技术上也是正确的。如果您想对按钮的样式和状态(包括高程/阴影)进行更精细的控制,可以考虑为按钮创建自己的StateListDrawable资源。由于您似乎只想对默认按钮样式进行少量修改就感兴趣,因此在此我将不进一步讨论StateListDrawables。但是,如果您有兴趣,可以阅读Michael的答案以及StateListDrawable文档here