Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

"swipey tabs" for android.support.v4.view.ViewPager

branch: master
README.md

ViewPagerTabs

An implementation of the swipey tabs for the ViewPager from the Android Support Package

ViewPagerTabs Screenshots

IMPORTANT

Please note that this repository is no longer maintained. Look at my ViewPagerExtensions project (especially SwipeyTabsView) for a better implementation of this view.

Usage

For an example of how to use this, see android-viewpagertabs-example

  1. Including In Your Project

    This is an Android library project, you can include it by referencing it as a library project in
    Eclipse or ant.
    
    This project depends on the `ViewPager` class which is available in the Android Support Package.
    *IMPORTANT* Make sure to use the latest version of the Support Package!
    
  2. Include com.astuetz.viewpagertabs.ViewPagerTabs in your view.

    <com.astuetz.viewpagertabs.ViewPagerTabs
       android:id="@+id/tabs"
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"
       android:background="#FF3B3B3B" />
    

    If you want to add a colored line below the tabs, use something like this:

     <View
        android:layout_width="fill_parent"
        android:layout_height="2dip"
        android:background="#FF91A438" />
    

    And then your ViewPager:

     <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />
    
  3. In your Activity, bind the ViewPager to the ViewPagerTabs in the onCreate method.

     // Set the pager with an adapter
     ViewPager pager = (ViewPager) findViewById(R.id.pager);
     pager.setAdapter(new ExampleAdapter(this));
    
     // Bind the ViewPager to ViewPagerTabs
     ViewPagerTabs tabs = (ViewPagerTabs) findViewById(R.id.tabs);
     tabs.setViewPager(pager);
    

    Note: The adapter of the ViewPager has to implement ViewPagerTabProvider.

Styling

You can customize the tabs either by xml-attributes or by setter-methods:

  1. Customize by XML-attributes:

    <com.astuetz.viewpagertabs.ViewPagerTabs
        android:id="@+id/tabs"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        app:backgroundColorPressed="#55333E73"
        app:textColor="#D8D8D8" 
        app:textColorCenter="#FFFC7F" 
        app:lineColorCenter="#FFFC7F"
        app:lineHeight="4dip"
        app:tabPaddingLeft="15dip"
        app:tabPaddingRight="15dip"
        app:tabPaddingBottom="2dip"
        app:tabPaddingTop="5dip"
        app:textSize="12sp" />
    

    Note: Don't forget to define the namespace: xmlns:app="http://schemas.android.com/apk/res/your.package.name"

  2. Customize by setter-methods:

    ViewPagerTabs tabs = (ViewPagerTabs) findViewById(R.id.tabs);
    
    tabs.setBackgroundColor(0x00FFFFFF);
    tabs.setBackgroundColorPressed(0x33333333);
    tabs.setTextColor(0x44A80000);
    tabs.setTextColorCenter(0xFFA80000);
    tabs.setLineColorCenter(0xFFA80000);
    tabs.setLineHeight(5);
    tabs.setTextSize(22);
    tabs.setTabPadding(5, 1, 5, 10);
    

Developed By

License

Copyright 2011 Andreas Stuetz

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
Something went wrong with that request. Please try again.