Set the TabLayout indicator. Creating a Round Round Tab Indicator?

I want to make only the Tab tab roundcorner, not the whole tab. I tried setting up a custom view, but that didn't help me. Any help would be greatly appreciated. Thanks

+4
source share
2 answers

You can use this CircularIndicatorTabLayout library.

Installation

  • You can download the aar library file from here
  • Move round-idicator-tab-layout-1.0.0.aar to / libs application
  • Add repositories { flatDir { dirs 'libs' } } build.gradle file of the project
  • In the application build.gradle file add compile(name: 'circular-idicator-tab-layout-1.0.0', ext: 'aar')

Example

  • In your layout file add

     <np.com.ngimasherpa.citablayout.CircularIndicatorTabLayout android:id="@+id/tab_monitoring_criteria" android:layout_width="match_parent" android:layout_height="@dimen/spacing_72" app:iconColor="@color/colorPrimaryDark" app:indicatorColor="@color/colorAccent" app:indicatorPosition="bottom" app:lineColor="@android:color/holo_red_dark" app:lineEnabled="true" app:mode="fixed" app:selectedIconColor="@color/colorAccent" app:tabViewIconId="@+id/iconTabViewLayout" app:tabViewLayoutId="@layout/tab_layout" app:tabViewTextViewColor="@color/colorPrimaryDark" app:tabViewTextViewId="@+id/textTabViewLayout" app:tabViewTextViewSelectedColor="@color/colorAccent" app:tab_gravity="fill" /> 
  • In your java file

     SectionPagerAdapter mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager()); ViewPager mViewPager = (ViewPager) findViewById(R.id.container); CircularIndicatorTabLayout tabLayout = (CircularIndicatorTabLayout) findViewById(R.id.tab_monitoring_criteria); mViewPager.setAdapter(mSectionsPagerAdapter); tabLayout.setupWithViewPager(mViewPager); tabLayout.setIcons(R.drawable.ic_arrow_drop_down, R.drawable.ic_audiotrack, R.drawable.ic_beach); 
0
source

In support library 28 you can use app:tabIndicator to set your app:tabIndicator form.

So you can do the following:

Create your own shape indicator with a rounded corner, and in addition to this, you can set the field to the left, right and bottom of the figure so that the rounding is more correct (so that the indicator does not touch the edges of the screen or view).

 <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item android:end="2dp" android:start="2dp" android:bottom="2dp"> <shape android:shape="rectangle"> <corners android:radius="20dp" /> <solid android:color="@color/colorAccent" /> </shape> </item> </layer-list> 

Then in your TabLayout xml set app:tabIndicator="@drawable/shape_tab_indicator"

You can also set app:tabIndicatorFullWidth="false" instead of the field set for the form element.

0
source

Source: https://habr.com/ru/post/1264436/


All Articles