반응형
디자인 지원 라이브러리의 TabLayout에서 탭 간 구분선을 설정하는 방법은 무엇입니까?
나는 새로운 사용하고 android.support.design.widget.TabLayout의 v7-appcompat가있는 경우 라이브러리를하고 문제를 발견, 탭 사이의 구분선을 설정하는 방법이 없습니다, 잘 모릅니다.
호출기 어댑터를 성공적으로 구성했으며 탭이 좋아 보이지만 탭 사이에 구분선을 설정할 수 없습니다.
이 유형의 탭을 원합니다
Tab1 | Tab2 | Tab3
하지만 현재는
Tab1 Tab2 Tab3
내 XML은
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" >
<include layout="@layout/toolbar" />
<android.support.design.widget.TabLayout
android:id="@+id/tablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/shape_tabbar_background"
app:tabIndicatorColor="@android:color/white"
app:tabIndicatorHeight="4dp" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
이것으로 탭을 추가하고 있습니다
viewPager = (ViewPager) findViewById(R.id.viewpager);
viewPager.setOffscreenPageLimit(2);
adapter = new TabAdapterLoginActivity(getSupportFragmentManager(),
titles);
viewPager.setAdapter(adapter);
tabLayout = (TabLayout) findViewById(R.id.tablayout);
tabLayout.setupWithViewPager(viewPager);
TabsetCustomView 메서드 를 사용하여 구분선을 추가하는 방법이 있습니다 .
TabLayout tabLayout = (TabLayout) findViewById(R.id.tablayout);
tabLayout.setupWithViewPager(viewPager);
for (int i = 0; i < tabLayout.getTabCount(); i++) {
TabLayout.Tab tab = tabLayout.getTabAt(i);
RelativeLayout relativeLayout = (RelativeLayout)
LayoutInflater.from(this).inflate(R.layout.tab_layout, tabLayout, false);
TextView tabTextView = (TextView) relativeLayout.findViewById(R.id.tab_title);
tabTextView.setText(tab.getText());
tab.setCustomView(relativeLayout);
tab.select();
}
구분선이있는 탭 사용자 지정 레이아웃 (tab_layout.xml) :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- Tab title -->
<TextView
android:id="@+id/tab_title"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textColor="@drawable/tab_item_selector"/>
<!-- Tab divider -->
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:background="@android:color/black" />
</RelativeLayout>
TabLayout 탭 가로 패딩을 0dp다음과 같이 설정합니다 .
<android.support.design.widget.TabLayout
android:id="@+id/tablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/shape_tabbar_background"
app:tabIndicatorColor="@android:color/white"
app:tabIndicatorHeight="4dp"
app:tabPaddingStart="0dp"
app:tabPaddingEnd="0dp" />
탭 제목 텍스트 색상 선택기 (tab_item_selector.xml) :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:color="@color/abc_primary_text_material_dark" />
<item android:state_focused="true" android:color="@color/abc_primary_text_material_dark" />
<item android:state_pressed="true" android:color="@color/abc_primary_text_material_dark" />
<item android:color="@color/abc_secondary_text_material_dark" />
</selector>
TabLayout사실 HorizontalScrollView이고 첫 번째 아이입니다 LinearLayout.
따라서 아래 코드를 사용하여 구분선을 추가하십시오.
View root = tabLayout.getChildAt(0);
if (root instanceof LinearLayout) {
((LinearLayout) root).setShowDividers(LinearLayout.SHOW_DIVIDER_MIDDLE);
GradientDrawable drawable = new GradientDrawable();
drawable.setColor(getResources().getColor(R.color.separator));
drawable.setSize(2, 1);
((LinearLayout) root).setDividerPadding(10);
((LinearLayout) root).setDividerDrawable(drawable);
}
아래는 샘플 스크린 샷입니다.
화면 1 
화면 2 
안녕하세요 당신은 내가 다음과 같이 한 해결 방법으로 이것을 시도 할 수 있습니다 :-
1- 일반 tablayout을 만듭니다.
2- 모드 MODE_FIXED 만들기
2-framellayout에 추가하고 그 위에 수평 레이아웃을 추가합니다.
3 가로 레이아웃의 버튼을 탭 수로 추가하고 각 버튼의 버튼 크기가 layout_wight = 1이되도록합니다.
4- 버튼 배경을 투명하게 만듭니다.
3- view 또는 anyview를 통해 수평 선형 레이아웃 레이아웃의 버튼 사이에 spertator를 추가하고 너비를 0.5dp 또는 원하는 두께로 지정하십시오.
4- 버튼에 대한 클릭을 추가하거나 클릭을 처리하지 않는 다른 뷰로 버튼을 변경할 수 있으므로 그 아래의 탭이 클릭 동작을 수행합니다 :).
추악한 해결책 일 수도 있지만 완벽하게 작동하고 작업을 수행합니다.
선택한 탭의 배경을 변경하려면 tablayout 스타일의 표시기 높이를 tablayout의 실제 높이와 같게 만들 수 있습니다.
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/transparent"
android:orientation="vertical">
<FrameLayout
android:id="@+id/content_parent"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="@android:color/transparent" />
<android.support.design.widget.TabLayout
android:id="@+id/sliding_tabs"
style="@style/MyCustomTabLayout"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_gravity="bottom"
android:background="#99888888"
android:clickable="false"
android:layoutDirection="rtl"
/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0.5dp"
android:layout_gravity="bottom"
android:layout_marginBottom="60dp"
android:background="#60ffffff"></LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="60dp"
android:layout_gravity="bottom|right"
android:background="@android:color/transparent"
android:orientation="horizontal">
<Button
android:id="@+id/button1"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_weight="1"
android:background="@android:color/transparent"
android:clickable="true" />
<LinearLayout
android:layout_width="0.5dp"
android:layout_height="60dp"
android:background="#60ffffff"></LinearLayout>
<Button
android:id="@+id/button2"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_weight="1"
android:background="@android:color/transparent"
android:clickable="true"
/>
<LinearLayout
android:layout_width="0.5dp"
android:layout_height="60dp"
android:background="#60ffffff"></LinearLayout>
<Button
android:id="@+id/button3"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_weight="1"
android:background="@android:color/transparent"
android:clickable="true"
/>
<LinearLayout
android:layout_width="0.5dp"
android:layout_height="60dp"
android:background="#60ffffff"></LinearLayout>
<Button
android:id="@+id/button4"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_weight="1"
android:background="@android:color/transparent"
android:clickable="true"
/>
<LinearLayout
android:layout_width="0.5dp"
android:layout_height="60dp"
android:background="#60ffffff"></LinearLayout>
<Button
android:id="@+id/button5"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_weight="1"
android:background="@android:color/transparent"
android:clickable="true"
/>
</LinearLayout>
</FrameLayout>
그리고 이것은 스타일입니다
<style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
<item name="tabIndicatorColor">#50000000</item>
<item name="tabTextAppearance">@style/MyCustomTabTextAppearance</item>
<item name="tabIndicatorHeight">60dp</item>
<item name="tabSelectedTextColor">#222222</item>
탭 생성 중에 customView를 지정하고 예를 들어 구분선을 추가하지 않는 한 가능하다고 생각하지 않습니다. TextView와 명시 적으로TextView.setCompoundDrawablesWithIntrinsicBounds(0, 0,(int)id_of_a_divider, 0);
당신이 그 첫 번째 경우 탐지하려고처럼 Tab,
if(firstTab){
tabLayout.getTabAt(0).getCustomView()
.setCompoundDrawablesWithIntrinsicBounds(0, 0,(int)id_of_a_divider, 0);
//some little casting
}else if(lastTab){
//dont get any
tabLayout.getTabAt(index).getCustomView()
.setCompoundDrawablesWithIntrinsicBounds(0,0,0, 0);
else{
//the rest takes two sides,
tabLayout.getTabAt(index).getCustomView()
.setCompoundDrawablesWithIntrinsicBounds((int)id_of_a_divider
, 0,(int)id_of_a_divider, 0);
나는 당신이 내 아이디어를 얻기를 바랍니다
최선은 아니지만 현재 사용하는 대체 방법입니다.
Main.Xml에서
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
style="@style/Base.Widget.Design.TabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/master_color"
app:elevation="0dp"
app:tabMode="scrollable"
app:tabPaddingEnd="2dp"
app:tabPaddingStart="0dp"
app:tabSelectedTextColor="@color/white"
app:tabTextColor="#82c6e6" />
나는 조각을 사용하여에서 할 수 있어요 onCreate()같은
if (savedInstanceState == null) {
replaceFragment(fragmentOne);
}
탭 설정
private void setupTabLayout () {
fragmentOne = new FragmentOne();
fragmentTwo = new FragmentTwo();
allTabs.addTab(allTabs.newTab().setText("CURRENT YEAR"), true);
allTabs.addTab(allTabs.newTab().setText("2015"));
allTabs.addTab(allTabs.newTab().setText("2014"));
allTabs.addTab(allTabs.newTab().setText("2013"));
allTabs.addTab(allTabs.newTab().setText("2012"));
allTabs.addTab(allTabs.newTab().setText("2011"));
//Hide Indicator
allTabs.setSelectedTabIndicatorColor(getResources().getColor(android.R.color.transparent));
//Set Custom tab Background
for (int i = 1; i < allTabs.getTabCount(); i++) {
TabLayout.Tab tab = allTabs.getTabAt(i);
RelativeLayout relativeLayout = (RelativeLayout)
LayoutInflater.from(getActivity()).inflate(R.layout.tab_layout, allTabs, false);
tvTabText = (TextView) relativeLayout.findViewById(R.id.tab_title);
View view = (View) relativeLayout.findViewById(R.id.deviderView);
tvTabText.setText(tab.getText());
tab.setCustomView(relativeLayout);
if (i == 0) {
view.setVisibility(View.GONE);
tab.select();
}
}
}
tab_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Tab title -->
<TextView
android:id="@+id/tab_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center_horizontal"
android:padding="10dp"
android:text="sdasd"
android:textColor="@drawable/tab_item_selector"
android:textSize="@dimen/text_size_normal"
android:textStyle="bold" />
<!-- Tab divider -->
<View
android:id="@+id/deviderView"
android:layout_width="1dp"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_marginBottom="15dp"
android:layout_marginTop="15dp"
android:background="@android:color/white"
android:gravity="right" />
</RelativeLayout>
tab_item_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:color="@android:color/white" />
<item android:state_focused="true" android:color="@android:color/white" />
<item android:state_pressed="true" android:color="@android:color/white" />
<item android:color="#82c6e6" />
</selector>
항상 선택적인 답변으로 고려하십시오.
이것을 시도해보십시오, 그것이 당신에게 잘 작동하기를 바랍니다.
tab_activity.xml
<TabHost
android:id="@android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TabWidget
android:id="@android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</TabWidget>
<View
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="@color/edt_footer_bg" />
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="15dp"
android:background="@android:color/transparent" >
</FrameLayout>
</LinearLayout>
</TabHost>
home_tab.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
xmlns:mytextview="http://schemas.android.com/apk/res/com.bne"
android:layout_height="50dp"
android:layout_marginRight="2dp"
android:background="@color/app_bg_inner"
android:gravity="center"
android:padding="10dp" >
<TextView
android:id="@+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@drawable/tab_selector"
android:textSize="@dimen/txt_12"
mytextview:txt_custom_font="@string/RobotoRegular" />
</LinearLayout>
이 코드를 사용하여 설정하십시오 divder.TabHost mTabHost.getTabWidget().setDividerDrawable(R.Color.blue);
사용자 지정 구분선을 추가하는 한 가지 방법은 프로그래밍 방식으로 설정하는 것입니다.
tablayout.getTabWidget().setDividerDrawable(R.drawable.yourdivider image name);
그러나 탭의 내용을 설정하기 전에 이것을 호출해야합니다. 나중에 전화하면 충돌 할 것입니다.
작동하지 않으면이 줄을 사용할 수도 있습니다.
if(Build.VERSION.SDK_INT >= 11)
tablayout.getTabWidget().setShowDividers(TabWidget.SHOW_DIVIDER_MIDDLE);
반응형
'IT Share you' 카테고리의 다른 글
| 예상되는 예외없이 테스트 (0) | 2020.12.03 |
|---|---|
| mongoDB의 문자열 필드 값 길이 (0) | 2020.12.03 |
| logcat 또는 예외없이 Android 앱이 충돌 함 (0) | 2020.12.03 |
| VS 코드 : .git 폴더 / 파일 숨김 (0) | 2020.12.03 |
| VIM에서 SPACE를 메이플 레이더로 사용할 수 있습니까? (0) | 2020.12.03 |