ViewPager + Fragment 制造类似底部导航栏

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical">    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="main"        android:textSize="40sp"/></LinearLayout>

package com.example.zps.xuxian2.tab;import android.support.v4.app.Fragment;import android.os.Bundle;import android.support.annotation.Nullable;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import com.example.zps.xuxian2.R;/** * Created by zps on 2015/9/8. */public class MainFragment extends Fragment{//注意 Fragment 包是V4包

    @Nullable    @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {        return inflater.inflate(R.layout.tab_main_fragment,container,false);    }}

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical">    <android.support.v4.view.ViewPager        android:id="@+id/tab_main_viewpager"        android:layout_width="match_parent"        android:layout_height="0dp"        android:layout_weight="1" />    <include layout="@layout/tab_buttom" /></LinearLayout>

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="wrap_content"    android:orientation="horizontal">    <LinearLayout        android:id="@+id/id_tab_main"        android:layout_width="0dp"        android:layout_height="match_parent"        android:layout_weight="1"        android:gravity="center"        android:orientation="vertical">        <ImageButton            android:id="@+id/tab_main_icon_grey"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:background="#00000000"            android:clickable="false"            android:src="@drawable/tab_main_icon_grey" />        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="主页"            android:textColor="#000000" />    </LinearLayout>    <LinearLayout        android:id="@+id/id_tab_community"        android:layout_width="0dp"        android:layout_height="fill_parent"        android:layout_weight="1"        android:gravity="center"        android:orientation="vertical">        <ImageButton            android:id="@+id/tab_community_icon_grey"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:background="#00000000"            android:clickable="false"            android:src="@drawable/tab_community_icon_grey" />        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="附近"            android:textColor="#000000" />    </LinearLayout>    <LinearLayout        android:id="@+id/id_tab_shopping"        android:layout_width="0dp"        android:layout_height="fill_parent"        android:layout_weight="1"        android:gravity="center"        android:orientation="vertical">        <ImageButton            android:id="@+id/tab_shopping_cart_icon_grey"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:background="#00000000"            android:clickable="false"            android:src="@drawable/tab_shopping_cart_icon_grey" />        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="购物"            android:textColor="#000000" />    </LinearLayout>    <LinearLayout        android:id="@+id/id_tab_me"        android:layout_width="0dp"        android:layout_height="fill_parent"        android:layout_weight="1"        android:gravity="center"        android:orientation="vertical">        <ImageButton            android:id="@+id/tab_me_icon_grey"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:background="#00000000"            android:clickable="false"            android:src="@drawable/tab_me_icon_grey" />        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="个人"            android:textColor="#000000" />    </LinearLayout></LinearLayout>

package com.example.zps.xuxian2.tab;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentPagerAdapter;import java.util.List;/** * Created by zps on 2015/9/8. */public class TabFragmentPagerAdapter extends FragmentPagerAdapter{  //继承FragmentPagerAdapter类 ,并自定义的构造器  private List<Fragment> fragments;    public TabFragmentPagerAdapter(FragmentManager fm,List<Fragment> fragments) {        super(fm);        this.fragments =fragments;    }    @Override    public Fragment getItem(int position) {        return fragments.get(position);    }    @Override    public int getCount() {        return fragments.size();    }}

package com.example.zps.xuxian2.tab;import android.app.Activity;import android.os.Bundle;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentActivity;import android.support.v4.app.FragmentPagerAdapter;import android.support.v4.view.ViewPager;import android.util.Log;import android.view.View;import android.view.Window;import android.widget.ImageButton;import android.widget.ImageView;import android.widget.LinearLayout;import com.example.zps.xuxian2.R;import java.nio.IntBuffer;import java.util.ArrayList;import java.util.List;/** * Created by zps on 2015/9/8. */public class TabMainActivity extends FragmentActivity implements View.OnClickListener {//注意是继承FragmentActivity!!我找了半天的错误        private LinearLayout mTabMain;    private LinearLayout mTabCommunity;    private LinearLayout mTabShopping;    private LinearLayout mTabMe;    private ImageButton mImageTabMain;    private ImageButton mImageTabCommunity;    private ImageButton mImageTabShopping;    private ImageButton mImageTabMe;    private ViewPager mViewPager;    private TabFragmentPagerAdapter mAdapter;    private List<Fragment> mFragments;        @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        requestWindowFeature(Window.FEATURE_NO_TITLE);        setContentView(R.layout.tab_main_viewpager);        initView();        initClickListener();    }        private void initView() {        mViewPager = (ViewPager) findViewById(R.id.tab_main_viewpager);        mTabMain = (LinearLayout) findViewById(R.id.id_tab_main);        mTabCommunity = (LinearLayout) findViewById(R.id.id_tab_community);        mTabShopping = (LinearLayout) findViewById(R.id.id_tab_shopping);        mTabMe = (LinearLayout) findViewById(R.id.id_tab_me);        mImageTabMain = (ImageButton) findViewById(R.id.tab_main_icon_grey);        mImageTabCommunity = (ImageButton) findViewById(R.id.tab_community_icon_grey);        mImageTabShopping = (ImageButton) findViewById(R.id.tab_shopping_cart_icon_grey);        mImageTabMe = (ImageButton) findViewById(R.id.tab_me_icon_grey);        mFragments = new ArrayList<Fragment>();        Fragment mTab_01 = new MainFragment();        Fragment mTab_02 = new CommunityFragment();        Fragment mTab_03 = new ShoppingFragment();        Fragment mTab_04 = new MeFragment();        mFragments.add(mTab_01);        mFragments.add(mTab_02);        mFragments.add(mTab_03);        mFragments.add(mTab_04);        mAdapter = new TabFragmentPagerAdapter(getSupportFragmentManager(), mFragments);        mViewPager.setAdapter(mAdapter);//设置滑动监听器        mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {            @Override            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {            }//滑动时 改变图标状态            @Override            public void onPageSelected(int position) {                int currentItem = mViewPager.getCurrentItem();                initTabImage();                switch (currentItem) {                    case 0:                        mImageTabMain.setImageResource(R.drawable.tab_main_icon_green);                        break;                    case 1:                        mImageTabCommunity.setImageResource(R.drawable.tab_community_icon_green);                        break;                    case 2:                        mImageTabShopping.setImageResource(R.drawable.tab_shopping_cart_icon_green);                        break;                    case 3:                        mImageTabMe.setImageResource(R.drawable.tab_me_icon_green);                        break;                }            }            @Override            public void onPageScrollStateChanged(int state) {            }        });    }//初始的图标状态(滑动和点击事件改变的时候都要初始化)    private void initTabImage() {        mImageTabMain.setImageResource(R.drawable.tab_main_icon_grey);        mImageTabCommunity.setImageResource(R.drawable.tab_community_icon_grey);        mImageTabShopping.setImageResource(R.drawable.tab_shopping_cart_icon_grey);        mImageTabMe.setImageResource(R.drawable.tab_me_icon_grey);    }    //设置图标点击监听器    private void initClickListener() {        mTabMain.setOnClickListener(this);        mTabCommunity.setOnClickListener(this);        mTabShopping.setOnClickListener(this);        mTabMe.setOnClickListener(this);    }    @Override    public void onClick(View v) {        switch (v.getId()) {            case R.id.id_tab_main:                // initTabImage();                //mImageTabMain.setImageResource(R.drawable.tab_main_icon_green);                //注意上面修改的只是图标的状态,还要修改相对应的fragment;                setSelect(0);                break;            case R.id.id_tab_community:                setSelect(1);                break;            case R.id.id_tab_shopping:                setSelect(2);                break;            case R.id.id_tab_me:                setSelect(3);                break;        }    }//设置将点击的那个图标为亮色,切换内容区域    private void setSelect(int i) {               initTabImage();        switch (i) {            case 0:                mImageTabMain.setImageResource(R.drawable.tab_main_icon_green);                break;            case 1:                mImageTabCommunity.setImageResource(R.drawable.tab_community_icon_green);                break;            case 2:                mImageTabShopping.setImageResource(R.drawable.tab_shopping_cart_icon_green);                break;            case 3:                mImageTabMe.setImageResource(R.drawable.tab_me_icon_green);                break;            default:                break;        }        mViewPager.setCurrentItem(i);    }}