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

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

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

包含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="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

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值