Tablet 기기에서 탭이 전체 너비를 차지하지 않음 [안드로이드 사용]서포트.디자인.위젯탭 레이아웃]
이번 게시물에는 업데이트 29/05/2015로 설정된 탭이 있습니다.내 Nexus 4 모바일에서는 탭이 전체 너비를 차지하지만 Nexus 7 태블릿에서는 중앙에 있고 전체 화면 너비를 포함하지 않습니다.
넥서스 7 스크린샷 넥서스 4 스크린샷
Kaizie에서 빌린 "더 간단한" 대답은 단지 추가하는 것입니다.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), 즉 두 개 이상의 탭(동적 탭)이 필요한 경우
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);
}
}
탭이 전체 너비를 차지하도록 하려면(같은 크기로 분할) 다음을 적용합니다.TabLayout
보기:
TabLayout tabLayout = (TabLayout) findViewById(R.id.your_tab_layout);
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
tabLayout.setTabMode(TabLayout.MODE_FIXED);
<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: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:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"/>
스크롤 가능한 솔루션(Kotlin)
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) {
tabLayout.tabMode= TabLayout.MODE_SCROLLABLE
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
}
}
그냥 이것을 하고 매력적으로 일했습니다.
<com.google.android.material.tabs.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabMaxWidth="0dp"/>
아래 코드에서 해결 방법을 확인하십시오.
다음은 레이아웃 코드입니다.
<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" />
동적 탭 카운트의 경우 setTabNumbers(탭 카운트)를 호출하는 것을 잊지 마십시오.
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-dependible-layout-programmatically-8146d6101efe에서 가져온 참조.
왜 그렇게 정신없이 일을 하는 거지?app:tabMode="scrollable"
XML의 TabLayout에 있습니다. 이상입니다.
이 문제의 변형에서는 태블릿에서 전체 너비를 차지하지 않는 중간 크기의 탭이 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"
모든 공간을 채우다
언급URL : https://stackoverflow.com/questions/30843775/tab-not-taking-full-width-on-tablet-device-using-android-support-design-widget
'programing' 카테고리의 다른 글
RecyclerView 및 java.lang.Index Out Of Bounds 예외:불일치가 탐지되었습니다.잘못된 뷰 홀더 어댑터 위치View삼성 장치의 홀더 (0) | 2023.08.13 |
---|---|
온도 변수나 산술 연산을 사용하지 않고 두 개의 숫자를 교환하는 방법은 무엇입니까? (0) | 2023.08.13 |
Jquery 날짜 선택기 z 인덱스 문제 (0) | 2023.08.13 |
PowerShell로 빈 하위 폴더를 삭제하는 방법은 무엇입니까? (0) | 2023.08.13 |
라벨 마이그레이션 파일에 열이 있는지 확인 (0) | 2023.08.13 |