你的位置:首页 > 操作系统

[操作系统]Fragment+RadioButton实现点击切换页面效果


   首先我们需要在主布局文件中 放一个 容器,方便让fragment加入进去,我们创建了四个Fragment,并用RedioButton实现了导航栏

MainActivity.java

 1 package com.example.administrator.fragmentdemo; 2  3 import android.app.Activity; 4 import android.app.FragmentManager; 5 import android.app.FragmentTransaction; 6 import android.os.Bundle; 7 import android.view.View; 8 import android.widget.RadioButton; 9  10  11 public class MainActivity extends Activity implements View.OnClickListener { 12  13   private RadioButton image1; 14   private RadioButton image2; 15   private RadioButton image3; 16   private RadioButton image4; 17  18   private FirstFragment firstFragment; 19   private SecondFragment secondFragment; 20   private ThirdFragment thirdFragment; 21   private FourFragment fourFragment; 22  23   @Override 24   protected void onCreate(Bundle savedInstanceState) { 25     super.onCreate(savedInstanceState); 26     setContentView(R.layout.activity_main); 27  28     initViews(); 29     initEvents(); 30     //首先 我们先选定一个 31     select(0); 32   } 33   //初始化 各种个 View 34   private void initViews(){ 35     image1 = (RadioButton) findViewById(R.id.tab_image1); 36     image2 = (RadioButton) findViewById(R.id.tab_image2); 37     image3 = (RadioButton) findViewById(R.id.tab_image3); 38     image4 = (RadioButton) findViewById(R.id.tab_image4); 39   } 40   //初始化 监听事件 41   private void initEvents(){ 42     image1.setOnClickListener(this); 43     image2.setOnClickListener(this); 44     image3.setOnClickListener(this); 45     image4.setOnClickListener(this); 46   } 47   // 初始化 各种图片 48   private void initImageBack(){ 49     image1.setBackgroundResource(R.drawable.chatting_biaoqing_btn_normal); 50     image2.setBackgroundResource(R.drawable.lbs_icon_disable); 51     image3.setBackgroundResource(R.drawable.scan_book); 52     image4.setBackgroundResource(R.drawable.scan_word); 53   } 54   // 55   private void select(int i){ 56     FragmentManager fm = getFragmentManager(); //获得Fragment管理器 57     FragmentTransaction ft = fm.beginTransaction(); //开启一个事务 58  59     hidtFragment(ft);  //先隐藏 Fragment 60  61     switch (i){ 62       case 0: 63         image1.setBackgroundResource(R.drawable.chatting_biaoqing_btn_enable); 64         if (firstFragment == null){ 65           firstFragment = new FirstFragment(); 66           ft.add(R.id.fragment_container,firstFragment); 67         }else{ 68           ft.show(firstFragment); 69         } 70         break; 71       case 1: 72         image2.setBackgroundResource(R.drawable.lbs_icon_enable); 73         if (secondFragment == null){ 74           secondFragment = new SecondFragment(); 75           ft.add(R.id.fragment_container,secondFragment); 76         }else { 77           ft.show(secondFragment); 78         } 79         break; 80       case 2: 81         image3.setBackgroundResource(R.drawable.scan_book_hl); 82         if (thirdFragment == null){ 83           thirdFragment = new ThirdFragment(); 84           ft.add(R.id.fragment_container,thirdFragment); 85         }else { 86           ft.show(thirdFragment); 87         } 88         break; 89       case 3: 90         image4.setBackgroundResource(R.drawable.scan_word_hl); 91         if(fourFragment == null){ 92           fourFragment = new FourFragment(); 93           ft.add(R.id.fragment_container,fourFragment); 94         }else { 95           ft.show(fourFragment); 96         } 97         break; 98     } 99     ft.commit();  //提交事务100   }101   //隐藏所有Fragment102   private void hidtFragment(FragmentTransaction fragmentTransaction){103     if (firstFragment != null){104       fragmentTransaction.hide(firstFragment);105     }106     if (secondFragment != null){107       fragmentTransaction.hide(secondFragment);108     }109     if (thirdFragment != null){110       fragmentTransaction.hide(thirdFragment);111     }112     if (fourFragment != null){113       fragmentTransaction.hide(fourFragment);114     }115   }116   //重写监听117   @Override118   public void onClick(View v) {119 120     initImageBack(); //初始化 图片背景121 122     switch (v.getId()){123       case R.id.tab_image1:124         select(0);125         break;126       case R.id.tab_image2:127         select(1);128         break;129       case R.id.tab_image3:130         select(2);131         break;132       case R.id.tab_image4:133         select(3);134         break;135     }136   }137 }

主布局文件,在这里我分开写的,底部的导航栏有新建了一个

activity_main.

<LinearLayout  ="http://schemas.android.com/apk/res/android"  ="http://schemas.android.com/tools"  android:layout_width="match_parent"  android:layout_height="match_parent"  android:orientation="vertical"  tools:context=".MainActivity">  <ImageView    android:layout_width="match_parent"    android:layout_height="40dp"    android:background="@drawable/friendactivity_comment_frame_pressed"/>  <FrameLayout    android:id="@+id/fragment_container"    android:layout_width="match_parent"    android:layout_height="0dp"    android:layout_weight="1">  </FrameLayout>  <include layout="@layout/activity_main_tab_view"/></LinearLayout>

底部导航栏的布局文件

<??><LinearLayout  ="http://schemas.android.com/apk/res/android"  android:orientation="horizontal"  android:layout_width="match_parent"  android:layout_height="50dp"  android:layout_gravity="bottom"  android:background="@drawable/friendactivity_comment_frame_pressed">  <RadioGroup    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="horizontal">    <RadioButton      android:id="@+id/tab_image1"      android:layout_width="0dp"      android:layout_height="match_parent"      android:layout_weight="1"      android:button="@null"      android:background="@drawable/chatting_biaoqing_btn_normal"/>    <RadioButton      android:id="@+id/tab_image2"      android:layout_width="0dp"      android:layout_height="match_parent"      android:layout_weight="1"      android:button="@null"      android:background="@drawable/lbs_icon_disable"/>    <RadioButton      android:id="@+id/tab_image3"      android:layout_width="0dp"      android:layout_height="match_parent"      android:layout_weight="1"      android:button="@null"      android:background="@drawable/scan_book"/>    <RadioButton      android:id="@+id/tab_image4"      android:layout_width="0dp"      android:layout_height="match_parent"      android:layout_weight="1"      android:button="@null"      android:background="@drawable/scan_word"/>  </RadioGroup></LinearLayout>

四个fragment都一样,我就放一个代码,布局也很简单,就放了一个TextView

Fragment.java

package com.example.administrator.fragmentdemo;import android.app.Fragment;import android.os.Bundle;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;/** * Created by Administrator on 2015/9/3. */public class FirstFragment extends Fragment {  @Override  public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {    return inflater.inflate(R.layout.first_fragment_view,container,false);  }}

该fragment的布局文件为:

<??><LinearLayout  ="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="This is frist fragment"/></LinearLayout>

效果图: