将样式应用于警报对话框答案

【问题标题】：Apply style to Alert Dialogs将样式应用于警报对话框
【发布时间】：2020-03-06 10:39:49
【问题描述】：

我决定在 Android 上尝试材料警报dialogs。我遇到的问题是当我尝试应用一些样式时。检查文档，我发现了这个：

<item name="materialAlertDialogTheme">@style/ThemeOverlay.MaterialComponents.MaterialAlertDialog</item>

所以我决定试试这个：

  <style name="BaseTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">

    <item name="materialAlertDialogTheme">@style/Theme.App.MaterialDialogAlert</item>

  </style>
      <style name="Theme.App.MaterialDialogAlert" parent="ThemeOverlay.MaterialComponents.Dialog.Alert">
        <!-- FIXME: this does not work. it does not change the title appearance. -->
    <!--    <item name="materialAlertDialogTitleTextStyle">@style/TextAppearance.App.MaterialDialogAlert.Title.Text</item>-->
        <!-- FIXME: this change only the title font, not the message appearance -->
        <item name="android:fontFamily">@font/nunito_semi_bold</item>
        <item name="buttonBarPositiveButtonStyle">@style/Widget.App.Button.TextButton</item>
        <item name="buttonBarNegativeButtonStyle">@style/Widget.App.Button.TextButton</item>
      </style>

    <style name="TextAppearance.App.MaterialDialogAlert.Title.Text" parent="MaterialAlertDialog.MaterialComponents.Title.Text">
        <item name="android:fontFamily">@font/nunito_semi_bold</item>
      </style>

但到目前为止，我可以成功地设置按钮样式。对于标题和消息，我有一些问题。现在我可以通过以下方式将一些样式应用于标题：

<item name="android:fontFamily">@font/nunito_semi_bold</item>

但我认为这不是正确的方法。首先，这不会将字体应用于消息部分。其次，我想应用其他文本样式，一种用于标题，一种用于消息部分。

我也试过检查这个样式：MaterialAlertDialog.MaterialComponents.Title.Text，我可以看到这个项目在某个时候被应用了：

<item name="android:textAppearance">?attr/textAppearanceSubtitle1</item>

所以我决定在我的基本主题中声明：

<style name="BaseTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
    <item name="textAppearanceSubtitle1">@style/TextAppearance.App.Subtitle1</item>
  </style>

  <style name="TextAppearance.App.Subtitle1" parent="TextAppearance.MaterialComponents.Subtitle1">
    <item name="android:fontFamily">@font/nunito_semi_bold</item>
  </style>

但没有任何改变。

所以我的问题是：

如何使用主题/样式正确执行此操作。
我当前的代码有什么问题？

编辑我也试过用这个：

  <style name="Theme.App.MaterialDialogAlert" parent="ThemeOverlay.MaterialComponents.Dialog.Alert">
    <item name="materialAlertDialogTitleTextStyle">@style/Dialog.App.MaterialDialogAlert.Title.Text</item>
    <item name="materialAlertDialogBodyTextStyle">@style/TextAppearance.App.MaterialDialogAlert.Body.Text</item>
    <item name="buttonBarPositiveButtonStyle">@style/Widget.App.Button.TextButton</item>
    <item name="buttonBarNegativeButtonStyle">@style/Widget.App.Button.TextButton</item>
  </style>

  <style name="Dialog.App.MaterialDialogAlert.Title.Text" parent="MaterialAlertDialog.MaterialComponents.Title.Text">
    <item name="android:textAppearance">@style/TextAppearance.App.Subtitle1</item>
  </style>

  <style name="TextAppearance.App.Subtitle1" parent="TextAppearance.MaterialComponents.Subtitle1">
    <item name="fontFamily">@font/nunito_semi_bold</item>
    <item name="android:fontFamily">@font/nunito_semi_bold</item>
  </style>

但它不起作用。

我也从材料组件repo尝试了这个：

  <style name="Theme.App.MaterialDialogAlert" parent="ThemeOverlay.MaterialComponents.Dialog.Alert">
    <item name="materialAlertDialogTitleTextStyle">@style/Dialog.App.MaterialDialogAlert.Title.Text</item>
    <item name="materialAlertDialogBodyTextStyle">@style/Dialog.App.MaterialDialogAlert.Body.Text</item>
    <item name="buttonBarButtonStyle">@style/Widget.App.Button.TextButton</item>
  </style>

  <style name="Dialog.App.MaterialDialogAlert.Title.Text" parent="MaterialAlertDialog.MaterialComponents.Title.Text">
    <item name="android:textAppearance">@style/TextAppearance.App.Subtitle1</item>
  </style>

  <style name="Dialog.App.MaterialDialogAlert.Body.Text" parent="@style/MaterialAlertDialog.MaterialComponents.Body.Text">
    <item name="android:textAppearance">@style/TextAppearance.Body2</item>
    <item name="fontFamily">@font/nunito_regular</item>
    <item name="android:fontFamily">@font/nunito_regular</item>
    <item name="android:textColor">@color/color_error</item>
  </style>

但不起作用。

我唯一可以自定义的想法是通过将其添加到主题中来自定义标题：

<item name="android:windowTitleStyle">@style/Dialog.App.MaterialDialogAlert.Title.Text</item>

我正在检查库中的代码，我可以看到正在使用此布局：mtrl_alert_dialog.xml

我可以看到这个：

<TextView
            android:id="@android:id/message"
            style="?attr/materialAlertDialogBodyTextStyle"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:paddingLeft="?attr/dialogPreferredPadding"
            android:paddingRight="?attr/dialogPreferredPadding"/>

我们可以在其中看到对 materialAlertDialogBodyTextStyle 的引用。那么可能是库中的错误？

【问题讨论】：

请查看我对 Material Dialog Here的回答

标签： android material-design android-alertdialog material-components material-components-android

【解决方案1】：

您可以使用此样式自定义标题和正文：

<style name="Theme.App.MaterialDialogAlert" parent="ThemeOverlay.MaterialComponents.MaterialAlertDialog">
    <!-- Title -->
    <item name="materialAlertDialogTitleTextStyle">@style/MyTitle_MaterialAlertDialog</item>
    <!-- Body -->
    <item name="materialAlertDialogBodyTextStyle">@style/BodyTextAppearance.MaterialComponents.Body2</item>
</style>

然后定义title的样式：

<style name="MyTitle_MaterialAlertDialog" parent="@style/MaterialAlertDialog.MaterialComponents.Title.Text">
    <item name="android:textAppearance">@style/MyTitle_TextAppearance.MaterialComponents.Subtitle1</item>
</style>

<style name="MyTitle_TextAppearance.MaterialComponents.Subtitle1" parent="TextAppearance.MaterialComponents.Subtitle1">
    <item name="fontFamily">.....</item>
    <item name="android:fontFamily">....</item>
    <item name="android:textStyle">.....</item>
</style>

然后为body定义：

  <style name="BodyTextAppearance.MaterialComponents.Body2" parent="@style/MaterialAlertDialog.MaterialComponents.Body.Text">
    <item name="android:textColor">@color/....</item>
    <item name="android:textSize">20sp</item>
    <item name="android:textStyle">bold</item>
    <item name="android:textAllCaps">true</item>
    <item name="fontFamily">.....</item>
    <item name="android:fontFamily">....</item>
  </style>

【讨论】：

您好，感谢您的回答。我试过这个，但它不工作。我正在使用 1.1.0-beta02。您使用的是哪个版本。
@LeandroOcampo 更新了答案。它适用于 1.1.0-beta02 和 1.2.0-alpha01
我更新了我的问题。我尝试使用 MC 的 repo，但它也无法正常工作，而且他们使用的是 1.2.0-alpha01，所以我很惊讶它可以与您一起使用。但是当我检查图书馆的内部时，你的回答是完全有道理的。所以我不知道可能是什么问题。
感谢您在文本样式中提及“fontFamily”和“android:fontFamily”。只有同时使用它们时，它才能在任何 api 上工作。
@ChVas 感谢您的反馈。我已经对答案进行了更新。

【解决方案2】：

先应用这种风格：

     <style name="MaterialAlertDialogRoundedStyle" parent="ThemeOverlay.MaterialComponents.MaterialAlertDialog">
    <item name="shapeAppearanceOverlay">
        @style/ShapeAppearanceOverlay.MaterialAlertDialog.Rounded
    </item>// For rounded dialog
    <item name="materialAlertDialogTitleTextStyle">
        @style/TitleMaterialAlertDialog.MaterialComponents.Title.Text
    </item>//to change title text properties of dialog
    <item name="materialAlertDialogBodyTextStyle">
        @style/BodyMaterialAlertDialog.MaterialComponents.Body.Text
    </item>//to change body text properties of dialog
</style>

<style name="ShapeAppearanceOverlay.MaterialAlertDialog.Rounded" parent="">
    <item name="cornerSize">@dimen/_10sdp</item>
</style>

<style name="TitleMaterialAlertDialog.MaterialComponents.Title.Text" parent="MaterialAlertDialog.MaterialComponents.Title.Text">
    <item name="android:textColor">@color/black</item>
    <item name="android:textSize">@dimen/_14ssp</item>
    <item name="android:fontFamily">@font/montserrat_semi_bold</item>
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
</style>

<style name="BodyMaterialAlertDialog.MaterialComponents.Body.Text" parent="MaterialAlertDialog.MaterialComponents.Body.Text">
    <item name="android:textColor">@color/black</item>
    <item name="android:textSize">@dimen/_12ssp</item>
    <item name="android:textAppearance">@style/MyTitle_TextAppearance.MaterialComponents.Subtitle1</item>
</style>

<style name="MyTitle_TextAppearance.MaterialComponents.Subtitle1" parent="TextAppearance.MaterialComponents.Subtitle1">
    <item name="fontFamily">@font/montserrat_regular</item>
    <item name="android:fontFamily">@font/montserrat_regular</item>
</style>

比你这段代码打开对话框：

MaterialAlertDialogBuilder(
        context,
        R.style.MaterialAlertDialogRoundedStyle
    )
        .setTitle(getText(R.string.app_name))
        .setMessage(getString(R.string.are_you_sure_you_want_to_logout))
        .setCancelable(false)
        .setPositiveButton(getText(R.string.ok)) { dialog, _ ->
            dialog.dismiss()
        }
        .setNegativeButton(getText(R.string.cancel)) { dialog, _ ->
            dialog.dismiss()
        }
        .show()

【讨论】：