基於Android的計步器(Pedometer)的講解(一)——Fragment頁面跳轉

標籤：android

首先需要做的是實現幾個頁面的跳轉，既類似的點擊按鈕，切換頁面。

話不多說，這是一個簡單的頁面切換的Demo，先貼幾張實現的效果：

     

圖片的底部是5個RadioButton，用來進行頁面之間的切換。剩下的部分是一個LinearLayout的布局，用來鑲嵌5個Fragment（片段）的頁面。

一共用到5個類：MainActivity、MyAdapter、FragmentHistory、FragmentAnalysis、FragmentPedometer、FragmentPK、FragmentSet

MainActivity的主要代碼如下：

package com.example.changepage1;import java.util.ArrayList;import java.util.List;import android.os.Bundle;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentActivity;import android.widget.RadioGroup;public class MainActivity extends FragmentActivity {private RadioGroup rg;private List<Fragment> fragments;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.page_mian);rg = (RadioGroup) findViewById(R.id.radioGroup);//執行個體化radiogroupfragments = new ArrayList<Fragment>();//分別添加5個fragmentfragments.add(new FragmentHistory());fragments.add(new FragmentAnalysis());fragments.add(new FragmentPedometer());fragments.add(new FragmentPK());fragments.add(new FragmentSet());new MyAdapter(this, fragments, R.id.Fragment, rg);//設定適配器}}

MyAdapter的代碼如下：

package com.example.changepage1;import java.util.List;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentActivity;import android.support.v4.app.FragmentTransaction;import android.widget.RadioGroup;import android.widget.RadioGroup.OnCheckedChangeListener;/** * 這是自己寫的一個適配器 *  * @author 李埡超 Date: 2015-1-2 Time: 下午3點 */public class MyAdapter implements OnCheckedChangeListener {private List<Fragment> fragments; // 一個tab頁面對應一個Fragmentprivate RadioGroup rgs; // 用於切換tabprivate FragmentActivity fragmentActivity; // Fragment所屬的Activityprivate int fragmentContentId; // Activity中所要被替換的地區的idprivate int currentTab = 2; // 當前Tab頁面索引public MyAdapter(FragmentActivity fragmentActivity,List<Fragment> fragments, int fragmentContentId, RadioGroup rgs) {this.fragments = fragments;this.rgs = rgs;this.fragmentActivity = fragmentActivity;this.fragmentContentId = fragmentContentId;// 預設顯示第一頁FragmentTransaction ft = fragmentActivity.getSupportFragmentManager().beginTransaction();ft.add(fragmentContentId, fragments.get(2));ft.commit();this.rgs.setOnCheckedChangeListener(this);}/** * 監聽radiobutton改變時間，當選擇了不同的radiobutton會出發這個函數 */public void onCheckedChanged(RadioGroup group, int checkedId) {for (int i = 0; i < rgs.getChildCount(); i++) {if (rgs.getChildAt(i).getId() == checkedId) {Fragment fragment = fragments.get(i);FragmentTransaction ft = obtainFragmentTransaction(i);getCurrentFragment().onPause(); // 暫停當前tabif (fragment.isAdded()) {fragment.onResume(); // 啟動目標tab的onResume()} else {ft.add(fragmentContentId, fragment);}showTab(i); // 顯示目標tabft.commit();}}}public Fragment getCurrentFragment() {return fragments.get(currentTab);}private void showTab(int idx) {for (int i = 0; i < fragments.size(); i++) {Fragment fragment = fragments.get(i);FragmentTransaction ft = obtainFragmentTransaction(idx);if (idx == i) {ft.show(fragment);} else {ft.hide(fragment);}ft.commit();}currentTab = idx; // 更新目標tab為當前tab}private FragmentTransaction obtainFragmentTransaction(int index) {FragmentTransaction ft = fragmentActivity.getSupportFragmentManager().beginTransaction();// 設定切換動畫if (index > currentTab) {ft.setCustomAnimations(R.anim.slide_left_in, R.anim.slide_left_out);} else {ft.setCustomAnimations(R.anim.slide_right_in,R.anim.slide_right_out);}return ft;}}

FragmentHistory、FragmentAnalysis、FragmentPedometer、FragmentPK、FragmentSet的代碼依次為：

package com.example.changepage1;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;/** * 這是分析七天步數的片段 * Author: 李埡超   email:[email protected] * Date: 2015-1-2 * Time: 下午2:39 */public class FragmentAnalysis extends Fragment{private View view;@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {view = inflater.inflate(R.layout.analysis, container, false);return view;}}

package com.example.changepage1;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;/** * 這是記錄的片段 * Author: 李埡超   email:[email protected] * Date: 2015-1-2 * Time: 下午2:39 */public class FragmentHistory extends Fragment{private View view;@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {view = inflater.inflate(R.layout.history, container, false);return view;}}

package com.example.changepage1;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;/** * 這是記步的片段 * Author: 李埡超   email:[email protected] * Date: 2015-1-2 * Time: 下午2:39 */public class FragmentPedometer extends Fragment{private View view;@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {view = inflater.inflate(R.layout.pedometer, container, false);return view;}}

package com.example.changepage1;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;/** * 這是記步的片段 * Author: 李埡超   email:[email protected] * Date: 2015-1-2 * Time: 下午2:39 */public class FragmentPK extends Fragment{private View view;@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {view = inflater.inflate(R.layout.pk, container, false);return view;}}

package com.example.changepage1;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;/** * 這是設定的片段 * Author: 李埡超   email:[email protected] * Date: 2015-1-2 * Time: 下午2:39 */public class FragmentSet extends Fragment{private View view;@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {view = inflater.inflate(R.layout.set, container, false);return view;}}

這個例子的的完整demo在：

http://download.csdn.net/detail/a296777513/8320619

基於Android的計步器(Pedometer)的講解(一)——Fragment頁面跳轉