Fragment ViewPager的例子代码

ViewPager保存状态的。

MyViewPager：

package com.example.mypopuwindow;

import android.app.Activity;
import android.app.ActivityManager;
import android.net.Uri;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.view.ViewPager;
import android.util.DisplayMetrics;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.LinearInterpolator;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TextView;

import com.example.mypopuwindow.fragment.GroupListFragment;
import com.example.mypopuwindow.fragment.MyKPIFragment;
import com.example.mypopuwindow.fragment.my3;
import com.example.mypopuwindow.fragment.my4;

/**
* Created by 陈猛 on 2016/1/15.
*/
public class MyViewPager extends FragmentActivity implements View.OnClickListener,ViewPager.OnPageChangeListener {
/**
* 会话TextView
*/
private TextView mMainConversationTv;
/**
* 群组TextView
*/
private TextView mMainGroupTv;

private TextView mUnreadNumView;
/**
* 聊天室TextView
*/
private TextView mMainChatroomTv;
/**
* 客服TextView
*/
private TextView mMainCustomerTv;

private FragmentManager mFragmentManager;

private ViewPager mViewPager;
/**
* 下划线
*/
private ImageView mMainSelectImg;

private LayoutInflater mInflater;
/**
* 下划线长度
*/
int indicatorWidth;
private LinearLayout mMainShow;
private TextView mCustomerNoRead;
private DemoFragmentPagerAdapter mDemoFragmentPagerAdapter;
private RelativeLayout mMainConversationLiner;
private RelativeLayout mMainGroupLiner;
private RelativeLayout mMainChatroomLiner;
private RelativeLayout mMainCustomerLiner;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.my_vieewpager);

DisplayMetrics dm = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm); // 获取屏幕信息
indicatorWidth = dm.widthPixels / 4;// 指示器宽度为屏幕宽度的4/1

mMainShow = (LinearLayout) findViewById(R.id.main_show);
mMainConversationLiner = (RelativeLayout) findViewById(R.id.main_conversation_liner);
mMainGroupLiner = (RelativeLayout) findViewById(R.id.main_group_liner);
mMainChatroomLiner = (RelativeLayout) findViewById(R.id.main_chatroom_liner);
mMainCustomerLiner = (RelativeLayout) findViewById(R.id.main_customer_liner);
mMainConversationTv = (TextView) findViewById(R.id.main_conversation_tv);
mMainGroupTv = (TextView) findViewById(R.id.main_group_tv);
mMainChatroomTv = (TextView) findViewById(R.id.main_chatroom_tv);
mMainCustomerTv = (TextView) findViewById(R.id.main_customer_tv);
mViewPager = (ViewPager) findViewById(R.id.main_viewpager);
mMainSelectImg = (ImageView) findViewById(R.id.main_switch_img);

ViewGroup.LayoutParams cursor_Params = mMainSelectImg.getLayoutParams();
cursor_Params.width = indicatorWidth;// 初始化滑动下标的宽
mMainSelectImg.setLayoutParams(cursor_Params);
// 获取布局填充器
mInflater = (LayoutInflater) this
.getSystemService(LAYOUT_INFLATER_SERVICE);

//        activityManager = (ActivityManager) this.getSystemService(ACTIVITY_SERVICE);
mMainChatroomLiner.setOnClickListener(this);
mMainConversationLiner.setOnClickListener(this);
mMainGroupLiner.setOnClickListener(this);
mMainCustomerLiner.setOnClickListener(this);
mDemoFragmentPagerAdapter = new DemoFragmentPagerAdapter(getSupportFragmentManager());
mViewPager.setAdapter(mDemoFragmentPagerAdapter);
mViewPager.setOnPageChangeListener(this);
mViewPager.setOffscreenPageLimit(4);//设置缓存的个数

}

@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.main_conversation_liner:
mViewPager.setCurrentItem(0);
break;
case R.id.main_group_liner:
mViewPager.setCurrentItem(1);
break;
case R.id.main_chatroom_liner:
mViewPager.setCurrentItem(2);
break;
case R.id.main_customer_liner:
mViewPager.setCurrentItem(3);
break;
}
}

@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

}

@Override
public void onPageSelected(int position) {
switch (position) {
case 0:
selectNavSelection(0);
break;
case 1:
selectNavSelection(1);
break;
case 2:
selectNavSelection(2);
break;
case 3:
selectNavSelection(3);
break;
}
}

private void selectNavSelection(int index) {
clearSelection();
switch (index) {
case 0:
mMainConversationTv.setTextColor(getResources().getColor(R.color.de_title_bg));
TranslateAnimation animation = new TranslateAnimation(0, 0,
0f, 0f);
animation.setInterpolator(new LinearInterpolator());
animation.setDuration(10000);
animation.setFillAfter(true);
mMainSelectImg.startAnimation(animation);

break;
case 1:
mMainGroupTv.setTextColor(getResources().getColor(R.color.de_title_bg));
TranslateAnimation animation1 = new TranslateAnimation(
indicatorWidth, indicatorWidth,
0f, 0f);
animation1.setInterpolator(new LinearInterpolator());
animation1.setDuration(10000);
animation1.setFillAfter(true);
mMainSelectImg.startAnimation(animation1);

break;
case 2:
mMainChatroomTv.setTextColor(getResources().getColor(R.color.de_title_bg));
TranslateAnimation animation2 = new TranslateAnimation(
2 * indicatorWidth, indicatorWidth * 2,
0f, 0f);
animation2.setInterpolator(new LinearInterpolator());
animation2.setDuration(10000);
animation2.setFillAfter(true);
mMainSelectImg.startAnimation(animation2);

break;
case 3:
mMainCustomerTv.setTextColor(getResources().getColor(R.color.de_title_bg));
TranslateAnimation animation3 = new TranslateAnimation(
3 * indicatorWidth, indicatorWidth * 3,
0f, 0f);
animation3.setInterpolator(new LinearInterpolator());
animation3.setDuration(10000);
animation3.setFillAfter(true);
mMainSelectImg.startAnimation(animation3);
break;
}
}

private void clearSelection() {
mMainConversationTv.setTextColor(getResources().getColor(R.color.black_textview));
mMainGroupTv.setTextColor(getResources().getColor(R.color.black_textview));
mMainChatroomTv.setTextColor(getResources().getColor(R.color.black_textview));
mMainCustomerTv.setTextColor(getResources().getColor(R.color.black_textview));
}
@Override
public void onPageScrollStateChanged(int state) {

}

private class DemoFragmentPagerAdapter extends android.support.v4.app.FragmentPagerAdapter {

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

@Override
public Fragment getItem(int i) {
Fragment fragment = null;

switch (i) {
case 0:
mMainConversationTv.setTextColor(getResources().getColor(R.color.de_title_bg));
//TODO
if (mMyKPIFragment == null) {

fragment = new MyKPIFragment();
}

break;
case 1:
if (mGroupListFragment == null) {
mGroupListFragment = new GroupListFragment();//群组的Fragment
}

fragment = mGroupListFragment;

break;

case 2:
if (my3 == null) {
fragment = new my3();
} else {
fragment = my3;
}
break;
case 3:
if (my4 == null) {
fragment = new my4();
} else {
fragment = my4;
}
break;
}
return fragment;
}

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

private MyKPIFragment mMyKPIFragment;
private my3  my3;
private my4  my4;
private GroupListFragment mGroupListFragment;

}

这里的关键代码是：

mViewPager.setOffscreenPageLimit(4);//设置缓存的个数

其布局文件为：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main_show"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="39dp"
android:background="@color/group_list_liner">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="38dp"
android:layout_alignParentTop="true"
android:background="@color/main_title_backgroud"
android:orientation="horizontal">

<RelativeLayout
android:id="@+id/main_conversation_liner"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal">

<TextView
android:id="@+id/main_conversation_tv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="@string/main_conversation"
android:textColor="@color/black_textview"

android:textSize="16sp" />

</RelativeLayout>

<RelativeLayout
android:id="@+id/main_group_liner"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal">

<TextView
android:id="@+id/main_group_tv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="@string/main_group"
android:textColor="@color/black_textview"
android:textSize="16sp" />

</RelativeLayout>

<RelativeLayout
android:id="@+id/main_chatroom_liner"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal">

<TextView
android:id="@+id/main_chatroom_tv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="@string/main_chatroom"
android:textColor="@color/black_textview"
android:textSize="16sp" />

</RelativeLayout>

<RelativeLayout
android:id="@+id/main_customer_liner"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal">

<TextView
android:id="@+id/main_customer_tv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="@string/main_customer"
android:textColor="@color/black_textview"
android:textSize="16sp" />

</RelativeLayout>

</LinearLayout>

<ImageView
android:id="@+id/main_switch_img"
style="@style/DemoMainPublic" />

</RelativeLayout>

<android.support.v4.view.ViewPager
android:id="@+id/main_viewpager"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:flipInterval="30"
android:persistentDrawingCache="animation" />

</LinearLayout>

string:

<resources>
<string name="app_name">MyPopuWindow</string>
<string name="action_settings">Settings</string>

<string name="pop_left">弹出左侧菜单</string>
<string name="pop_right">弹出右侧菜单</string>
<string name="pop_bottom">弹出底部菜单</string>
<string name="open">打开</string>
<string name="save">保存</string>
<string name="close">关闭</string>

<string name="main_name">融云</string>
<string name="main_conversation">会话</string>
<string name="main_group">群组</string>
<string name="main_chatroom">聊天室</string>
<string name="main_customer">讨论组</string>
<string name="add_chat">发起聊天</string>
<string name="add_select_group">选择群组</string>
<string name="add_voip">网络电话</string>
<string name="add_contacts">通讯录</string>
<string name="set_personal_information">我的账号</string>
<string name="set_news_reminded">新消息提醒</string>
<string name="set_privacy">隐私</string>
<string name="set_set">设置</string>
<string name="set_rongcloud">关于融云</string>
<string name="set_sign_out">退出</string>
<string name="set_logout">注销</string>
<string name="de_save">"保存"</string>

<string name="register_user_exits">"该邮箱已注册"</string>
<string name="no_read_message">"···"</string>

</resources>

style:

<resources>

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
</style>

<style name="AnimationLeftFade">
<item name="android:windowEnterAnimation">@anim/in_lefttoright</item>
<item name="android:windowExitAnimation">@anim/out_righttoleft</item>
</style>

<style name="AnimationRightFade">
<item name="android:windowEnterAnimation">@anim/in_righttoleft</item>
<item name="android:windowExitAnimation">@anim/out_lefttoright</item>
</style>

<style name="AnimationBottomFade">
<item name="android:windowEnterAnimation">@anim/in_bottomtotop</item>
<item name="android:windowExitAnimation">@anim/out_toptobottom</item>
</style>

<style name="DemoMainPublic">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">4dp</item>
<item name="android:layout_alignParentBottom">true</item>
<item name="android:background">@color/de_title_bg</item>
</style>

</resources>

color:

<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- -->
<color name="black_textview">#575757</color>
<color name="group_list_black_textview">#353535</color>
<color name="group_list_gray">#999999</color>
<color name="group_list_liner">#e4e4e4</color>
<color name="main_title_backgroud">#F2F2F2</color>
<color name="main_regist">#ffffff</color>
<color name="main_backgroud_search">#f7f7f7</color>
<color name="button_backgroud">#0195ff</color>
<color name="de_title_bg">#0195ff</color>

<color name="rc_text_color_secondary_inverse">@android:color/white</color>
<color name="rc_text_color_select_btn_disable">#97d9b3</color>

<!--actionbar-->
<color name="de_actionbar_bg">#0195ff</color>
<!---->
<color name="de_item_select">#f3f3f3</color>
<color name="de_action_color">#3498DB</color>
<color name="de_action_white">@android:color/white</color>
<color name="de_transparent">#00000000</color>

<color name="de_draft_color">#cb120f</color>
</resources>

Fragment的代码就不写了，没有什么特别之处。

效果图：