astuetz / PagerSlidingTabStrip

An interactive indicator to navigate between the different pages of a ViewPager
139 stars 44 forks source link

Add Icons instead of Text #150

Open alexinthi opened 9 years ago

alexinthi commented 9 years ago

Is there anyway I can add Icons to tabs? Like Facebook tabs. Without text?

sanderversluys commented 9 years ago

That's already possible with the IconTabProvider interface.

Check QuickContactFragment in sample code.

sam-ghosh commented 9 years ago

Is there a way of doing this using the FragmentPagerAdapter instead of PagerAdapter in the code?

sam-ghosh commented 9 years ago

Also, I tried seeing the code in the sample QuickContactFragment. Seems like there are two interfaces that are used that are in package com.astuetz.viewpager.extensions.PagerSlidingTabStrip which I can't see when I use the followning in gradle as per Readme:

compile 'com.astuetz:pagerslidingtabstrip:1.0.1'

In Sample

import com.astuetz.viewpager.extensions.PagerSlidingTabStrip;

public class ContactPagerAdapter extends PagerAdapter implements PagerSlidingTabStrip.TabBackgroundProvider, PagerSlidingTabStrip.TabCustomViewProvider {
theBlbDan commented 9 years ago

@somghosh

I am using it with a SherlockFragment and FragmentStatePagerAdapter

My layout is a relative layout with the tabs and view pager.

<?xml version="1.0" encoding="utf-8"?>  
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <com.astuetz.PagerSlidingTabStrip
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="48dip"
        android:background="@drawable/background_tabs" />

    <android.support.v4.view.ViewPager
        android:id="@+id/quicknav_pager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/tabs" />
</RelativeLayout>

In your fragment's onCreateView(), inflate your viewpager, set up your adapter, set up your tabs

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    View v = inflater.inflate(R.layout.quicknav_pager, null);
    ViewPager mViewPager = (ViewPager) v.findViewById(R.id.quicknav_pager);

    // It is critical that you use getChildFragmentManager() here
    // since the pager fragments will be children of the main fragment
    ManageBiblesPagerAdapter mViewPagerAdapter = new ManageBiblesPagerAdapter(getChildFragmentManager());
    mViewPager.setAdapter(mViewPagerAdapter);

    // Bind the tabs to the ViewPager
    PagerSlidingTabStrip tabs = (PagerSlidingTabStrip) v.findViewById(R.id.tabs);
    tabs.setShouldExpand(true);
    tabs.setViewPager(mViewPager);

    return v;
}

/*
 * Set up the ViewPager
 * There will be three unique fragments to invoke
 * Page 0:  InstalledBiblesFragment.java
 * Page 1:  ParallelBiblesFragment.java
 * Page 2:  DownloadBiblesFragment.java
 */
public static class ManageBiblesPagerAdapter extends FragmentStatePagerAdapter {

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

    @Override
    public Fragment getItem(int position) {
        Fragment fragment;

        switch(position) {
            case 2:
                fragment = new DownloadBiblesFragment();
                break;
            case 1:
                fragment = new ParallelBiblesFragment();
                break;
            case 0:
            default:
                fragment = new InstalledBiblesFragment();
        };
        return fragment;
    }

    @Override
    public int getCount() {
        return 3;
    }

    @Override
    public CharSequence getPageTitle(int position) {
            return new String[] {
                "Primary",
                "Parallel",
                "Download"
            }[position];
    }
}