之前用的ViewPager適用于簡單的廣告切換,但實現頁面間的切換最好是用官方推薦的Fragment來處理.

本人力爭做到最簡單、最有用,是想以后用到的時候能夠方便的拿過來復制就能夠了.

效果圖：

? ? ?? ?

功能:可點擊button切換頁面,也可滑動界面切換頁面.

文件:java文件5個、xml文件4個、.9圖片4張

java主類:

<span style="font-size:12px;">package com.example.viewpageractivity;import android.os.Bundle; import android.support.v4.app.FragmentActivity; import android.support.v4.view.ViewPager; import android.support.v4.view.ViewPager.OnPageChangeListener; import android.view.View; import android.widget.Button;public class MainActivity extends FragmentActivity {public ViewPager mViewPager;public Button bt_myclass_studing;public Button bt_myclass_over;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);//調用封裝好的actionbarBuildingActionBar.setActionBarLayout(R.layout.actionbar, MainActivity.this);bt_myclass_studing = (Button)this.findViewById(R.id.id_myclass_button_studing);bt_myclass_over = (Button)this.findViewById(R.id.id_myclass_button_over);bt_myclass_studing.setText("正在進行");bt_myclass_over.setText("已結課");bt_myclass_studing.setOnClickListener(new myButtonListener());bt_myclass_over.setOnClickListener(new myButtonListener());//構建適配器FragmenAdapter mFragmenAdapter = new FragmenAdapter(this.getSupportFragmentManager());mViewPager = (ViewPager)this.findViewById(R.id.id_myclass_viewpager);mViewPager.setAdapter(mFragmenAdapter);//加入滑動監聽mViewPager.setOnPageChangeListener(new OnPageChangeListener(){@Overridepublic void onPageScrollStateChanged(int arg0) {}@Overridepublic void onPageScrolled(int arg0, float arg1, int arg2) {}@Overridepublic void onPageSelected(int arg0) {switch(arg0){case 0:setButtonColor(true);break;case 1:setButtonColor(false);break;}}});setButtonColor(true);}/*** 設置按鈕背景色* 附上色值* liteblue : #a1dff8* */public void setButtonColor(boolean myTouchButton) {if (myTouchButton == true) {//當點擊左邊按鈕的點擊效果bt_myclass_studing.setBackgroundResource(R.drawable.title_switch_left_on);bt_myclass_studing.setTextColor(getResources().getColor(R.color.white));bt_myclass_over.setBackgroundResource(R.drawable.title_switch_right_off);bt_myclass_over.setTextColor(getResources().getColor(R.color.liteblue));mViewPager.setCurrentItem(0, true);} else {//當點擊右邊按鈕的點擊效果bt_myclass_over.setBackgroundResource(R.drawable.title_switch_right_on);bt_myclass_over.setTextColor(getResources().getColor(R.color.white));bt_myclass_studing.setBackgroundResource(R.drawable.title_switch_left_off);bt_myclass_studing.setTextColor(getResources().getColor(R.color.liteblue));mViewPager.setCurrentItem(1, true);}}/*** 按鈕的監聽* */class myButtonListener implements View.OnClickListener{@Overridepublic void onClick(View arg0) {switch(arg0.getId()){case R.id.id_myclass_button_studing:setButtonColor(true);break;case R.id.id_myclass_button_over:setButtonColor(false);break;}}}} </span>
FragmentPagerAdapter適配器類

<span style="font-size:12px;">package com.example.viewpageractivity;import java.util.ArrayList; import java.util.List; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager; import android.support.v4.app.FragmentPagerAdapter;public class FragmenAdapter extends FragmentPagerAdapter{List<Fragment> mFragment;public FragmenAdapter(FragmentManager fm) {super(fm);mFragment = new ArrayList<Fragment>();mFragment.add(new FragmentActivityA());mFragment.add(new FragmentActivityB());}@Overridepublic Fragment getItem(int arg0) {return mFragment.get(arg0);}@Overridepublic int getCount() {return mFragment.size();}} </span>
FragmentActivityA類

<span style="font-size:12px;">package com.example.viewpageractivity;import android.os.Bundle; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup;public class FragmentActivityA extends Fragment{public View myView;@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {//加入布局文件myView = inflater.inflate(R.layout.fragmenta, container, false);return myView;} } </span>

FragmentActivityB類

<span style="font-size:12px;">package com.example.viewpageractivity;import android.os.Bundle; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup;public class FragmentActivityB extends Fragment{public View myView;@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {//加入布局文件myView = inflater.inflate(R.layout.fragmentb, container, false);return myView;}} </span>
之前用到的封裝好的Actionbar類

<span style="font-size:12px;">package com.example.viewpageractivity;import android.app.ActionBar; import android.app.ActionBar.LayoutParams; import android.app.Activity; import android.content.Context; import android.util.Log; import android.view.LayoutInflater; import android.view.View; /*** 設置action bar* */ public class BuildingActionBar {public static ActionBar mActionbar;/*** 設置action bar* */public static void setActionBarLayout(int layoutID,Activity mActivity) {mActionbar = mActivity.getActionBar();if (mActionbar != null) {// 設置home標題隱藏mActionbar.setDisplayShowHomeEnabled(false);// 使自己定義的普通View能在title欄顯示。即actionBar.setCustomView能起作用mActionbar.setDisplayShowCustomEnabled(true);LayoutInflater inflator = (LayoutInflater) mActivity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);View v = inflator.inflate(layoutID, null);ActionBar.LayoutParams layout = new ActionBar.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);mActionbar.setCustomView(v, layout);} else {Log.e("BuildingActionBar", "actionbar為空");}} } </span>
actionbar的xml文件

<span style="font-size:12px;"><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:id="@+id/actionbarLayoutId"android:layout_width="match_parent"android:layout_height="match_parent"android:background="#1D92F9" > <TextViewandroid:id="@+id/actionbar_left"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerVertical="true"android:textColor="#fff"android:layout_marginLeft="3dip"android:text="左邊"android:textSize="20sp" /><RelativeLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerInParent="true"android:layout_centerVertical="true" ><Buttonandroid:id="@+id/id_myclass_button_studing"android:layout_width="wrap_content"android:layout_height="48dip"android:background="@drawable/title_switch_left_off"android:textColor="#A3A3A3"android:textSize="15sp" /><Buttonandroid:id="@+id/id_myclass_button_over"android:layout_width="wrap_content"android:layout_height="48dip"android:layout_toRightOf="@id/id_myclass_button_studing"android:background="@drawable/title_switch_right_off"android:textColor="#A3A3A3"android:textSize="15sp" /></RelativeLayout></RelativeLayout></span>

主類的xml文件

<span style="font-size:12px;"><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"tools:context=".MainActivity" ><android.support.v4.view.ViewPagerandroid:id="@+id/id_myclass_viewpager"android:layout_width="match_parent"android:layout_height="match_parent" /></RelativeLayout></span>

還有兩個fragmentActivity 的布局文件可任意定義 就不再貼上來了

轉載于:https://www.cnblogs.com/liguangsunls/p/6991764.html

總結

以上是生活随笔為你收集整理的ViewPager (下)-- 利用 Fragment 实现美丽的 页面切换的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。