Giter VIP home page Giter VIP logo

tf-tabs-android's Introduction

tfTabs

Join the chat at https://gitter.im/tfKamran/tf-tabs-android

Download Build Status Codacy Badge Android Arsenal

A clone of ActionBarTabs in Android but is compatible with Toolbar

Screenshot

You may get this library by adding the following in the dependency section of your build.gradle file:

compile 'com.tf.library.tabs:tftabs:2.1.0'

Or you may copy the following files from the given example code into your project:

src/com.tf.library.tabs.Tab.java
src/com.tf.library.tabs.TabsHolder.java
res/layout/tab.xml

Add it in your layout xml file:

<com.tf.library.tabs.TabsHolder
    android:id="@+id/tabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/toolbar"
    app:backgroundColor="@color/toolbar_color"
    app:titleColor="@android:color/white"
    app:titleInactiveColor="@android:color/darker_gray"
    app:selectionColor="@color/accent_color"
    app:selectionVisible="true" />

Add a few lines in your activity code:

// Set up the tabs
tabsHolder = (TabsHolder) findViewById(R.id.tabs);
tabsHolder.setViewPager(mViewPager);

// Optionally setup the colors and properties programmatically
tabsHolder.setBackgroundColor(getResources().getColor(R.color.toolbar_color));
tabsHolder.setTitleColor(Color.WHITE);
tabsHolder.setTitleInactiveColor(Color.GRAY);
tabsHolder.setSelectionColor(getResources().getColor(R.color.accent_color));
tabsHolder.setSelectionVisible(true);

// When swiping between different sections, select the corresponding tab.
mViewPager.addOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
    @Override
    public void onPageSelected(int position) {
        tabsHolder.setCurrentTabIndex(position);
    }
});

And if you wish to have icons on your tabs:

public class SectionsPagerAdapter extends TabsPagerAdapter {

    public SectionsPagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Drawable getPageIcon(int position) {
        return getDrawable(R.drawable.ic_launcher);
    }

    @Override
    public Drawable getPageInactiveIcon(int position) {
        Drawable pageIcon = getDrawable(R.drawable.ic_launcher).mutate();

        pageIcon.setColorFilter(Color.BLUE, PorterDuff.Mode.MULTIPLY);

        return pageIcon;
    }

    ...

}

If you don't wish to have icons in the tabs, you may use any other derivatives of PagerAdapter.

And you're done!

Note: Before tabs.setViewPager(mViewPager); you must have your FragmentPagerAdapter in your ViewPager

Tags: #ActionBarTab, #Tabs, #Android, #Toolbar, #TabsLibrary

tf-tabs-android's People

Contributors

tfkamran avatar gitter-badger avatar

Watchers

James Cloos avatar Ranjan Kumar Singh avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.