Android 材料设计按钮 - Pre lollipop

Posted 2023-02-22

【中文标题】Android 材料设计按钮 - Pre lollipop

【英文标题】：Android material design buttons - Pre lollipop

【发布时间】：2015-01-04 10:58:58

【问题描述】：

如何实现谷歌材料设计指南中描述的“凸起按钮”和“平面按钮”？

---

凸起的按钮为大多数平面布局增加了维度。他们强调 > 适用于繁忙或宽敞的空间。

---

为工具栏和对话框使用平面按钮以避免过度分层。

来源：http://www.google.com/design/spec/components/buttons.html

【问题讨论】：

最佳解决方案***.com/questions/1521640/…

***.com/questions/26346727/…的可能重复

也许这应该是重复的（我不清楚）。但是这个接近的原因是错误的。

【参考方案1】：

这需要 android 5.0

凸起按钮

从 Widget.Material.Button 继承您的按钮样式，将自动应用标准的升降动作。

<style name="Your.Button" parent="android:style/Widget.Material.Button">
    <item name="android:background">@drawable/raised_button_background</item>
</style>

然后您需要创建一个raised_button_background.xml 文件，其中您的按钮的背景颜色包含在波纹标签内：

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?attr/colorControlHighlight">
    <item android:drawable="@color/button_color"/>
</ripple>

扁平按钮

编辑：而不是我之前对平面按钮的建议，您应该遵循以下 Stephen Kaiser 给出的建议：

<Button
    android:layout_
    android:layout_
    android:text="DONE"
    style="?android:attr/borderlessButtonStyle"
/>

编辑：如果您使用支持库，您可以使用style="?attr/borderlessButtonStyle" 在 Pre-Lollipop 设备上获得相同的结果。 （注意没有android:）上面的例子就变成了

<Button
    android:layout_
    android:layout_
    android:text="DONE"
    style="?attr/borderlessButtonStyle"
/>

【讨论】：

谢谢你，很抱歉这个迟到的答案。有没有办法通过支持库实现相同的结果？我从 Theme.AppCompat.Light.DarkActionBar 继承了我的主题，在 Android Studio 中我可以看到凸起但我想要，但是当我在手机上运行应用程序（api 17）时，我看到了通常的按钮

有什么方法可以让凸起的按钮样式在棒棒糖之前起作用？甚至是假的风格？

禁用/启用状态看起来相同。如何解决这个问题？

为什么在使用材料设计时，扁平（无边框）按钮不拉强调色样式？使用 buttonBarButtonStyle 更好吗？

@lostintranslation 因为在 AppCompat 基本主题中，borderlessButtonStyle 设置为 @style/Widget.AppCompat.Button.Borderless。如果您希望它拉出强调色，请将主题中的borderlessButtonStyle 设置为@style/Widget.AppCompat.Button.Borderless.Colored。

【参考方案2】：

我使用它作为 AppCompat 按钮的背景，它描绘了一个凸起的按钮（全部带有波纹），希望对您有所帮助。

myRaisedButton.xml - 在drawable 文件夹内：

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android"
               android:shape="rectangle">
            <solid android:color="@color/yourColor"/>
            <corners android:radius="6dp"/>
        </shape>
    </item>
    <item android:drawable="?android:selectableItemBackground"/>
</layer-list>

styles.xml：

<resources>

    <style name="AppTheme" parent="AppTheme.Base"/>
    <style name="AppTheme.Base" parent="Theme.AppCompat">

</resources>

styles.xml (v21)：

...
<style name="AppTheme" parent="AppTheme.Base">

layout.xml：

...
android:background="@drawable/myRaisedButton"

【讨论】：

你在哪里使用这个xml？在drawable文件夹中？

是的，例如将其命名为 myRaisedButton.xml 并使用 android:background="@drawable/myRaisedButton" 从您的布局中访问它

谢谢，它有效！由于出现异常，我不得不删除最后一行，我该如何解决？抱歉，我在使用 xml 中的样式时仍然遇到问题

为什么要让styles.xml 文件都指向同一个样式（“AppTheme.Base”）？我在这里没有看到添加的功能...

此代码生成异常，不会创建凸起按钮。

【参考方案3】：

你要求 材料设计按钮库 - 你知道了 - https://github.com/navasmdc/MaterialDesignLibrary

【参考方案4】：

您可以使用MaterialDesignLibrary。是第三方库。

这是一个包含 Android L 组件的库，供您在 android 2.2 中使用 如果你想使用这个库，你只需要下载 MaterialDesign 项目，将它导入你的工作空间，然后在你的 android 项目设置中将项目添加为库。

【参考方案5】：

我正在开发一个材料兼容性库。按钮类在那里并支持动画阴影和触摸波纹。也许你会发现它很有用。这是link。

【讨论】：

伙计，这太棒了。如何通过 gradle 包含你的 aar 库？

我想知道，在现实生活中使用它有多稳定？您是否有任何与按钮相关的崩溃：阴影/涟漪？谢谢

我正在实际项目中对其进行测试，并尽我所能使其发挥作用。该库正在大力开发中，我正在尝试在 24 小时内修复所有报告的错误。在大多数情况下，库不会崩溃，而是会产生动画故障或只是滞后。目前最大的两个问题是 1. 缺少渲染线程（在 Lollipop 中引入）和 2. 与所有 GPU 和 UI 的兼容性（例如 Galaxy 系列中使用的 TouchWiz）。如果您有任何其他问题，您想询问功能或报告错误，请随时与我联系。我刚刚更新了我博客上的“关于”页面以使其更容易。

【参考方案6】：

有关如何使用 appcompat 库执行此操作的说明，请查看我对另一个问题的回答：https://***.com/a/27696134/1932522

这将展示如何在 Android 5.0 和更早版本（最高 API 级别 11）中使用凸起和扁平按钮！

【讨论】：

style="?android:attr/borderlessButtonStyle" 不是 appCompat 样式。您的回答仅对 API > 11 有效

【参考方案7】：

您可能还需要为按钮添加底部边距，以便能够看到凸起的按钮阴影效果：

<item name="android:layout_marginBottom">@dimen/activity_vertical_margin</item>
<item name="android:elevation">1dp</item>

【参考方案8】：

为了实现平面按钮，您只需添加style="?android:attr/borderlessButtonStyle"。

例子：

<Button
    android:layout_
    android:layout_
    android:text="DONE"
    style="?android:attr/borderlessButtonStyle"
    />

Here's the reference 用于属性。

【讨论】：

太棒了，它支持回到 API 级别 11。

@StephenKaiser 凸起的按钮怎么样？

style="@style/Widget.AppCompat.Button.Borderless" 使用 AppCompat 库时