【问题标题】:MaterialComponents theme alert dialog buttonsMaterialComponents 主题警报对话框按钮
【发布时间】:2019-03-20 15:52:53
【问题描述】:

最近我从支持库切换到 com.google.android.material:material:1.0.0

但现在我有一个问题,在这个页面中有一个注释https://github.com/material-components/material-components-android/blob/master/docs/getting-started.md

注意:使用 Material Components 主题可以启用自定义视图充气器,它将默认组件替换为对应的 Material 组件。目前,这只会将 Button XML 组件替换为 MaterialButton。

以及我正在使用的主题

Theme.MaterialComponents.Light.NoActionBar

完全按照它在该注释中所说的那样,它将 AlertDialog 按钮替换为 MaterialButtons,但问题是默认情况下 MaterialButtons 是彩色背景,现在按钮看起来像这样:

我怎样才能让它们再次无边框和无背景?

PS 我正在使用警报生成器来创建警报对话框:

android.app.AlertDialog.Builder

【问题讨论】:

  • 如果你想要 AppCompat 主题内容和一些新的 Material UI 样式,你可以使用 Bridge 主题,它可以解决你的问题,参考我的这个答案:stackoverflow.com/a/52401497/10271334

标签: android material-design android-alertdialog android-styles material-components-android


【解决方案1】:

我知道是什么导致了这个问题。我需要使用不同的 AlertDialog 类:

androidx.appcompat.app.AlertDialog

当我切换到这个时,一切都开始按预期工作。这是我找到解决方案的地方:

https://github.com/material-components/material-components-android/issues/162

【讨论】:

  • 我使用 Android Studio 的“迁移到 AndroidX”选项/功能将我的代码迁移到了 androidx,但是这个库没有自动更新到 AndroidX。当我按照答案建议手动更新导入时,我的这个问题得到了解决
  • 你救我!谢谢!
  • 并非所有英雄都穿斗篷!
  • 午夜前非常感谢您。你救了我一个小时的睡眠。
【解决方案2】:

使用com.google.android.material:material:1.0.0androidx.appcompat.app.AlertDialog 时,您可以使用Widget.MaterialComponents.Button.TextButton 作为父级自定义buttonBar 中的每个按钮。

val builder: AlertDialog.Builder = AlertDialog.Builder(ContextThemeWrapper(context, R.style.AlertDialogTheme))

使用默认布局或通过builder.setView(R.layout.my_dialog)添加自定义

按照你的风格:

<style name="AlertDialogTheme" parent="Theme.MaterialComponents.Light.Dialog.Alert">
    <item name="buttonBarPositiveButtonStyle">@style/Alert.Button.Positive</item>
    <item name="buttonBarNegativeButtonStyle">@style/Alert.Button.Neutral</item>
    <item name="buttonBarNeutralButtonStyle">@style/Alert.Button.Neutral</item>
</style>

<style name="Alert.Button.Positive" parent="Widget.MaterialComponents.Button.TextButton">
    <item name="backgroundTint">@color/transparent</item>
    <item name="rippleColor">@color/colorAccent</item>
    <item name="android:textColor">@color/colorPrimary</item>
    <item name="android:textSize">14sp</item>
    <item name="android:textAllCaps">false</item>
</style>

<style name="Alert.Button.Neutral" parent="Widget.MaterialComponents.Button.TextButton">
    <item name="backgroundTint">@color/transparent</item>
    <item name="rippleColor">@color/colorAccent</item>
    <item name="android:textColor">@color/gray_dark</item>
    <item name="android:textSize">14sp</item>
</style>

【讨论】:

  • 这是我在尝试设置对话框样式时所寻找的。我找到的所有答案都没有使用 AndroidX。
  • 我只是不确定您为什么将 textAllCaps 设置为 false。我通常会在对话框中看到它设置为 true(唯一的例外是来自谷歌的名为 Crane 的 Material Design 示例)
  • @LeonardoSibela 是的,默认行为将所有按钮设置为 textAllCaps=true,已更新
  • 我希望我能投票 50 次。我花了大约两个小时试图为愚蠢的对话框着色。请注意,您还应该改用MaterialAlertDialogBuilder
  • @gMale 的评论为我节省了时间。
【解决方案3】:

如果您使用的是 Material Components 库,获得AlertDialog 的最佳方法是使用MaterialAlertDialogBuilder

new MaterialAlertDialogBuilder(context)
            .setTitle("Dialog")
            .setMessage("Lorem ipsum dolor ....")
            .setPositiveButton("Ok", /* listener = */ null)
            .setNegativeButton("Cancel", /* listener = */ null)
            .show();

这是默认结果:

如果您还想为按钮应用不同的样式或颜色,可以查看answer

【讨论】:

  • MaterialAlertDialogBuilder 替换AlertDialog.Builder 不会改变按钮的颜色。请参阅下面的答案以更改 theme
  • @CoolMind 问题不是如何改变按钮颜色。
【解决方案4】:

我测试了上述答案。尽管我有一个好主意,但没有一个适合我的情况。所以,这就是我的答案。

  1. 确保在应用程序或活动下的清单文件中包含android:theme="@style/AppMaterialTheme"

  2. 打开您的 Styles.xml 文件并根据以下内容进行更改。

    <style name="AppMaterialTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
        <item name="colorPrimary">@color/primaryBlue</item>
        <item name="colorPrimaryDark">@color/primaryBlue</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="colorControlActivated">@color/primaryBlue</item>
        <item name="colorControlHighlight">@color/colorAccent_main</item>
        <item name="colorButtonNormal">@color/white</item>
    
        <item name="materialAlertDialogTheme">@style/AlertDialogMaterialTheme</item>
    </style>
    
    <style name="AlertDialogMaterialTheme" parent="ThemeOverlay.MaterialComponents.MaterialAlertDialog">
        <item name="buttonBarPositiveButtonStyle">@style/Alert.Button.Positive</item>
        <item name="buttonBarNegativeButtonStyle">@style/Alert.Button.Negative</item>
    </style>
    
    <style name="Alert.Button.Positive" parent="Widget.MaterialComponents.Button.UnelevatedButton">
        <item name="android:fillColor">@color/color_0054BB</item>
        <item name="android:textColor">@color/white</item>
        <item name="android:textAllCaps">false</item>
        <item name="android:textSize">14sp</item>
        <item name="rippleColor">@color/colorAccent_main</item>
    </style>
    
    <style name="Alert.Button.Negative" parent="Widget.MaterialComponents.Button.OutlinedButton">
        <item name="strokeColor">@color/color_0054BB</item>
        <item name="android:textColor">@color/color_0054BB</item>
        <item name="android:textAllCaps">false</item>
        <item name="android:textSize">14sp</item>
        <item name="android:layout_marginEnd">8dp</item>
        <item name="rippleColor">@color/colorAccent_main</item>
    </style>
    

  3. 您不需要将主题应用到 AlertDialog,因为您的 Activity 会将主题应用到它。所以,正常创建对话框吧。

结果会是。

【讨论】:

  • 我不知道为什么,“buttonBarPositiveButtonStyle”对我不起作用,但“android:buttonBarPositiveButtonStyle”工作正常。
  • 该样式不适用于 PositiveButton。与负数相同。
【解决方案5】:

首先,如果您使用的是 Material Theme,最好使用 MaterialAlertDialog

您可以在此处阅读更多信息 – Material.io → Theming dialogs

MaterialAlertDialogBuilder(context)
            .setTitle(R.string.confirm)
            .setMessage(R.string.logout)
            .setPositiveButton(R.string.logout_alert_positive) { _, _ -> activity?.logout() }
            .setNegativeButton(R.string.never_mind, null)
            .show()

 

This 是 MaterialAlertDialog 操作的 layout.xml。如您所见,有 3 个按钮,每个按钮都有自己的样式。所以,这里是你可以改变它们的方法。

第 1 步:告诉 Android 您要更改默认的MaterialAlertDialog 主题。

<style name="Base.AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
    ...
    <item name="materialAlertDialogTheme">@style/AlertDialog</item>
    ...
</style>

第 2 步:告诉 Android 您要更改特定的按钮样式。 buttonBarNeutralButtonStylebuttonBarNegativeButtonStylebuttonBarPositiveButtonStyle

<style name="AlertDialog" parent="ThemeOverlay.MaterialComponents.MaterialAlertDialog">
    <item name="buttonBarNegativeButtonStyle">@style/NegativeButtonStyle</item>
</style>

第 3 步:定义您的自定义样式

<style name="NegativeButtonStyle" parent="Widget.MaterialComponents.Button.TextButton">
    <item name="android:textColor">#FF0000</item>
</style>

【讨论】:

    【解决方案6】:

    在这里使用 MaterialComponents 找到了另一个解决方案:https://issuetracker.google.com/issues/116861837#comment9

    <style name="Theme.Custom.Material.Alert.Dialog.Light" parent="Theme.MaterialComponents.Light.Dialog.Alert">
        <item name="materialButtonStyle">@style/Widget.AppCompat.Button.Borderless</item>
    </style>
    
    <style name="Theme.Custom.Material.Base.Light" parent="Theme.MaterialComponents.Light.NoActionBar">
        <item name="android:dialogTheme">@style/Theme.Custom.Material.Alert.Dialog.Light</item>
        <item name="android:alertDialogTheme">@style/Theme.Custom.Material.Alert.Dialog.Light</item>
      ....
    </style>
    

    虽然这对我来说仍然不是“预期行为”。

    【讨论】:

      【解决方案7】:

      如果你不想使用androidx.appcompat.app.AlertDialog,你可以重新定义对话框按钮的样式:

      在你的 style.xml 中:

      <style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
         ...
         <item name="android:buttonBarButtonStyle">@style/DialogButton</item>
         ...
      </style>
      
      <style name="DialogButton" parent="Widget.MaterialComponents.Button.TextButton"/>
      
      

      【讨论】:

        【解决方案8】:

        如果您使用的是com.android.support:design:28.0.0 库,则使用android.support.v7.app.AlertDialog 可以按预期工作。

        【讨论】:

          猜你喜欢
          • 2011-07-13
          • 1970-01-01
          • 2012-01-03
          • 1970-01-01
          • 2014-12-29
          • 2015-08-27
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多