आइसक्रीम सैंडविच टैब के बीच विभाजक को कैसे शैलीबद्ध करें?

Question

मैं निम्नलिखित शैली एक साथ उपयोग कर रहा हूँ नौ पैच छवियों का एक सेट के साथ मानक नीली रेखा के बजाय कुछ आइस क्रीम सैंडविच टैब के निचले हिस्से पर एक लाल रेखा बनाने के लिए:

<style name="customTabStyle" parent="@android:style/Widget.Holo.ActionBar.TabBar"> 
    <item name="android:tabStripLeft">@null</item> 
    <item name="android:tabStripRight">@null</item> 
    <item name="android:tabStripEnabled">false</item> 
    <item name="android:showDividers">none</item> 
    <item name="android:measureWithLargestChild">true</item> 
    <item name="android:background">@drawable/tab_line</item> 
    <item name="android:gravity">center</item> 
</style> 

<style name="customTabBar" parent="@android:style/Widget.Holo"> 
    <item name="android:showDividers">middle</item> 
    <item name="android:divider">@drawable/divider2</item> 
    <item name="android:dividerPadding">0dp</item> 
</style> 

<style name="LightThemeSelector" parent="android:Theme.Holo.Light"> 
    <item name="android:actionBarTabStyle">@style/customTabStyle</item> 
    <item name="android:actionBarTabBarStyle">@style/customTabBar</item> 
</style> 

लाल रेखा दिखाया गया है और टैबिंग के बीच विभाजक को छोड़कर, हर चीज अच्छी लगती है। जैसा कि आप छवि में हरे रंग के बॉक्स के अंदर देख सकते हैं, रेखा विभाजक के नीचे नहीं खींची गई है। मैं इस विभक्त के लिए एक खींचने योग्य, या शैली का चयन कैसे करूं?

android:divider और android:showDividers आइटम टैब के बीच विभाजक के लिए ज़िम्मेदार नहीं हैं। वे केवल टैब आइकन और टैब शीर्षक के बीच खींचे गए विभक्त का चयन करते हैं। मैं उन डिवाइडर को छुपाता हूं क्योंकि कोई शीर्षक नहीं है और एक विभक्त अजीब दिखता है।

---

अद्यतन मन में मैं एक दूसरे शैली customTabBar जोड़ा Aneal से जवाब के साथ। शैली एक विभक्त के रूप में एक खींचने योग्य का चयन करता है। विभक्त एक ठोस काला 9patch निम्नलिखित drawable के साथ बनाया लाइन है:

इस drawable के साथ

विभक्त तैयार की है, लेकिन वहाँ भी एक रिक्त पंक्ति बगल में है:

Answer 1

हर शैली का उपयोग मैं मैं निम्न छवि मिला हटाने के बाद:

इस छवि को भी छोटे अंतराल होता है। इसलिए ऐसा लगता है कि यह किसी प्रकार का डिफ़ॉल्ट व्यवहार है।

हालांकि मुझे समस्या के आसपास काम करने का एक तरीका मिला। मैंने पूरे टैबबार के लिए मानक पृष्ठभूमि के रूप में रेडलाइन सेट की है। इस तरह अंतराल प्रकट होता है लेकिन कोई भी इसे देख नहीं सकता क्योंकि पृष्ठभूमि, जिसमें पहले से ही रेखा है, दिखाया गया है।

अब मैं अपने सभी गतिविधियों के लिए निम्नलिखित शैली का उपयोग करें:

<style name="customTabStyle" parent="@android:style/Widget.Holo.ActionBar.TabView"> 
    <item name="android:showDividers">none</item> 
    <item name="android:measureWithLargestChild">true</item> 
    <item name="android:background">@drawable/tab_line</item> 
    <item name="android:gravity">center</item> 
</style> 

पूरे tabBar मैं का उपयोग शैली के लिए:

<style name="LightThemeSelector" parent="android:Theme.Holo.Light"> 
    <item name="android:actionBarTabBarStyle">@style/customTabBar</item> 
    <item name="android:actionBarTabStyle">@style/customTabStyle</item> 
</style> 

यह शैली tabbar अंदर प्रत्येक एकल टैब शैली प्रयोग किया जाता है निम्नलिखित शैली:

<style name="customTabBar" parent="@android:style/Widget.Holo.ActionBar.TabBar"> 
    <item name="android:showDividers">middle</item> 
    <item name="android:divider">@drawable/divider</item> 
    <item name="android:dividerPadding">0dp</item> 
    <item name="android:background">@drawable/tab_unselected</item> 
</style> 

यह शैली मेरे कस्टम विभक्त को परिभाषित करती है और बीए को भी परिभाषित करती है टैबबार के लिए सीकेग्राउंड। पृष्ठभूमि के रूप में मैं सीधे 9 पैच को खींचने योग्य बनाता हूं जिसे खींचा जाता है यदि कोई टैब चयनित नहीं होता है। इसका परिणाम किसी भी अंतराल के बिना एक लाल रेखा के साथ एक टैबबार है।

Answer 2

यहां आप जाते हैं।

<style name="YourTheme" parent="@android:style/Theme.Holo.Light"> 
    <item name="android:actionBarTabBarStyle">@style/Divider</item> 
</style> 

<style name="Divider" parent="@android:style/Widget.Holo.ActionBar.TabBar"> 
    <item name="android:divider">@drawable/your_divider_drawable_here</item> 
    <item name="android:showDividers">middle</item> 
    <item name="android:dividerPadding">12dip</item> 
</style> 

Answer 3

यदि आप चाहें तो विभाजक से छुटकारा पाने के तुम सिर्फ ऐसा कर सकता है:

<style name="customTabBar" parent="@android:style/Widget.Holo.ActionBar.TabBar"> 
    <item name="android:divider">@null</item> 
</style> 

Answer 4

Btw। एंड्रॉइड के लिनरलाउट कक्षा कार्यान्वयन में आईसीएस में भारी बग के कारण यह होता है: विभाजक विशेषता। यह हनीकॉम में पेश किया गया था, आईसीएस में टूटा और जेली बीन में फिर से काम कर रहा था।

समस्या यह है कि जब आप एंड्रॉइड का उपयोग करते हैं: विभाजक यह जगह विभाजक के लिए बच्चे के बीच छोटी जगह बना देता है, लेकिन इस जगह में विभाजक नहीं रखता है, लेकिन इसके बाद, तो यह टैब द्वारा ही ओवरलैप हो जाएगा और स्थान खाली रहेगा । बहुत बेवकूफ बग। रिलीज 4.0 और 4.1 के लिए LinerLayout स्रोत कोड की तुलना करने का प्रयास करें।

और हाँ समाधान सभी टैब की पृष्ठभूमि में डेलीमीटर डाला गया है और यह केवल इस बग के कारण टैब के बीच अंतराल में दिखाई देगा।

Answer 5

ATom's answer के आधार पर, यहां सभी एंड्रॉइड संस्करणों में कुछ डिवाइडर के समान होने का एक तरीका है।

इस काम को करने के लिए, आप किसी मूल विभाजक विधियों का उपयोग नहीं करते हैं (क्योंकि वे कुछ संस्करणों में टूट जाते हैं)। किसी भी कोड को हटाने से मत भूलना जहां आप डिवाइडर सेट करते हैं।

चाल प्रत्येक टैब के लिए उपयोग किए गए विचारों में बस एक बहुत ही छोटा दायां मार्जिन सेट कर रही है। इस तरह, एक छोटा अंतर होगा जहां आप पृष्ठभूमि (टैबहोस्ट) देख सकते हैं। इसे समाप्त करने के लिए, आपने खिंचाव विभाजक की नकल करने के लिए टैबहोस्ट पर पृष्ठभूमि सेट की है।

हालांकि यह चाल उन सभी संभावित डिज़ाइनों के लिए काम नहीं करती है जो आप चाहें, यह मेरे जैसे कई मामलों के लिए अच्छी तरह से काम करता है।

@Override 
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { 

    // ... 
    //  inflate or create tabHost in code 
    //  call tabHost.setup 
    // ... 

    TabWidget tabWidget = tabHost.getTabWidget(); 
    tabWidget.setBackgroundResource(R.drawable.tab_divider); 

    // ... add tabs 

    for(int i = 0; tabWidget.getChildCount()-1; i++) { 
     View view = tabWidget.getChildAt(i); 
     LinearLayout.LayoutParams layoutParams = (LinearLayout.LayoutParams) view.getLayoutParams(); 
     layoutParams.rightMargin = getResources().getDimensionPixelSize(R.dimen.tab_divider_width); //1dp 
     view.setLayoutParams(layoutParams); 
    } 
    return tabHost; 
} 

यहां नमूने tab_divider drawable है:

यहां नमूने के कार्यान्वयन है

<?xml version="1.0" encoding="utf-8"?> 
<shape 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle"> 
     <solid android:color="@color/divider_color" /> 
     <stroke android:width="@dimen/tab_divider_vertical_padding" 
       android:color="@color/tab_background_color"/> 
</shape> 

Answer 6

<style name="AppTheme" parent="AppBaseTheme"> 
    <item>...... 
    </item> 
    <item name="android:actionBarDivider">@null</item> 

</style> 

यहाँ

@null किसी भी विभक्त प्रदान करने के लिए नहीं करने के लिए और अगर आप अपने को अनुकूलित करना चाहते हैं उपयोग करने से विभाजक @ drawable/your_divider_image