最新的TabLayout实现tab功能代替viewPagerIndicator。

以前都用 viewPagerIndicator,现在无需用第三方了，Google提供的TabLayout完全可以实现。

先看看效果 不包含toolBar直接去掉即可

包含toolBar



toolBar的搜索功能：



不包含toolBar

老规矩添加依赖：

dependencies {
compile 'com.android.support:design:22.2.0'
}

MainActivity 内容

package com.liucheng.toolbardemo;

import android.os.Bundle;

import android.support.design.widget.TabLayout;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentManager;

import android.support.v4.app.FragmentStatePagerAdapter;

import android.support.v4.view.MenuItemCompat;

import android.support.v4.view.ViewPager;

import android.support.v7.app.AppCompatActivity;

import android.support.v7.widget.Toolbar;

import android.view.Menu;

import android.view.MenuItem;

import android.widget.Toast;

import com.liucheng.toolbardemo.fragment.FirstFragment;

import com.liucheng.toolbardemo.fragment.SecondFragment;

import com.liucheng.toolbardemo.fragment.ThirdFragment;

public class MainActivity extends AppCompatActivity {

private Toolbar toolbar;

private TabLayout tabLayout;

private ViewPager viewPager;

private PagerAdapter adapter;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) this.findViewById(R.id.toolBar);
tabLayout = (TabLayout) this.findViewById(R.id.tabLayout);

// tabLayout.setTabMode(TabLayout.MODE_FIXED);  当tab很多时也只在一屏显示
// tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);当tab很多时可以滚diong
tabLayout.addTab(tabLayout.newTab().setText("Tab 1"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 2"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 3"));
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
viewPager = (ViewPager) findViewById(R.id.viewpager);
adapter = new PagerAdapter(getSupportFragmentManager(), tabLayout.getTabCount());
viewPager.setAdapter(adapter);
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
viewPager.setCurrentItem(tab.getPosition());
}

@Override
public void onTabUnselected(TabLayout.Tab tab) {

}

@Override
public void onTabReselected(TabLayout.Tab tab) {

}
});
toolbar.setTitle("ToolBar");

setSupportActionBar(toolbar);
//有些语句得写在setSupportActionBar 之后才有效果
toolbar.setNavigationIcon(R.drawable.navigation);
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem menuItem) {
int id = menuItem.getItemId();
String msg = "";
switch (id) {
case R.id.action_search:
msg = "action_search";
break;
case R.id.action_intent:
msg = "action_intent";
//这个地方要注意使用这种方式增加actionprovider不然会报错
MenuItemCompat.setActionProvider(menuItem, new MyActionProvider(MainActivity.this));
break;
default:
break;

}
Toast.makeText(MainActivity.this, msg, Toast.LENGTH_SHORT).show();

return false;
}
});
}

class PagerAdapter extends FragmentStatePagerAdapter {

int numOfTabs;

public PagerAdapter(FragmentManager fm, int numOfTabs) {
super(fm);
this.numOfTabs = numOfTabs;
}

@Override
public Fragment getItem(int position) {

switch (position) {
case 0:
FirstFragment tab1 = new FirstFragment();
return tab1;
case 1:
SecondFragment tab2 = new SecondFragment();
return tab2;
case 2:
ThirdFragment tab3 = new ThirdFragment();
return tab3;
default:
return null;
}
}

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

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.menu_toolbar, menu);
return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
return super.onOptionsItemSelected(item);
}
}

注意事项：

// tabLayout.setTabMode(TabLayout.MODE_FIXED); 当tab很多时也只在一屏显示

// tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);当tab很多时可以滚diong

布局文件

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".MainActivity">

<android.support.v7.widget.Toolbar
android:id="@+id/toolBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
app:tabIndicatorColor="#ffffff"
android:layout_below="@id/toolBar"
app:tabTextColor="#00ff00"
app:tabSelectedTextColor="#ff0000"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary">

</android.support.design.widget.TabLayout>

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

注意事项：可以自定义颜色

app:tabIndicatorColor="#ffffff“      横线颜色
app:tabTextColor="#00ff00"             未选择文字颜色
app:tabSelectedTextColor="#ff0000"  选择文字颜色

注意清单文件Application节点的theme一定要禁用actionBar

<?xml version="1.0" encoding="utf-8"?>
<manifest package="com.liucheng.toolbardemo"
xmlns:android="http://schemas.android.com/apk/res/android">

<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN"/>

<category android:name="android.intent.category.LAUNCHER"/>
</intent-filter>
</activity>
</application>

</manifest>

AppTheme文件

<resources>

<style name="AppTheme" parent="AppBaseTheme">
</style>

<style name="AppBaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
<item name="android:windowNoTitle">true</item>
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="
4000
colorAccent">@color/colorPrimaryDark</item>
<item name="actionMenuTextColor">@color/white</item>
<item name="android:textColorPrimary">@color/black</item>
<item name="android:windowBackground">@color/white</item>
</style>

参考：

http://www.cnblogs.com/punkisnotdead/p/4736844.html

http://www.bkjia.com/Androidjc/1040009.html

具体请下载源码:

http://download.csdn.net/detail/liucheng61214/9631735