使用RecyclerView实现的一个高效Tab布局库:RecyclerTabLayout

jopen 9年前

使用RecyclerView实现的一个高效Tab布局库

特性

  • Efficient when having many tabs
  • Easy setup with ViewPager (same as TabLayout of Android Design Support Library)

示例

Years

Loop

Basic

Icon

用法

DefineRecyclerTabLayoutin xml layout with custom attributes.

<com.nshmura.recyclertablayout.RecyclerTabLayout          android:id="@+id/recycler_tab_layout"          android:layout_width="match_parent"          android:layout_height="48dp"          rtl_tabIndicatorColor="?attr/colorAccent"          rtl_tabIndicatorHeight="2dp"          rtl_tabBackground="?attr/selectableItemBackground"          rtl_tabTextAppearance="@android:style/TextAppearance.Small"          rtl_tabSelectedTextColor="?android:textColorPrimary"          rtl_tabMinWidth="72dp"          rtl_tabMaxWidth="264dp"          rtl_tabPaddingStart="12dp"          rtl_tabPaddingTop="0dp"          rtl_tabPaddingEnd="12dp"          rtl_tabPaddingBottom="0dp"          rtl_tabPadding="0dp"/>

Set up with the ViewPager.
ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);  viewPager.setAdapter(adapter);    RecyclerTabLayout recyclerTabLayout = (RecyclerTabLayout) findViewById(R.id.recycler_tab_layout);  recyclerTabLayout.setUpWithViewPager(viewPager);

Or set up with ViewPager and Custom RecyclerView.Adapter that's extendsRecyclerTabLayout.Adapter.
ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);  viewPager.setAdapter(adapter);    RecyclerTabLayout recyclerTabLayout = (RecyclerTabLayout) findViewById(R.id.recycler_tab_layout);  recyclerTabLayout.setUpWithAdapter(new CustomRecyclerViewAdapter(viewPager));

Here's sample of custom RecyclerView adapter.

public class CustomRecyclerViewAdapter extends RecyclerTabLayout.Adapter<CustomRecyclerViewAdapter.ViewHolder> {        public DemoCustomView01Adapter(ViewPager viewPager) {          super(viewPager);          ...      }        @Override      public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {          // Inflate your view.          View view = ...;          return new ViewHolder(view);      }        @Override      public void onBindViewHolder(ViewHolder holder, int position) {          // Bind data          ...            if (position == getCurrentIndicatorPosition()) {              //Highlight view          }      }        public class ViewHolder extends RecyclerView.ViewHolder {          ...            public ViewHolder(View itemView) {              super(itemView);          ...          }      }  }

属性

attr description
rtl_tabIndicatorColor Indicator color
rtl_tabIndicatorHeight Indicator height
rtl_tabBackground Background drawable of each tab
rtl_tabTextAppearance TextAppearence of each tab
rtl_tabSelectedTextColor Text color of selected tab
rtl_tabMinWidth Minimum width of each tab
rtl_tabMaxWidth Maximum width of each tab
rtl_tabPaddingStart The padding of the start edge of each tab
rtl_tabPaddingTop The padding of the top edge of each tab
rtl_tabPaddingEnd The padding of the end edge of each tab
rtl_tabPaddingBottom The padding of the bottom edge of each tab
rtl_tabPadding The padding of all four edges of each tab

default attribute

下载

Download via Gradle:

repositories {      jcenter()  }    dependencies {     compile 'com.nshmura:recyclertablayout:0.1.1'  }

资源

Demo app uses the following resources.

color-names by codebrainz
https://github.com/codebrainz/color-names

Material Design icons by Google
https://github.com/google/material-design-icons


项目主页:
http://www.open-open.com/lib/view/home/1438933260411