एक्शन बार विजेट को कस्टमाइज़ करना

यह लेख एंड्रॉइड-डेवलपर्स ब्लॉग से विषय का अनुवाद है। यह दिखाता है कि जिस तरह से आप चाहते हैं में एक्शन बार विजेट को कैसे स्टाइल करें। एक उदाहरण के रूप में, हम उपरोक्त ब्लॉग की सामान्य रंग योजना के लिए विजेट के डिजाइन में बदलाव पर विचार करते हैं।

एक्शन बार पैटर्न के आगमन के बाद से बहुत समय बीत चुका है, और कई डेवलपर्स पहले से ही अपने अनुप्रयोगों में इसे लागू कर चुके हैं। एंड्रॉइड 3.0 (हनीकॉम्ब) में, यह पैटर्न आमतौर पर एसडीके और समग्र नेविगेशन प्रतिमान का हिस्सा है। आम तौर पर स्वीकार किए गए नेविगेशन तत्व का उपयोग करना उपयोगकर्ता द्वारा कार्यक्रम के विकास को सरल करता है (क्योंकि वह सबसे अधिक संभावना है कि पहले से ही उसके साथ काम किया है), और डेवलपर को अपनी "बाइक" के साथ आने की आवश्यकता नहीं है। लेकिन जब से हर कोई एक ही पैटर्न का उपयोग करता है, तब, निश्चित रूप से, हर कोई अपने आवेदन के लिए इसे स्टाइल करता है। निम्न उदाहरण दिखाता है कि आवेदन के समग्र रूप / छवि के लिए एक्शन बार को कैसे स्टाइल किया जाए। हम एंड्रॉइड-डेवलपर्स ब्लॉग से मिलान करने के लिए डिफ़ॉल्ट Holo.Light थीम को बदल देंगे।

<style name="Theme.AndroidDevelopers" parent="android:style/Theme.Holo.Light"> … </style> 

आइकन

आप चयनित रंग योजना में आइकन बनाने के लिए Android Asset Studio का उपयोग कर सकते हैं। हम इस छवि का उपयोग लोगो के रूप में करेंगे।

नेविगेशन

इसके अलावा, नेविगेशन अनुभाग तीन अलग-अलग मोड में संचालित होता है। हम उन्हें बदले में विचार करेंगे।

मानक

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

सूची

बाईं ओर मानक ड्रॉप-डाउन सूची है, दाईं ओर वह प्रभाव है जिसकी हमें आवश्यकता है।



मानक सूची एक रंग योजना का उपयोग करती है जिसमें सियान हावी है। हमें जिस योजना की आवश्यकता है, उसे लागू करने के लिए, हम एंड्रॉइड को पुनः लोड करते हैं : ActionDropDownStyle

 <!--    --> <style name="MyDropDownNav" parent="android:style/Widget.Holo.Light.Spinner.DropDown.ActionBar"> <item name="android:background">@drawable/ad_spinner_background_holo_light</item> <item name="android:popupBackground">@drawable/ad_menu_dropdown_panel_holo_light</item> <item name="android:dropDownSelector">@drawable/ad_selectable_background</item> </style> 

यह xml- फाइल हाइलाइट, स्पिनर और टॉप बार को सजाने के लिए स्टेट-लिस्ट और नौ-पैच इमेज के संयोजन का उपयोग करती है ।

टैब

नीचे "पहले" और "बाद" टैब के डिजाइन के स्क्रीनशॉट हैं।



फिर से, मानक टैब थीम नीले रंग में हावी है। फिर से पंजीकृत करने के लिए, एंड्रॉइड पुनः लोड करें : ActionBarTabStyle ।

 <!--    --> <style name="MyActionBarTabStyle" parent="android:style/Widget.Holo.Light.ActionBarView_TabView"> <item name="android:background">@drawable/actionbar_tab_bg</item> <item name="android:paddingLeft">32dp</item> <item name="android:paddingRight">32dp</item> </style> 

क्रिया (क्रिया)

और फिर, "पहले" और "बाद"।


एक या किसी अन्य तत्व का चयन करते समय, इसे नीले रंग में हाइलाइट किया जाता है। बदलने के लिए, Android को पुनः लोड करें : selectableItemBackground ।

 <item name="android:selectableItemBackground">@drawable/ad_selectable_background</item> 

विस्तार करते समय, मेनू सूची के शीर्ष पर एक नीला आयत दिखाता है। बदलने के लिए, Android पुनः लोड करें : popupMenuStyle ।

 <!--    --> <style name="MyPopupMenu" parent="android:style/Widget.Holo.Light.ListPopupWindow"> <item name="android:popupBackground">@drawable/ad_menu_dropdown_panel_holo_light</item> </style> 

मेनू में चयनित वस्तुओं का रंग भी बदलें।

 <!--      --> <style name="MyDropDownListView" parent="android:style/Widget.Holo.ListView.DropDown"> <item name="android:listSelector">@drawable/ad_selectable_background</item> </style> 

इसके अलावा, आपको चेकबॉक्स और रेडियो बटन के डिज़ाइन को भी बदलना होगा।

 <item name="android:listChoiceIndicatorMultiple">@drawable/ad_btn_check_holo_light</item> <item name="android:listChoiceIndicatorSingle">@drawable/ad_btn_radio_holo_light</item> 

पृष्ठभूमि

सिद्धांत रूप में, आप पृष्ठभूमि भी बदल सकते हैं। डिफ़ॉल्ट रूप से, Holo.Light थीम में यह पारदर्शी है। बदलने के लिए, आपको Android को पुनः लोड करने की आवश्यकता है : ActionBarStyle ।

यह सब एक साथ रखना

सभी तत्वों को संयोजित करने के लिए, एक कस्टम शैली बनाएं।

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

अब आप सजावट की इस शैली को किसी भी गतिविधि या पूरे आवेदन पर लागू कर सकते हैं।

 <activity android:name=".MainActivity" android:label="@string/app_name" android:theme="@style/Theme.AndroidDevelopers" android:logo="@drawable/ad_logo"> 

यह नोट करना भी महत्वपूर्ण है कि कुछ शैलियों को हमने ओवरलोड किया है, जो सभी विजेट्स को प्रभावित करती हैं (उदाहरण के लिए, एंड्रॉइड: selectableItemBebground )। यही है, हम इस प्रकार पूरे एप्लिकेशन के डिज़ाइन को बदलते हैं, जो कि एक सामान्य शैली को बनाए रखने की कोशिश करने पर बहुत उपयोगी है।

अंत

नमूना स्रोत code.google.com पर लिया जा सकता है।