いつTheme.AppCompatとThemeOverlay.AppCompatを使用する必要がありますか?


113

次のTheme.AppCompatクラスがあります。

Theme.AppCompat
Theme.AppCompat.Light
Theme.AppCompat.Light.DarkActionBar
Theme.AppCompat.NoActionBar
Theme.AppCompat.Light.NoActionBar
Theme.AppCompat.DialogWhenLarge
Theme.AppCompat.Light.DialogWhenLarge
Theme.AppCompat.Dialog
Theme.AppCompat.Light.Dialog
Theme.AppCompat.CompactMenu

および次のThemeOverlay.AppCompatクラス:

ThemeOverlay.AppCompat
ThemeOverlay.AppCompat.Light
ThemeOverlay.AppCompat.Dark
ThemeOverlay.AppCompat.ActionBar
ThemeOverlay.AppCompat.Dark.ActionBar

たとえば、なぜThemeOverlay.AppCompat.lightとTheme.AppCompat.Lightを使用するのですか?ThemeOverlayに定義されている属性がはるかに少ないことがわかります-ThemeOverlayの意図されたユースケースが何であるか知りたいです。

回答:


71

AppCompatの作成者によるこのテーマvsスタイルのブログ投稿

[ThemeOverlays]は、通常のTheme.Materialテーマをオーバーレイする特別なテーマであり、関連する属性を上書きして、それらを明るい/暗いのいずれかにします。

ThemeOverlay + ActionBar

あなたの鋭い目はActionBar ThemeOverlay派生物を見たことがあるでしょう:

  • ThemeOverlay.Material.Light.ActionBar
  • ThemeOverlay.Material.Dark.ActionBar

これらは、新しいactionBarTheme属性を介してアクションバーでのみ使用するか、ツールバーに直接設定する必要があります。

これらが現在親に対して異なる唯一のことは、をに変更するcolorControlNormalことですandroid:textColorPrimary。これにより、テキストとアイコンが不透明になります。


155

Theme.AppCompatは、アプリ全体のグローバルテーマを設定するために使用されます。ThemeOverlay.AppCompatは、特定のビュー、特にツールバーのテーマをオーバーライド(または「オーバーレイ」)するために使用されます。

これが必要な理由の例を見てみましょう。

ActionBarを使用したアプリのテーマ

通常、ActionBarはアプリに表示されます。colorPrimary値を設定することで色を選択できます。ただし、テーマを変更すると、ActionBarのテキストの色が変わります。

<style name="AppTheme" parent="Theme.AppCompat">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

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

私の原色は濃い青なので、黒いテキストは読みにくいので、おそらくアクションバーで明るいテキスト色を使用するテーマの1つを使用する必要があります。

ActionBarを非表示にしてツールバーを使用する

Theme.MaterialではなくTheme.AppCompatを使用することの要点は、古いバージョンのAndroidがマテリアルデザインテーマを使用できるようにすることです。問題は、古いバージョンのAndroidがActionBarをサポートしていないことです。したがって、ドキュメントでは、ActionBarを非表示にし、レイアウトにツールバーを追加することを推奨しています。ActionBarを非表示にするには、いずれかのNoActionBarテーマを使用する必要があります。次の画像は、ActionBarが非表示になっているツールバーを示しています。

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

しかし、DarkActionBarのあるLightテーマのようなものが必要な場合はどうなりますか?NoActionBarを使用する必要があるため、これはオプションではありません。

アプリのテーマを上書きする

ここがThemeOverlayの出番です。ツールバーのXMLレイアウトでDark ActionBarテーマを指定できます。

<android.support.v7.widget.Toolbar
    ...
    android:background="?attr/colorPrimary"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />

これにより、最終的に必要な効果を得ることができます。Dark.ActionBarテーマは、この特定の機会のためのLightアプリテーマをオーバーレイします。

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

  • アプリのテーマ: Theme.AppCompat.Light.NoActionBar
  • ツールバーのテーマ: ThemeOverlay.AppCompat.Dark.ActionBar

ポップアップメニューを軽くしたい場合は、次のように追加できます。

app:popupTheme="@style/ThemeOverlay.AppCompat.Light"

さらなる研究

私はこれを実験と次の記事を読んで学びました。


Themeoverlayを使用するときにステータスバーを透明にする方法は?
gegobyte 2018

新しいMaterialToolbarでこれを達成する方法を知りたいです
David

@David、今はほとんどFlutterを使用しているので、Androidの新しい開発に追いついていません。答えを見つけたら、ここに戻ってコメントを残してください。私の答えを編集するか、独自の答えを追加してください。
スラグ
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.