web-dev-qa-db-ja.com

ツールバー内の画像に反映されたAppCompatスタイルの背景

コンテキスト

最新のAppCompat v7 lib（21.0.0）を使用しており、アプリをActionBarからToolBarに移行しました

問題

  1. ツールバーの画像は、ツールバーと同じ背景を自動的に受け取ります

現在、SearchBoxはアクションバーに設定されたカスタムビューです（以前の実装から）SearchViewに切り替えてそれに応じてスタイルを設定する予定ですが、今直面している問題に非常に興味があります。

Img background

  1. ツールバーのメニュー項目を長押しすると、トーストがヒントテキストとともに表示され、テキストはツールバーと同じ背景になります。

Toast background

どうすればこれを回避できますか？

これが私のツールバーのレイアウトとスタイルとテーマです

レイアウトv_toolbar.xml

<?xml version="1.0" encoding="utf-8"?>
<Android.support.v7.widget.Toolbar
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:id="@+id/my_awesome_toolbar"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    app:theme="@style/MyActionBarStyle"/>

values/styles.xml

<style name="MyActionBarStyle" parent="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="Android:background">@color/green</item>
    <item name="Android:windowActionBarOverlay">true</item>

    <!-- Support library compatibility -->
    <item name="background">@color/green</item>
    <item name="windowActionBarOverlay">true</item>
</style>

テーマ

<style name="MyTheme" parent="AppBaseTheme">
    <!-- Here we setting appcompat’s actionBarStyle -->
    <!-- <item name="actionBarStyle">@style/MyActionBarStyle</item> -->

    <item name="windowActionBar">false</item>
    <!-- ...and here we setting appcompat’s color theming attrs -->
    <item name="colorPrimary">@color/green</item>
    <item name="colorPrimaryDark">@color/green_dark</item>
</style>

問題1の回避策1

最初の問題の回避策は、ImageViewに透明な背景を設定することです

Android:background="@color/transparent"

これはトーストの問題を解決しません。

両方の問題の解決策

ツールバーに背景を設定します

<?xml version="1.0" encoding="utf-8"?>
<Android.support.v7.widget.Toolbar
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:id="@+id/my_awesome_toolbar"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:background="@color/green"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    app:theme="@style/MyActionBarStyle"/>

そして、私はもうテーマの背景を設定していません。

<style name="MyActionBarStyle" parent="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="Android:windowActionBarOverlay">true</item>
    <!-- Support library compatibility -->
    <item name="windowActionBarOverlay">true</item>
</style>

Chris Banesが指摘したように、Android：backgroundを宣言する代わりに、ツールバーのスタイルを作成できます。

これで問題が解決しますが、popupThemeが適用されず、ShareActionMenuItemドロップダウンに白い背景と黒いテキストが含まれていないという事実に別の問題があるようです。こちらの別の質問をご覧ください： AppCompat ToolBar popupTheme not used in the ShareAction MenuItem

たぶん、これはappcompatライブラリのバグです。

androidandroid-appcompatandroid-toolbar
25
Benoit

次のようなthemeを使用しないでください。

  • スタイル=ツールバーのローカル
  • テーマ=ツールバーで膨らんだすべてのものに対してグローバル

回避策2は、あなたがそれを呼ぶとき、一種の正しい方法です。スタイルにいくつかの値を抽出する場合は、次のように実行できます。

<Android.support.v7.widget.Toolbar
    Android:id="@+id/my_awesome_toolbar"
    Android:layout_width="match_parent"
    Android:layout_height="?attr/actionBarSize"
    style="@style/MyDarkToolbar" />

スタイル：

<style name="MyDarkToolbarStyle" parent="Widget.AppCompat.Toolbar">
    <item name="Android:background">@color/green</item>
    <item name="popupTheme">@style/ThemeOverlay.AppCompat.Light</item>
    <item name="theme">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>
46
Chris Banes

テーマを使用して編集しないでください。テーマはアプリ全体の動作を定義するためです。 Uは2つの方法を使用できます

方法：1

Uは、以下に示すようにappbar.xmlでパラメーターを直接指定できます。

appbar.xmlで

  <?xml version="1.0" encoding="utf-8"?>
    <Android.support.v7.widget.Toolbar
        Android:id="@+id/my_awesome_toolbar"
        Android:layout_width="match_parent"
        Android:layout_height="?attr/actionBarSize"
        Android:background="@color/green"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme=">style/ThemeOverlay.AppCompat.Light"/>

方法：2

上記の投稿でChris_Banesが提案したスタイルを使用できます

appbar.xmlで：

<Android.support.v7.widget.Toolbar
    Android:id="@+id/my_awesome_toolbar"
    Android:layout_width="match_parent"
    Android:layout_height="?attr/actionBarSize"
    style="@style/MyDarkToolbar" />

スタイルで：

<style name="MyDarkToolbarStyle" parent="Widget.AppCompat.Toolbar">
    <item name="Android:background">@color/green</item>
    <item name="popupTheme">@style/ThemeOverlay.AppCompat.Light</item>
    <item name="theme">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>

注意点

新しいツールバーを使用すると、スタイルとテーマを適用できます。彼らは異なっている！スタイルは、たとえば背景色など、ツールバービューに対してローカルです。代わりに、app：themeは、タイトルやアイコンの色など、ツールバーで拡大されるすべてのUI要素に対してグローバルです。

5
Ashok Varma