इस पोस्ट के रूप में मेरे पास 29/05/2015 का सेटअप टैब है । टैब मेरे नेक्सस 4 मोबाइल पर पूरी चौड़ाई लेता है लेकिन नेक्सस 7 टैबलेट पर यह केंद्र में है और पूरी स्क्रीन की चौड़ाई को कवर नहीं करता है।
नेक्सस 7 स्क्रीनशॉट नेक्सस 4 स्क्रीनशॉट
इस पोस्ट के रूप में मेरे पास 29/05/2015 का सेटअप टैब है । टैब मेरे नेक्सस 4 मोबाइल पर पूरी चौड़ाई लेता है लेकिन नेक्सस 7 टैबलेट पर यह केंद्र में है और पूरी स्क्रीन की चौड़ाई को कवर नहीं करता है।
नेक्सस 7 स्क्रीनशॉट नेक्सस 4 स्क्रीनशॉट
जवाबों:
काज़ी से उधार लिया गया एक "सरल" उत्तर सिर्फ app:tabMaxWidth="0dp"
आपके TabLayout
xml में जोड़ना होगा :
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMaxWidth="0dp"
app:tabGravity="fill"
app:tabMode="fixed" />
मेरे पास एक ही समस्या थी और मैंने TabLayout शैली की जाँच की, और मैंने पाया कि इसकी डिफ़ॉल्ट शैली Widget.Design.TabLayout
अलग कार्यान्वयन (सामान्य, परिदृश्य और sw600dp) है।
जो हमें चाहिए वह टैबलेट (sw600dp) के लिए एक है जिसमें निम्नलिखित कार्यान्वयन हैं:
<style name="Widget.Design.TabLayout" parent="Base.Widget.Design.TabLayout">
<item name="tabGravity">center</item>
<item name="tabMode">fixed</item>
</style>
इस शैली से हम " फिल " का उपयोग करते हुए " टैबगैविटी " (जो संभव मान "केंद्र" या "भरण") का उपयोग करेंगे।
लेकिन हमें और गहराई में जाने की जरूरत है, और फिर हम देखते हैं कि यह एक से है Base.Widget.Design.TabLayout
, जो कार्यान्वयन है:
<style name="Base.Widget.Design.TabLayout" parent="android:Widget">
<item name="tabMaxWidth">@dimen/tab_max_width</item>
<item name="tabIndicatorColor">?attr/colorAccent</item>
<item name="tabIndicatorHeight">2dp</item>
<item name="tabPaddingStart">12dp</item>
<item name="tabPaddingEnd">12dp</item>
<item name="tabBackground">?attr/selectableItemBackground</item>
<item name="tabTextAppearance">@style/TextAppearance.Design.Tab</item>
<item name="tabSelectedTextColor">?android:textColorPrimary</item>
</style>
तो, इस शैली से हमें " tabMaxWidth " को ओवरराइड करना होगा । मेरे मामले में मैंने इसे निर्धारित किया है 0dp
, इसलिए इसकी कोई सीमा नहीं है।
और मेरी शैली इस तरह दिखी:
<style name="MyTabLayout" parent="Widget.Design.TabLayout">
<item name="tabGravity">fill</item>
<item name="tabMaxWidth">0dp</item>
</style>
और फिर टैब बार पूरे स्क्रीन को साइड से भर देगा।
स्क्रॉल करने योग्य के लिए समाधान: (TabLayout.MODE_SCROLLABLE), वह यह है कि कभी भी आपको 2 से अधिक टैब (डायनेमिक टैब) की आवश्यकता होती है
चरण 1: style.xml
<style name="tabCustomStyle" parent="Widget.Design.TabLayout">
<item name="tabGravity">fill</item>
<item name="tabMaxWidth">0dp</item>
<item name="tabIndicatorColor">#FFFEEFC4</item>
<item name="tabIndicatorHeight">2dp</item>
<item name="tabTextAppearance">@style/MyCustomTabTextAppearance</item>
<item name="tabSelectedTextColor">#FFFEEFC4</item>
</style>
<style name="MyCustomTabTextAppearance" parent="TextAppearance.Design.Tab">
<item name="android:textSize">@dimen/tab_text_size</item>
<item name="android:textAppearance">@style/TextAppearance.roboto_medium</item>
<item name="textAllCaps">true</item>
</style>
<style name="TextAppearance.roboto_medium" parent="android:TextAppearance">
<item name="android:fontFamily">sans-serif-medium</item>
</style>
चरण 2: आपका xml लेआउट
<android.support.design.widget.TabLayout
android:id="@+id/sliding_tabs"
style="@style/tabCustomStyle"
android:layout_width="match_parent"
android:layout_height="@dimen/tab_strip_height"
android:background="@color/your_color"
app:tabMode="scrollable"
app:tabTextColor="@color/your_color" />
चरण 3: अपनी गतिविधि / परिश्रम में जहाँ कभी आपके पास टैब हैं।
/**
* To allow equal width for each tab, while (TabLayout.MODE_SCROLLABLE)
*/
private void allotEachTabWithEqualWidth() {
ViewGroup slidingTabStrip = (ViewGroup) mTabLayout.getChildAt(0);
for (int i = 0; i < mTabLayout.getTabCount(); i++) {
View tab = slidingTabStrip.getChildAt(i);
LinearLayout.LayoutParams layoutParams = (LinearLayout.LayoutParams) tab.getLayoutParams();
layoutParams.weight = 1;
tab.setLayoutParams(layoutParams);
}
}
addTab
प्रत्येक टैब के लिए वजन डाला और सेट किया क्योंकि यह जोड़ा गया था। override fun addTab(tab: Tab, position: Int, setSelected: Boolean) { super.addTab(tab, position, setSelected) allotEachTabWithEqualWidth() }
टैब को पूरी चौड़ाई (समान आकार में विभाजित करने) के लिए बाध्य करने के लिए, निम्नलिखित को TabLayout
देखने के लिए लागू करें :
TabLayout tabLayout = (TabLayout) findViewById(R.id.your_tab_layout);
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
tabLayout.setTabMode(TabLayout.MODE_FIXED);
TabLayout
सेट होने पर काम नहीं करता है app:tabMode=“scrollable”
, इसके परिणामस्वरूप टैब निश्चित लंबाई (लंबे शब्द लपेटेंगे) बनेंगे और टैब अब स्लाइड नहीं करेंगे, अनिवार्य रूप से टैब को फिर से "निश्चित" बना देंगे।
यह मददगार है जिसे आपको अवश्य आजमाना चाहिए
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMaxWidth="0dp"
app:tabGravity="fill"
app:tabMode="fixed"
app:tabIndicatorColor="@color/white"
app:tabSelectedTextColor="@color/white"
app:tabTextColor="@color/orange" />
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMaxWidth="0dp"
app:tabGravity="fill"
app:tabMode="fixed" />
मेरे लिए काम। यह भी हैxmlns:app="http://schemas.android.com/apk/res-auto"
मेरे लिए निम्न कोड काम किया और पर्याप्त था।
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"/>
समाधान के लिए नीचे दिए गए कोड की जाँच करें।
नीचे लेआउट कोड है:
<com.yourpackage.CustomTabLayout
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="@color/off_white"
app:tabIndicatorColor="@color/primaryColor"
app:tabIndicatorHeight="3dp"
app:tabMode="scrollable"
app:tabPaddingEnd="0dp"
app:tabPaddingStart="0dp" />
ध्यान दें, डायनेमिक टैब काउंट के लिए, सेटटैबनेट्स (टैबकाउंट) को कॉल करना न भूलें।
import android.content.Context;
import android.support.design.widget.TabLayout;
import android.util.AttributeSet;
import android.util.
import java.lang.reflect.Field;
public class CustomTabLayout extends TabLayout
{
private static final int WIDTH_INDEX = 0;
private int DIVIDER_FACTOR = 3;
private static final String SCROLLABLE_TAB_MIN_WIDTH = "mScrollableTabMinWidth";
public CustomTabLayout(Context context) {
super(context);
initTabMinWidth();
}
public CustomTabLayout(Context context, AttributeSet attrs) {
super(context, attrs);
initTabMinWidth();
}
public CustomTabLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
initTabMinWidth();
}
public void setTabNumbers(int num)
{
this.DIVIDER_FACTOR = num;
initTabMinWidth();
}
private void initTabMinWidth()
{
int[] wh = getScreenSize(getContext());
int tabMinWidth = wh[WIDTH_INDEX] / DIVIDER_FACTOR;
Log.v("CUSTOM TAB LAYOUT", "SCREEN WIDTH = " + wh[WIDTH_INDEX] + " && tabTotalWidth = " + (tabMinWidth*DIVIDER_FACTOR) + " && TotalTabs = " + DIVIDER_FACTOR);
Field field;
try {
field = TabLayout.class.getDeclaredField(SCROLLABLE_TAB_MIN_WIDTH);
field.setAccessible(true);
field.set(this, tabMinWidth);
} catch (NoSuchFieldException e) {
e.printStackTrace();
} catch (Exception e) {
e.printStackTrace();
}
}
private static final int WIDTH_INDEX = 0;
private static final int HEIGHT_INDEX = 1;
public static int[] getScreenSize(Context context) {
int[] widthHeight = new int[2];
widthHeight[WIDTH_INDEX] = 0;
widthHeight[HEIGHT_INDEX] = 0;
try {
WindowManager windowManager = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
Display display = windowManager.getDefaultDisplay();
Point size = new Point();
display.getSize(size);
widthHeight[WIDTH_INDEX] = size.x;
widthHeight[HEIGHT_INDEX] = size.y;
if (!isScreenSizeRetrieved(widthHeight))
{
DisplayMetrics metrics = new DisplayMetrics();
display.getMetrics(metrics);
widthHeight[0] = metrics.widthPixels;
widthHeight[1] = metrics.heightPixels;
}
// Last defense. Use deprecated API that was introduced in lower than API 13
if (!isScreenSizeRetrieved(widthHeight)) {
widthHeight[0] = display.getWidth(); // deprecated
widthHeight[1] = display.getHeight(); // deprecated
}
} catch (Exception e) {
e.printStackTrace();
}
return widthHeight;
}
private static boolean isScreenSizeRetrieved(int[] widthHeight) {
return widthHeight[WIDTH_INDEX] != 0 && widthHeight[HEIGHT_INDEX] != 0;
}
}
संदर्भ https://medium.com/@elsenovraditya/set-tab-minimum-width-of-scrollable-tablayout-programmatically-8146d6101efe से लिया गया
स्क्रॉल करने योग्य (कोटलिन) के लिए समाधान
Xml में:
<com.google.android.material.tabs.TabLayout
android:id="@+id/home_tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMaxWidth="0dp"
app:tabMode="scrollable"
android:fillViewport="true"
app:tabGravity="fill" />
कोटलिन में:
मेरे मामले में अगर 3 टैब से कम है तो मैं बराबर जगह आवंटित करता हूं।
नोट: यदि शर्त आपकी आवश्यकता के अनुसार है
if(list.size <= 3){
allotEachTabWithEqualWidth(your_tab_layout)
}
fun allotEachTabWithEqualWidth(tabLayout: TabLayout) {
mTabLayout.tabMode= TabLayout.MODE_FIXED
val slidingTabStrip = tabLayout.getChildAt(0) as ViewGroup
for (i in 0 until tabLayout.getTabCount()) {
val tab = slidingTabStrip.getChildAt(i)
val layoutParams = tab.layoutParams as LinearLayout.LayoutParams
layoutParams.weight = 1f
tab.layoutParams = layoutParams
}
}
tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
इसके अलावा यह टैबलैटआउट के लिए सेट करने के लिए एक संपत्ति है। यह कभी मायने नहीं रखता है कि आप कितने टैब को स्थिर या गतिशील जोड़ रहे हैं।
इस समस्या के मेरे संस्करण में, मेरे पास मध्यम आकार के 3 टैब थे जो गोलियों पर पूरी चौड़ाई नहीं ले रहे थे। मुझे टैबलेट पर स्क्रॉल करने की आवश्यकता नहीं थी, क्योंकि टैबलेट बिना किसी स्क्रॉलिंग के सभी टैब को एक साथ प्रदर्शित करने के लिए पर्याप्त हैं। लेकिन मुझे फोन पर स्क्रॉल करने की आवश्यकता थी, क्योंकि सभी टैब को एक साथ प्रदर्शित करने के लिए फोन बहुत छोटे हैं।
मेरे मामले में सबसे अच्छा समाधान एक res/layout-sw600dp/main_activity.xml
फ़ाइल को जोड़ना था , जहां प्रासंगिक टैबलैटआउट हो सकता है app:tabGravity="fill"
और app:tabMode="fixed"
। लेकिन मेरे नियमित रूप से res/layout/main_activity.xml
, मैंने छोड़ दिया app:tabGravity="fill"
और app:tabMode="fixed"
, और इसके app:tabMode="scrollable"
बजाय था ।
कृपया ध्यान दें कि आपको भी सेट करने की आवश्यकता है
app:tabPaddingStart="-1dp"
app:tabPaddingEnd="-1dp"
सभी स्थान भरने के लिए