Android Material Component 全局样式，用于 Material Button、Material Text Button 和 Material OutlinedButton

Posted 2023-02-22

【中文标题】Android Material Component 全局样式，用于 Material Button、Material Text Button 和 Material OutlinedButton

【英文标题】：Android Material Component global style for Material Button, Material Text Button and Material OutlinedButton

【发布时间】：2020-08-15 23:03:16

【问题描述】：

目前我正在使用com.google.android.material:material:1.1.0 库。

我创建了 Base Theme 并添加了 Material Button 全局样式，例如：<item name="materialButtonStyle">@style/Material.BaseAppTheme.Button</item>。它适用于所有默认按钮。现在的问题是我想要 Material Text Button 和 Material Outlined Button 的特定样式。但是即使我在属性中添加特定样式，默认样式也会覆盖特定样式。 喜欢这个：

 <Button
    style="@style/Widget.MaterialComponents.Button.TextButton" 
    ...> 

仍然显示为默认按钮。所以我必须删除 Base Theme 中的全局按钮样式，并在每个 中添加样式。我不知道这是为不同类型的材质按钮应用样式的唯一方法。或者我错过了一些东西。 这是我的主题和样式代码

基础主题

BaseTheme.Button 和 TextAppearance 样式

<style name="TextAppearance.Base.Button" parent="TextAppearance.MaterialComponents.Button">
    <item name="android:fontFamily">@string/font_family_regular</item>
    <item name="fontFamily">@string/font_family_regular</item>
    <item name="android:textColor">?buttonTextColorPrimary</item>
    <item name="android:textStyle">normal</item>
    <item name="android:textSize">@dimen/_10sp</item>
    <item name="android:textAllCaps">false</item>
</style>


<style name="Material.BaseAppTheme.Button" parent="Widget.MaterialComponents.Button">
    <item name="android:paddingLeft">@dimen/_8dp</item>
    <item name="android:paddingRight">@dimen/_8dp</item>
    <item name="android:background">?buttonColorEnabled</item>
</style>

XML 中的按钮

              <Button
                    style="@style/Widget.MaterialComponents.Button.TextButton"
                    android:id="@+id/tv_footer_cta_left"
                    android:layout_
                    android:layout_
                    android:layout_alignParentStart="true"
                    android:textAllCaps="true"
                    android:text="@viewModel.footerLeftTitle"
                    app:invisibility="@viewModel.footerLeftCTAVisibility"
                    app:onSingleClick="@() -> viewModel.navigateTo(viewModel.footerLeftCTAUri)"
                    tools:text="MANAGE ACCOUNT" />

                <Button
                    android:id="@+id/tv_footer_cta_right"
                    android:layout_
                    android:layout_
                    android:layout_alignParentEnd="true"
                    android:text="@viewModel.footerRightTitle"
                    android:textAllCaps="true"
                    app:invisibility="@viewModel.footerRightCTAVisibility"
                    app:onSingleClick="@() -> viewModel.navigateTo(viewModel.footerRightCTAUri)"
                    tools:text="MANAGE ACCOUNT" />

当前结果

** 预期结果**

【问题讨论】：

我还尝试了 Material.IO material.io/develop/android/components/buttons/#theming-buttons 推荐的主题。通过定义不同的主题覆盖解决了不覆盖但现在在未应用主题覆盖中设置 textApppearence 的问题。

您的代码似乎是正确的（但使用backgroundTint 而不是android:background）。你在用tv_footer_cta_left.setChecked(true)的东西吗？

@GabrieleMariotti 我已经尝试过风格和按钮的背景色，但没有成功。不，我没有使用 .setChecked(true/false)

【参考方案1】：

我认为您在理解材料主题方面需要一些帮助。 首先将您的应用程序主题更改为材质主题将自动为项目中的所有按钮设置主题（无需做任何额外的事情）。 二、可以使用

 style="@style/Widget.MaterialComponents.Button.TextButton"

在您的按钮代码中使您的按钮纯文本按钮与预期结果一样。

您可以在此处阅读此材料设计文档：material.io

文档会真正帮助你，相信我。

【讨论】：

请再次阅读我的问题并检查代码，我已经尝试过您所说的。不过，它没有显示 textButton。我不知道这是材料设计或其他方面的错误。

你试过使用最新版本的材料设计吗？