web-dev-qa-db-ja.com

マテリアルデザインの変更AppCompat ActionBarカラー

actionBarStyleを使用してAppCompatステータスバーの色を変更し、必要な色の背景を持つスタイルを作成していました。

現在、Material Design AppCompatでは、このメソッドはもう機能しません。

手伝って頂けますか?ありがとう。

28
user3184899

テーマで定義できるcolorPrimaryという新しい属性があります。これにより、ActionBarまたはツールバーに単色が表示されます。

小さな例を次に示します。

_<style name="AppTheme" parent="Theme.AppCompat.Light">
    <!-- colorPrimary is used for the default action bar background -->
    <item name="colorPrimary">@color/my_action_bar_color</item>
</style>
_

注意:_Android:colorPrimary_を除くすべての値フォルダでは、_values-v21_ではなく、colorPrimaryのみである必要があります。

developer.Android.com でカラーパレットのカスタマイズの詳細を読むことができます。

90
reVerse

私の場合、@ reVerseには部分的な回答がありました。ツールバーの他の部分(具体的にはテキストの色)をカスタマイズしていたため、colorPrimaryを機能させるために追加の変更を行う必要がありました。

ここに、作業中のstyles.xmlファイルと、私が間違っていたことを示すコメントを示します。

<!-- As @reVerse mentioned, you need to use colorPrimary instead of Android:colorPrimary -->
<style name="MyTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="colorPrimary">@color/my_toolbar_color</item>
</style>

<!-- I was incorrectly using @style/Theme.AppCompat.Light for the popupTheme attribute -->
<style name="MyToolbarStyle" parent="Widget.AppCompat.ActionBar">
    <item name="theme">@style/MyToolbarTextStyle</item>
    <item name="popupTheme">@style/ThemeOverlay.AppCompat.Light</item>
</style>

<!-- I was incorrectly using Them.AppCompat.Light for the parent here -->
<style name="MyToolbarTextStyle" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="Android:textColorPrimary">@color/my_toolbar_text_color</item>
</style>

したがって、ツールバーの背景色以外をカスタマイズする場合は、ThemeOverlayテーマのいずれかを使用する必要があります。そうしないと、何らかの理由でcolorPrimaryが無視されます。

完全を期すために、ツールバーに使用するレイアウトファイルToolbar.xmlを以下に示します。

<Android.support.v7.widget.Toolbar
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schmeas.Android.com/apk/res-auto"
    style="@style/MyToolbarStyle"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content" />

これが誰かの助けになることを願っています!

3
Justin

ドキュメント内の方向 アプリバーを設定するには、Androidマニフェストファイルでこのテーマを設定することをお勧めします。

<application
    Android:theme="@style/Theme.AppCompat.Light.NoActionBar"
    />

しかし、私の経験では、これはカスタムAppTheme用にセットアップされたcolorPrimaryスタイルを上書きしました。私のために働いたのは、このようなカスタムテーマを定義することでした:

<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

そして、AndroidManifestファイルでこのテーマを使用します。

<application
    Android:theme="@style/AppTheme"
    />

その後、colorPrimaryに基づいたアクティビティのツールバーの背景色が正常に機能しました。

<Android.support.v7.widget.Toolbar
    Android:id="@+id/my_toolbar"
    Android:layout_width="match_parent"
    Android:layout_height="?attr/actionBarSize"
    Android:background="?attr/colorPrimary"
    Android:elevation="4dp"
    Android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

(ThemeOverlayに暗いテーマを設定すると、テキストが明るくなります。)

0
Suragch
   <style name="AppTheme" parent="Theme.AppCompat.Light">

        <item name="colorPrimary">@color/ColorPrimary</item>
        <item name="colorPrimaryDark">@color/ColorPrimaryDark</item>
        <!-- Customize your theme here. -->
    </style>

参照: カスタムActionBarの作成

0
Half Moon