web-dev-qa-db-ja.com

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

私はプロジェクトでAndroid Navigation barを使用していますが、アクションバーの一番上の色を赤に変更したいのですが、どうすればいいですか?このようなものがあります

top black

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

top red

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

80
hemantsb

カスタムスタイルを作成することで、ActionBar(およびその他のもの)の色を定義できます

Androidプロジェクトのres/values/styles.xmlファイルを編集するだけです。

たとえば、次のようなものです。

<resources>
    <style name="MyCustomTheme" parent="@Android:style/Theme.Holo.Light">
        <item name="Android:actionBarStyle">@style/MyActionBarTheme</item>
    </style>

    <style name="MyActionBarTheme" parent="@Android:style/Widget.Holo.Light.ActionBar">
        <item name="Android:background">ANY_HEX_COLOR_CODE</item>
    </style>
</resources>

次に、「MyCustomTheme」をActionBarを含むアクティビティのテーマとして設定します。

次のようにActionBarの色を設定することもできます。

ActionBar actionBar = getActionBar();
actionBar.setBackgroundDrawable(new ColorDrawable(Color.RED)); // set your desired color

ここから: XMLを使用してActionBarActivityのActionBarの背景色を変更するにはどうすればよいですか?

168
Philipp Jahoda

一般的に、Android OSは「テーマ」を活用して、アプリ開発者がUI要素のスタイリングパラメーターのユニバーサルセットをAndroidアプリケーション全体、または単一のアクティビティサブクラス。

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

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

enter image description here

  1. AppCompat Dark Theme(Theme.AppCompat)、

enter image description here

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

AndroidManifest.xmlとタグを見ると、Androidテーマは次のように言及されています:-Android:theme = "@ style/AppTheme"

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

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

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

異なる色の背景を持つActionBar:-

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

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

そして、この定義は、AppThemeで参照する必要があり、オーバーライドされたActionBarスタイリングを指します。

@ style/MyActionBar ActionBar with pink background color

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

タイトルのテキストの色を変更するには、親参照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>

これが最終的な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 With white title color その他のActionBarオプションメニュースタイルについては、 このリンク を参照してください

51
Nicks

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>

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

詳細については ドキュメント

33
Ketan Ahir

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

<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サイトから撮ったスクリーンショットで、より明確にするためにあります。また、 link は、色調のカスタマイズについて詳しく読むためのものです。

enter image description here

31
Gjoko Bozinov

作る別の可能性。

actionBar.setBackgroundDrawable(new ColorDrawable(Color.parseColor( "#0000ff")));

7
Levi Saturnino

カスタムカラー:

 <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

3
Half Moon

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

Inres/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:Android:colorPrimaryの代わりにcolorPrimaryを使用しました

2
zackygaurav

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>
1
Milaaaad

これを使用します- http://jgilfelt.github.io/Android-actionbarstylegenerator/

数分でライブプレビューを使用してアクションバーをカスタマイズするための優れたツール。

0
chanu