マテリアルデザインがアラートダイアログのスタイルを設定していません


161

appCompatマテリアルデザインをアプリに追加しましたが、アラートダイアログでプライマリ、プライマリダーク、またはアクセントカラーが使用されていないようです。

これが私の基本スタイルです:

<style name="MaterialNavyTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
    <item name="colorPrimary">@color/apptheme_color</item>
    <item name="colorPrimaryDark">@color/apptheme_color_dark</item>
    <item name="colorAccent">@color/apptheme_color</item>
    <item name="android:textColorPrimary">@color/action_bar_gray</item>
</style>

私の理解に基づいて、ダイアログボタンのテキストもこれらの色を使用する必要があります。私の理解に誤りはありますか、それとも私がする必要がある何か他にありますか?


解決:

マークされた答えは私を正しい軌道に乗せました。

<style name="MaterialNavyTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
    <item name="colorPrimary">@color/apptheme_color</item>
    <item name="colorPrimaryDark">@color/apptheme_color_dark</item>
    <item name="colorAccent">@color/apptheme_color</item>
    <item name="android:actionModeBackground">@color/apptheme_color_dark</item>
    <item name="android:textColorPrimary">@color/action_bar_gray</item>
    <item name="sdlDialogStyle">@style/DialogStyleLight</item>
    <item name="android:seekBarStyle">@style/SeekBarNavyTheme</item>
</style>

<style name="StyledDialog" parent="Theme.AppCompat.Light.Dialog">
    <item name="colorPrimary">@color/apptheme_color</item>
    <item name="colorPrimaryDark">@color/apptheme_color_dark</item>
    <item name="colorAccent">@color/apptheme_color</item>
</style>

私が作成したこのライブラリを試すことができます:github.com/AndroidDeveloperLB/MaterialStuffLibrary
android developer

15
下の部分が解決策になるはずですか?その場合は、自己回答として投稿してください。回答を質問に編集しないでください。
Adi Inbar 2014年

回答:


463

AndroidライブラリのMaterialコンポーネントを使用して2019年8月に更新:

Androidライブラリの新しいMaterialコンポーネントを使用するとcom.google.android.material.dialog.MaterialAlertDialogBuilder、既存のクラスを拡張した新しいクラスを使用できます。androidx.appcompat.AlertDialog.Builderとクラスれ、最新のMaterial Design仕様をサポート。

次のようなものを使用してください:

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

ThemeOverlay.MaterialComponents.MaterialAlertDialogスタイルを拡張する色をカスタマイズできます。

  <style name="CustomMaterialDialog" parent="@style/ThemeOverlay.MaterialComponents.MaterialAlertDialog">
     <!-- Background Color-->
     <item name="android:background">#006db3</item>
     <!-- Text Color for title and message -->
     <item name="colorOnSurface">@color/secondaryColor</item>
     <!-- Text Color for buttons -->
     <item name="colorPrimary">@color/white</item> 
     ....
  </style>  

カスタムスタイルを適用するには、コンストラクタを使用します

new MaterialAlertDialogBuilder(context, R.style.CustomMaterialDialog)

ここに画像の説明を入力してください

ボタン、タイトル、本文カスタマイズするには、この投稿を確認してくださいで詳細をしてください。

アプリのテーマのスタイルをグローバルに変更することもできます:

 <!-- Base application theme. -->
 <style name="AppTheme" parent="Theme.MaterialComponents.Light">
    ...
    <item name="materialAlertDialogTheme">@style/CustomMaterialDialog</item>
 </style>

サポートライブラリとAPPCOMPATテーマ:

新しいでAppCompat v22.1は、新しいandroid.support.v7.app.AlertDialogを使用できます

次のようなコードを使用してください:

import android.support.v7.app.AlertDialog

AlertDialog.Builder builder =
       new AlertDialog.Builder(this, R.style.AppCompatAlertDialogStyle);
builder.setTitle("Dialog");
builder.setMessage("Lorem ipsum dolor ....");
builder.setPositiveButton("OK", null);
builder.setNegativeButton("Cancel", null);
builder.show();

次のようなスタイルを使用します。

<style name="AppCompatAlertDialogStyle" parent="Theme.AppCompat.Light.Dialog.Alert">
        <item name="colorAccent">#FFCC00</item>
        <item name="android:textColorPrimary">#FFFFFF</item>
        <item name="android:background">#5fa3d0</item>
    </style>

それ以外の場合は、現在のテーマで定義できます。

<style name="AppTheme" parent="Theme.AppCompat.Light">
    <!-- your style -->
    <item name="alertDialogTheme">@style/AppCompatAlertDialogStyle</item>
</style>

そしてあなたのコードで:

 import android.support.v7.app.AlertDialog

    AlertDialog.Builder builder =
           new AlertDialog.Builder(this);

キットカットのAlertDialog: ここに画像の説明を入力してください


2
デフォルトのテーマを更新するのではなく、AlertDialog.Builderに正確なテーマを使用させるのはなぜですか?Javaコードの代わりに、styles.xmlでこの問題を解決したいと思います。
トマーシュHubálek

2
タイトルとボタンのフォントは、ロリポップ前のデバイスでは太字になりません。
jimmy0251 2015

9
仕事にそれを得るために:私は「アンドロイド」:を先頭に追加しなければならなかった<item name="android:alertDialogTheme">@style/AppCompatAlertDialogStyle</item>

1
素晴らしい答えの+1ですが、ロリーポップの下のAndroidバージョンで同じUIを実現するにはどうすればよいですか?
realpranav 2015

1
add import android.support.v7.app.AlertDialogが機能する
FlipNovid

9

ダイアログビルダーを初期化するときに、2番目のパラメーターをテーマとして渡します。APIレベル21のマテリアルデザインが自動的に表示されます。

AlertDialog.Builder builder = new AlertDialog.Builder(this, AlertDialog.THEME_DEVICE_DEFAULT_DARK);

または、

AlertDialog.Builder builder = new AlertDialog.Builder(this, AlertDialog.THEME_DEVICE_DEFAULT_LIGHT);

4

AppCompatはダイアログに対してそれを行いません(少なくともまだ)

編集: 今はそうです。必ず使用してくださいandroid.support.v7.app.AlertDialog


AppCompatでダイアログスタイルにいくつかの変更を加えることができるように見えます
Matthew

私のAndroid Studioはデフォルトでimport app.AlertDialogappCompat を提供しませんでした。私は実際にそれをチェックする前に、約40分間何が問題なのかを理解しようとしました...くそーグーグル!
Glorifind 2015年

2

あなたはこのプロジェクトを検討することができますhttps : //github.com/fengdai/AlertDialogPro

ロリポップとほぼ同じマテリアルテーマのアラートダイアログを提供できます。Android 2.1と互換性があります。


ただのメモ:この答えは古いものであり、受け入れられたものです。
2015

2

あなたは使うことができます

マテリアルデザインライブラリ

かなり注意深いダイアログ、ボタン、およびスナックバーの ような他のもののために作られたマテリアルデザインライブラリ現在、かなり開発されています。

ガイド、コード、例-https://github.com/navasmdc/MaterialDesignLibrary

ライブラリをAndroid Studio 1.0に追加する方法のガイド-私は、Android Studioに材料設計ライブラリをインポートするにはどうすればよいですか?

幸せなコーディング;)


1

このライブラリを試してください:

https://github.com/avast/android-styled-dialogs

(@afollestadからのものなど)のDialogFragments代わりに基づいていAlertDialogsます。主な利点:ダイアログはローテーション後に閉じず、コールバックは引き続き機能します。


私のライブラリははるかに機能的です。そして、あなたはいつでもDialogFragmentでDialogをラップすることができます。😛
afollestad

1

何らかの理由でandroid:textColorはタイトルの色を更新するだけのようです。メッセージテキストの色を変更するには、

SpannableString.AlertDialog.Builder builder = new AlertDialog.Builder(new ContextThemeWrapper(this, R.style.MyDialogTheme));

AlertDialog dialog = builder.create();
                Spannable wordtoSpan = new SpannableString("I know just how to whisper, And I know just how to cry,I know just where to find the answers");
                wordtoSpan.setSpan(new ForegroundColorSpan(Color.BLUE), 15, 30, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
                dialog.setMessage(wordtoSpan);
                dialog.show();

0

マテリアルデザインのスタイリングアラートダイアログ:カスタムフォント、ボタン、色、形状など

 MaterialAlertDialogBuilder(requireContext(),
                R.style.MyAlertDialogTheme
            )
                .setIcon(R.drawable.ic_dialogs_24px)
                .setTitle("Feedback")
                //.setView(R.layout.edit_text)
                .setMessage("Do you have any additional comments?")
                .setPositiveButton("Send") { dialog, _ ->

                    val input =
                        (dialog as AlertDialog).findViewById<TextView>(
                            android.R.id.text1
                        )
                    Toast.makeText(context, input!!.text, Toast.LENGTH_LONG).show()

                }
                .setNegativeButton("Cancel") { _, _ ->
                    Toast.makeText(requireContext(), "Clicked cancel", Toast.LENGTH_SHORT).show()
                }
                .show()

スタイル:

  <style name="MyAlertDialogTheme" parent="Theme.MaterialComponents.DayNight.Dialog.Alert">
  
        <item name="android:textAppearanceSmall">@style/MyTextAppearance</item>
        <item name="android:textAppearanceMedium">@style/MyTextAppearance</item>
        <item name="android:textAppearanceLarge">@style/MyTextAppearance</item>

        <item name="buttonBarPositiveButtonStyle">@style/Alert.Button.Positive</item>
        <item name="buttonBarNegativeButtonStyle">@style/Alert.Button.Neutral</item>
        <item name="buttonBarNeutralButtonStyle">@style/Alert.Button.Neutral</item>

        <item name="android:backgroundDimEnabled">true</item>

        <item name="shapeAppearanceOverlay">@style/ShapeAppearanceOverlay.MyApp.Dialog.Rounded
        </item>

    </style>




    <style name="MyTextAppearance" parent="TextAppearance.AppCompat">
        <item name="android:fontFamily">@font/rosarivo</item>
    </style>


        <style name="Alert.Button.Positive" parent="Widget.MaterialComponents.Button.TextButton">
   <!--     <item name="backgroundTint">@color/colorPrimaryDark</item>-->
        <item name="backgroundTint">@android:color/transparent</item>
        <item name="rippleColor">@color/colorAccent</item>
        <item name="android:textColor">@color/colorPrimary</item>
       <!-- <item name="android:textColor">@android:color/white</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">@android:color/transparent</item>
        <item name="rippleColor">@color/colorAccent</item>
        <item name="android:textColor">@color/colorPrimary</item>
        <!--<item name="android:textColor">@android:color/darker_gray</item>-->
        <item name="android:textSize">14sp</item>
        <item name="android:textAllCaps">false</item>
    </style>


  <style name="ShapeAppearanceOverlay.MyApp.Dialog.Rounded" parent="">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSize">8dp</item>
    </style>

出力: ここに画像の説明を入力してください

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.