कस्टम ActionBar रंग / शैली कैसे सेट करें?


87

मैं Android Navigation barअपने प्रोजेक्ट में उपयोग कर रहा हूं, मैं एक्शन बार में शीर्ष रंग को कुछ लाल में बदलना चाहता हूं, मैं यह कैसे कर सकता हूं? मेरे पास कुछ ऐसा है,

शीर्ष काला

और मुझे ऐसा कुछ चाहिए,

शीर्ष लाल

मैं उसे कैसे प्राप्त कर सकता हूं?

जवाबों:


174

आप एक कस्टम शैली बनाकर एक्शनबार (और अन्य सामान) के रंग को परिभाषित कर सकते हैं :

बस Res / मान / स्टाइल.xml को संपादित करें अपने Android प्रोजेक्ट फ़ाइल को ।

इस तरह के उदाहरण के लिए:

<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 की पृष्ठभूमि का रंग कैसे बदल सकता हूँ?


2
आपका क्या मतलब है "फिर" MyCustomTheme "को अपनी गतिविधि के थीम के रूप में सेट करें जिसमें ActionBar शामिल है।" मैं उसको कैसे करू?
काला जे।

2
अपनी गतिविधि XML में आपको <android.support.v4.view.ViewPager ... /> टैग
पेडरोड

2
क्या के बारे में शेष valuesv14 और valuesv21 स्टाइल। xml फ़ाइलें Android में
हर्ष

शीर्षक पाठ बदलने के बारे में कोई कैसे जानेगा?
एडम हर्विट्ज़

@KalaJ setTheme(R.style.MyCustomTheme) अपनी गतिविधि के onCreate विधि में उपयोग करें।
NullByte08

57

सामान्य रूप से एंड्रॉइड ओएस ऐप डेवलपर को वैश्विक गतिविधि के लिए यूआई तत्व स्टाइलिंग मापदंडों के एक सार्वभौमिक सेट को पूरी तरह से लागू करने की अनुमति देने के लिए एक "विषय" का लाभ उठाता है, या, वैकल्पिक रूप से, एकल गतिविधि उपवर्ग के लिए।

तो तीन मुख्य धाराएँ हैं Android OS "सिस्टम थीम", जिसे आप अपने Android Manifest XML फ़ाइल में निर्दिष्ट कर सकते हैं जब आप संस्करण 3.0 और बाद के संस्करणों के लिए एप्लिकेशन विकसित कर रहे हैं

मैं यहां (APPCOMPAT) समर्थन पुस्तकालय का उल्लेख कर रहा हूं: - इसलिए तीन विषय हैं 1. AppCompat Light Theme (Theme.AppCompat.Light)

यहाँ छवि विवरण दर्ज करें

  1. AppCompat डार्क थीम (Theme.AppCompat),

यहाँ छवि विवरण दर्ज करें

  1. और इन दोनों के बीच एक संकर, डार्क एक्शनबार के साथ AppCompat लाइट थीम। (Theme.AppCompat.Light.DarkActionBar)

AndroidManifest.xml और टैग देखें, Android थीम का उल्लेख इस प्रकार है: - android: theme = "@ style / Apphemia"

Styles.xml खोलें और हमारे पास वहां पर बेस एप्लीकेशन थीम घोषित है: -

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

हमें कार्रवाई पट्टी को स्टाइल करने के लिए इन मूल विषय तत्वों को ओवरराइड करने की आवश्यकता है।

अलग रंग की पृष्ठभूमि के साथ ActionBar: -

ऐसा करने के लिए हमें @ style / Widget.AppCompat.Light.ActionBar.Solid.Inverse के लिए एक नई शैली MyActionBar (आप किसी भी नाम दे सकते हैं) बनाने की आवश्यकता है जो AndroidBar UI तत्व के लिए शैली विशेषताओं को रखती है। तो परिभाषा होगी

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

और यह परिभाषा हमें अपने AppTheme में संदर्भित करने की आवश्यकता है, जो ओवरराइड एक्शनबार स्टाइल को इंगित करता है -

@ शैली / MyActionBar ActionBar गुलाबी पृष्ठभूमि रंग के साथ

शीर्षक बार टेक्स्ट का रंग बदलें (जैसे काले से सफेद): -

अब शीर्षक पाठ का रंग बदलने के लिए, हमें मूल संदर्भ जनक = "@ शैली / TextAppearance.AppCompat.Widget.ActionBar.Title" को ओवरराइड करना होगा

तो शैली की परिभाषा होगी

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

हम इस शैली की परिभाषा को MyActionBar शैली की परिभाषा के अंदर संदर्भ देंगे , क्योंकि TitleTextStyle संशोधन एक ActionBar मूल OS UI तत्व का एक बच्चा तत्व है। तो 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 सफेद शीर्षक रंग के साथ आगे ActionBar विकल्प मेनू स्टाइल के लिए, इस लिंक को देखें


2
अरे यार यह काम कर गया। एक संदेह है कि अगर मैं मेनू ओवरफ्लो आइकन का रंग बदलना चाहता हूं, तो यह हमारे विषय के अनुसार रंग बदलता है? डार्क थीम के लिए व्हाइट आइकन और लाइट थीम के लिए डार्क आइकन, मैं इसे सफेद में कैसे बदल सकता हूं? अपने उत्तर में अंतिम छवि पर विचार करें।
अमीन महेन

33

केवल एंड्रॉइड 3.0 और उच्चतर के लिए

केवल एंड्रॉइड 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>

फिर अपने पूरे ऐप या व्यक्तिगत गतिविधियों के लिए अपनी थीम लागू करें:

अधिक जानकारी के लिए documentaion


यह अजीब है: आप 2.1 की तुलना में एंड्रॉइड 3.0 और उच्चतर पुरानी शैली (होलो) देते हैं और उच्च (मटेरियल डिज़ाइन / एपकोम्पैट) ...
Roel

@DalvikVM Yes..Appcompat पुराने संस्करणों के लिए है। उच्च संस्करणों के लिए इसका उपयोग करने की कोई आवश्यकता नहीं है। इस उत्तर सामग्री के समय में डिज़ाइन डिज़ाइन नहीं किया गया था।
केतन अहीर

मुझे एक त्रुटि मिल रही है: समस्या No resource found that matches the given name '@style/Widget.Holo.Light.ActionBar.Solid.Inverse'.को android:style/Widget.Holo.Light.ActionBar.Solid.Inverseहल करने के लिए इसे बदलना । धन्यवाद।
एनी लागंग

@ शैली / Theme.AppCompat.Light.DarkActionBar कठबोली को मेरे मामले में हल किया जा सकता है (Android Studio) - क्या यह @android नहीं होना चाहिए: style / Theme.AppCompat.Light.DarkActionBar - यानी स्टाइल से पहले "पूर्वनिर्मित" android "के साथ?
AgentKnopf

32

आप इस तरह से एक्शन बार का रंग बदल सकते हैं:

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

यहाँ डेवलपर एंड्रॉइड साइट से स्क्रीनशॉट लिया गया है ताकि इसे और अधिक स्पष्ट किया जा सके, और यहां रंग पैलेट को कस्टमाइज़ करने के बारे में अधिक पढ़ने के लिए लिंक दिया गया है

यहाँ छवि विवरण दर्ज करें



5

मैं टाइटलरक्लोर का उपयोग करके एक्शनबेर टेक्स्ट का रंग बदल सकता हूं

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="titleTextColor">#333333</item>
</style>

3

कस्टम रंग:

 <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


2

जैसा कि मैं उपयोग कर रहा था AppCompatActivity ऊपर जवाब मेरे लिए काम नहीं किया। लेकिन नीचे दिए गए समाधान ने काम किया:

में रेस / 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


1

इस कोड को स्टाइल में जोड़ें

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

0

इसे इस्तेमाल करो - http://jgilfelt.github.io/android-actionbarstylegenerator/

अपने टूलबार को कुछ मिनटों में लाइव पूर्वावलोकन के साथ अनुकूलित करने के लिए अच्छा उपकरण।


1
हालांकि यह लिंक प्रश्न का उत्तर दे सकता है, लेकिन उत्तर के आवश्यक भागों को शामिल करना और संदर्भ के लिए लिंक प्रदान करना बेहतर है। लिंक-केवल उत्तर अमान्य हो सकते हैं यदि लिंक किए गए पृष्ठ बदल जाते हैं।
रोमन मर्सिक
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.