android - カスタム ActionBar の色/スタイルを設定するには?

Question

私はAndroid Navigation bar自分のプロジェクトで使用しています。アクションバーの上部の色を何か赤い色に変更したいのですが、どうすればできますか? 私はこのようなものを持っています、

そして、私はこのようなものが欲しい、

どうすればそれを達成できますか?

Answer 1

一般に、Android OS は「テーマ」を利用して、アプリ開発者が UI 要素のスタイリング パラメータのユニバーサル セットを Android アプリケーション全体に、または代わりに単一の Activity サブクラスにグローバルに適用できるようにします。

そのため、バージョン 3.0 以降のバージョン向けのアプリを開発する際に、Android マニフェスト XML ファイルで指定できる、主流の Android OS の「システム テーマ」が 3 つあります。

ここで (APPCOMPAT) サポート ライブラリを参照しています:-- 3 つのテーマは 1. AppCompat Light テーマ(Theme.AppCompat.Light)

2. AppCompat ダーク テーマ(Theme.AppCompat)、

3. そして、これら 2 つの AppCompat Light Theme と Darker ActionBar のハイブリッド ( Theme.AppCompat.Light.DarkActionBar)

AndroidManifest.xml を開き、タグを参照してください。Android テーマは次のように記述されています:-- android:theme="@style/AppTheme"

Styles.xml を開くと、ベース アプリケーションのテーマが宣言されています。

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
  </style>

アクション バーのスタイルを設定するには、これらの親テーマ要素をオーバーライドする必要があります。

背景色が異なるアクションバー:--

これを行うには、Android ActionBar UI 要素のスタイル特性を保持する@style/Widget.AppCompat.Light.ActionBar.Solid.Inverseへの親参照を持つ新しいスタイル MyActionBar (任意の名前を付けることができます) を作成する必要があります。したがって、定義は次のようになります

<style name="MyActionBar" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
    <item name="background">@color/red</item>
</style>

この定義は AppTheme で参照する必要があり、オーバーライドされた ActionBar スタイルを次のように指定します。

@style/MyActionBar

タイトル バーのテキストの色を変更します (例: 黒から白へ):--

タイトル テキストの色を変更するには、親参照のparent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">をオーバーライドする必要があります。

したがって、スタイル定義は次のようになります

<style name="MyActionBarTitle" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
    <item name="android:textColor">@color/white</item>
</style>

TitleTextStyle の変更は ActionBar 親 OS UI 要素の子要素であるため、このスタイル定義はMyActionBar スタイル定義 内で参照します。したがって、MyActionBar スタイル要素の最終的な定義は次のようになります。

<style name="MyActionBar" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
    <item name="background">@color/red</item>
    <item name="titleTextStyle">@style/MyActionBarTitle</item>
</style>

SO これが最終的な Styles.xml です

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light">
        <!-- This is the styling for action bar -->
        <item name="actionBarStyle">@style/MyActionBar</item>
    </style>

    <style name="MyActionBar" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
        <item name="background">@color/red</item>
        <item name="titleTextStyle">@style/MyActionBarTitle</item>
    </style>

    <style name="MyActionBarTitle" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
        <item name="android:textColor">@color/white</item>
    </style>
</resources>

その他の ActionBar オプションのメニュー スタイルについては、このリンクを参照してください。

Answer 2

Android 3.0 以降のみ

Android 3.0 以降のみをサポートする場合、アクション バーの背景を次のように定義できます。

res/values/themes.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- the theme applied to the application or activity -->
    <style name="CustomActionBarTheme" parent="@style/Theme.Holo.Light.DarkActionBar">
       <item name="android:actionBarStyle">@style/MyActionBar</item>
    </style>

<!-- ActionBar styles -->
  <style name="MyActionBar" parent="@style/Widget.Holo.Light.ActionBar.Solid.Inverse">
       <item name="android:background">#ff0000</item>
  </style>
</resources>

Android 2.1 以降の場合

サポート ライブラリを使用する場合、スタイル XML ファイルは次のようになります。

<?xml version="1.0" encoding="utf-8"?>
  <resources>
  <!-- the theme applied to the application or activity -->
 <style name="CustomActionBarTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
    <item name="android:actionBarStyle">@style/MyActionBar</item>

    <!-- Support library compatibility -->
    <item name="actionBarStyle">@style/MyActionBar</item>
</style>

<!-- ActionBar styles -->
<style name="MyActionBar"
       parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
    <item name="android:background">@drawable/actionbar_background</item>

    <!-- Support library compatibility -->
    <item name="background">@drawable/actionbar_background</item>
  </style>
 </resources>

次に、テーマをアプリ全体または個々のアクティビティに適用します。

詳しくはドキュメンテーション

Answer 3

この方法でアクション バーの色を変更できます。

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="colorPrimary">@color/green_action_bar</item>
</style>

アクションバーの色を変更するために必要なのはそれだけです。

さらに、ステータスバーの色を変更したい場合は、次の行を追加するだけです:

 <item name="android:colorPrimaryDark">@color/green_dark_action_bar</item>

これは、より明確にするために開発者の Android サイトから取得したスクリーンショットです。カラー パレットのカスタマイズの詳細については、こちらのリンクを参照してください。

Answer 4

カスタムカラー:

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

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

カスタム スタイル:

 <style name="Theme.AndroidDevelopers" parent="android:style/Theme.Holo.Light">
        <item name="android:selectableItemBackground">@drawable/ad_selectable_background</item>
        <item name="android:popupMenuStyle">@style/MyPopupMenu</item>
        <item name="android:dropDownListViewStyle">@style/MyDropDownListView</item>
        <item name="android:actionBarTabStyle">@style/MyActionBarTabStyle</item>
        <item name="android:actionDropDownStyle">@style/MyDropDownNav</item>
        <item name="android:listChoiceIndicatorMultiple">@drawable/ad_btn_check_holo_light</item>
        <item name="android:listChoiceIndicatorSingle">@drawable/ad_btn_radio_holo_light</item>
    </style>

詳細: Android ActionBar

Answer 5

上記の回答を使用しAppCompatActivityていたので、うまくいきませんでした。しかし、以下の解決策はうまくいきました：

res/styles.xml内

<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
</style>

PS：colorPrimary代わりに使用しましたandroid:colorPrimary

Answer 6

style.xml にこのコードを追加します

<resources>
    <style name="MyTheme" parent="@android:style/Theme.Holo.Light">
        <item name="android:actionBarStyle">@style/MyAction</item>
    </style>

    <style name="MyActionBarTheme" parent="@android:style/Widget.Holo.Light.ActionBar">
        <item name="android:background">#333333</item>
    </style>
</resources>