本篇文章為大家展示了怎么在Fragment中使用ViewPager實現(xiàn)一個底部導(dǎo)航欄，內(nèi)容簡明扼要并且容易理解，絕對能使你眼前一亮，通過這篇文章的詳細介紹希望你能有所收獲。

長樂網(wǎng)站建設(shè)公司創(chuàng)新互聯(lián)公司,長樂網(wǎng)站設(shè)計制作，有大型網(wǎng)站制作公司豐富經(jīng)驗。已為長樂上1000+提供企業(yè)網(wǎng)站建設(shè)服務(wù)。企業(yè)網(wǎng)站搭建\成都外貿(mào)網(wǎng)站制作要多少錢，請找那個售后服務(wù)好的長樂做網(wǎng)站的公司定做！

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 xmlns:tools="http://schemas.android.com/tools" 
 android:layout_width="fill_parent" 
 android:layout_height="fill_parent" 
 android:background="@color/theme_color" 
 android:clipToPadding="true" 
 android:fitsSystemWindows="true" > 
 
 <include 
  android:id="@+id/actionbar_activity_main" 
  layout="@layout/actionbar" /> 
 
 <RelativeLayout 
  android:layout_width="fill_parent" 
  android:layout_height="fill_parent" 
  android:layout_below="@id/actionbar_activity_main" 
  android:background="@color/white" > 
 
  <RadioGroup 
   android:id="@+id/rg_menu_activity_main" 
   android:layout_width="fill_parent" 
   android:layout_height="55dp" 
   android:layout_alignParentBottom="true" 
   android:background="@color/theme_color" 
   android:gravity="center" 
   android:orientation="horizontal" 
   android:weightSum="3" > 
 
   <RadioButton 
    android:id="@+id/rb_main_tab_menu1" 
     
    android:checked="true" 
    android:drawableTop="@drawable/radiobt_main_home" 
    android:gravity="center" 
    android:paddingTop="12dp" 
    android:text="@string/home_text" 
    android:textColor="@color/white" /> 
 
   <RadioButton 
    android:id="@+id/rb_main_tab_menu2" 
     
    android:checked="false" 
    android:drawableTop="@drawable/radiobt_main_my" 
    android:gravity="center" 
    android:paddingTop="12dp" 
    android:text="@string/my_text" 
    android:textColor="@color/white" /> 
 
   <RadioButton 
    android:id="@+id/rb_main_tab_menu3" 
     
    android:checked="false" 
    android:drawableTop="@drawable/radiobt_main_setting" 
    android:gravity="center" 
    android:paddingTop="12dp" 
    android:text="@string/setting_text" 
    android:textColor="@color/white" /> 
  </RadioGroup> 
 
  <android.support.v4.view.ViewPager 
   android:id="@+id/vp_activity_main" 
   android:layout_width="fill_parent" 
   android:layout_height="fill_parent" 
   android:layout_above="@id/rg_menu_activity_main" /> 
 </RelativeLayout> 
 
</RelativeLayout>

這個布局實現(xiàn)的效果如下：

只看效果，大家覺得挺好的，但是重要的問題來了。

下面的radioButton點了沒反應(yīng)，我檢查了一下xml文件，再檢查了一下java代碼,沒有問題啊，我開始方了，，，然后網(wǎng)上搜，好像沒有人遇到這個問題，，檢查好幾遍之后，問旁邊的同學(xué)，他說 既然設(shè)置了監(jiān)聽，但是沒有反應(yīng)，那肯定是有一個東西把這個事件消費掉了，我想起來了之前看的事件分發(fā)機制，，建議大家對事件分發(fā)機制不懂的小伙伴趕緊看看，面試和日常寫代碼都要用到，特別是面試，面試官特別喜歡問。

回歸正題，大家看我的 xml文件，我把viewpager寫在了Radiogroup的下面，并且，layout_height = "fill_parent"     這樣我的viewpager就消費掉了我的radiobutton的點擊事件，其實之后我覺得，是我的邏輯不正確，我應(yīng)該順序的寫下來，而不是只實現(xiàn)功能，這樣我看自己的代碼可以看懂，可是給別人可能會造成誤解。

好了，開始說一下，實現(xiàn)底部導(dǎo)航的整個流程，實現(xiàn)的界面還如上：（在studio中寫的）

actionbar.xml  上面自定義的 actionbar  系統(tǒng)自帶的actionbar在java代碼中去掉了

代碼功能：  左邊返回鍵 中間顯示的文字 右邊的 更多 鍵   上圖中沒有顯示出來，是因為我沒有讓 左右的鍵顯示出來

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 android:layout_width="fill_parent" 
 android:layout_height="@dimen/actionBar_height" 
 android:background="@color/theme_color" 
 > 
 <RelativeLayout 
  android:id="@+id/rl_back_actionbar" 
  android:layout_width="@dimen/actionBar_back" 
  android:layout_height="fill_parent" 
  android:visibility="invisible"> 
  <ImageView 
   android:layout_width="22dp" 
   android:layout_height="20dp" 
   android:layout_centerVertical="true" 
   android:layout_marginLeft="12dp" 
   android:background="@drawable/back" 
   android:contentDescription="@string/app_name"/> 
 </RelativeLayout> 
 <TextView 
  android:id="@+id/tv_title_actionbar" 
  android:layout_width="wrap_content" 
  android:layout_height="wrap_content" 
  android:layout_centerInParent="true" 
  android:text="@string/TimeRobot" 
  android:textColor="#ffffff" 
  android:textSize="@dimen/actionBar_title_text_size" 
  /> 
 <RelativeLayout 
  android:id="@+id/rl_more_actionbar" 
  android:layout_width="wrap_content" 
  android:layout_height="fill_parent" 
  android:layout_alignParentRight="true" 
  android:visibility="invisible"> 
  <ImageView 
   android:layout_width="25dp" 
   android:layout_height="25dp" 
   android:layout_centerVertical="true" 
   android:layout_marginRight="12dp" 
   android:background="@drawable/more" 
   android:contentDescription="@string/app_name"/> 
 </RelativeLayout> 
 
 
</RelativeLayout>

activity_main.xml 文件 
中間的部分color資源，是我引用的自動的，大家可以自己選擇

<?xml version="1.0" encoding="utf-8"?> 
<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" 
 android:background="@color/theme_color" 
 android:clipToPadding="true" 
 tools:context=".MainActivity"> 
 <!-- 引入 actionbar--> 
 <include 
  android:id="@+id/actionbar_activity_main" 
  layout= "@layout/actionbar"/> 
 <android.support.v4.view.ViewPager 
  android:id="@+id/vp_activity_main" 
  android:layout_width="fill_parent" 
  android:layout_height="fill_parent" 
  android:layout_below="@+id/actionbar_activity_main" 
  android:layout_alignParentRight="true" 
  android:layout_alignParentEnd="true" 
  android:background="@color/white"/> 
 
  <RadioGroup 
   android:id="@+id/rg_main_radioGroup" 
   android:layout_width="fill_parent" 
   android:layout_height="58dp" 
   android:layout_alignParentBottom="true" 
   android:background="@color/theme_color" 
   android:gravity="center" 
   android:orientation="horizontal" 
   android:weightSum="3"> 
   <RadioButton 
    android:id="@+id/rb_main_tab_menu1" 
    android:layout_weight="1" 
    android:layout_width="0dp" 
    android:layout_height="fill_parent" 
    android:checked="true" 
    android:drawableTop="@drawable/radio_bt_plan" 
    android:gravity="center" 
    android:button="@null" 
    android:paddingTop="8dp" 
    android:text="@string/home_text" 
    android:textColor="@color/white"/> 
   <RadioButton 
    android:id="@+id/rb_main_tab_menu2" 
    android:layout_weight="1" 
    android:layout_width="0dp" 
    android:layout_height="fill_parent" 
    android:checked="false" 
    android:drawableTop="@drawable/radio_bt_time" 
    android:gravity="center" 
    android:button="@null" 
    android:paddingTop="8dp" 
    android:text="@string/timeGroup" 
    android:textColor="@color/white"/> 
   <RadioButton 
    android:id="@+id/rb_main_tab_menu3" 
    android:layout_weight="1" 
    android:layout_width="0dp" 
    android:layout_height="fill_parent" 
    android:checked="false" 
    android:drawableTop="@drawable/radio_bt_my" 
    android:gravity="center" 
    android:button="@null" 
    android:paddingTop="8dp" 
    android:textColor="@color/white" 
    android:text="@string/My"/> 
  </RadioGroup> 
</RelativeLayout>

注意一下，radiobutton中的一個屬性是  drawableTop屬性， 這個后面引用的drawable資源是 實現(xiàn) 點擊改變radiobutton狀態(tài)的布局文件，我給大家貼出來 radio_bt_plan.xml文件的代碼，其他的只要新建，copy代碼，改顯示的圖片即可。
還有，對于初次用studio的伙伴，這里要注意了，new的時候，drawable --->右鍵  ---->  new ----> new resource file （即 出來的第一個） 而不是XML

radio_bt_plan.xml

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
 <item android:drawable="@drawable/planning_press" 
  android:state_enabled="true" 
  android:state_focused="true" 
  android:state_pressed="false"/> 
 <item android:drawable="@drawable/planning_press" 
  android:state_enabled="true" 
  android:state_pressed="true" 
  /> 
 <item android:drawable="@drawable/planning_press" 
  android:state_checked="true" 
  android:state_enabled="true" 
  /> 
 <item android:drawable="@drawable/planning"/> 
 
</selector>

接下來就是  MainActivity.java文件了

public class MainActivity extends FragmentActivity { 
 private TextView title_text; 
 private ViewPager vp_main_tab; 
 private List<Fragment> fragmentList = null; 
 private FragmentPagerAdapter mAdapter = null; 
 
 private MyFragment myFragment; 
 private TimeGroupFragment timeGroupFragment; 
 private PlanningFragment planningFragment; 
 
 private RadioButton rb_main_tab_menu1; 
 private RadioButton rb_main_tab_menu2; 
 private RadioButton rb_main_tab_menu3; 
 private RadioGroup rg_main_group; 
 
 @Override 
 protected void onCreate(Bundle savedInstanceState) { 
  super.onCreate(savedInstanceState); 
  requestWindowFeature(Window.FEATURE_NO_TITLE); 
  setContentView(R.layout.activity_main); 
  init(); 
  rg_main_group.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() { 
 
   @Override 
   public void onCheckedChanged(RadioGroup group, int checkedId) { 
    switch (checkedId) { 
     case R.id.rb_main_tab_menu1: 
      vp_main_tab.setCurrentItem(0); 
      initActionbar(0); 
      break; 
     case R.id.rb_main_tab_menu2: 
      vp_main_tab.setCurrentItem(1); 
      initActionbar(1); 
      break; 
     case R.id.rb_main_tab_menu3: 
      vp_main_tab.setCurrentItem(2); 
      initActionbar(2); 
      break; 
     default: 
      break; 
    } 
 
   } 
  }); 
  initViewPage(); 
 } 
 private void initActionbar(int currentPage) { 
  switch (currentPage) { 
   case 0: 
    title_text.setText(getResources().getString(R.string.TimeRobot)); 
    break; 
   case 1: 
    title_text.setText(getResources().getString(R.string.timeGroup)); 
    break; 
   case 2: 
    title_text.setText(getResources().getString(R.string.My)); 
    break; 
   default: 
    break; 
  } 
 } 
 private void init() { 
  title_text = (TextView) findViewById(R.id.tv_title_actionbar); 
  vp_main_tab = (ViewPager) findViewById(R.id.vp_activity_main); 
  fragmentList = new ArrayList<Fragment>(); 
  rg_main_group = (RadioGroup) findViewById(R.id.rg_main_radioGroup); 
  rb_main_tab_menu1 = (RadioButton) findViewById(R.id.rb_main_tab_menu1); 
  rb_main_tab_menu2 = (RadioButton) findViewById(R.id.rb_main_tab_menu2); 
  rb_main_tab_menu3 = (RadioButton) findViewById(R.id.rb_main_tab_menu3); 
 
  myFragment = new MyFragment(); 
  timeGroupFragment = new TimeGroupFragment(); 
  planningFragment = new PlanningFragment(); 
 
  fragmentList.add(myFragment); 
  fragmentList.add(timeGroupFragment); 
  fragmentList.add(planningFragment); 
 
 
 } 
 
 private void initViewPage() { 
  android.support.v4.app.FragmentManager fm = getSupportFragmentManager(); 
  mAdapter = new FragmentPagerAdapter(fm) { 
 
   @Override 
   public int getCount() { 
    return fragmentList == null ? 0 : fragmentList.size(); 
   } 
 
   @Override 
   public android.support.v4.app.Fragment getItem(int position) { 
    return fragmentList.get(position); 
   } 
  }; 
  vp_main_tab.setAdapter(mAdapter); 
  vp_main_tab.setOnPageChangeListener(new ViewPager.OnPageChangeListener() { 
 
   @Override 
   public void onPageSelected(int position) { 
    initActionbar(position); 
    switch (position) { 
     case 0: 
      rb_main_tab_menu1.setChecked(true); 
      break; 
     case 1: 
      rb_main_tab_menu2.setChecked(true); 
      break; 
     case 2: 
      rb_main_tab_menu3.setChecked(true); 
      break; 
     default: 
      break; 
    } 
   } 
 
   @Override 
   public void onPageScrolled(int arg0, float arg1, int arg2) { 
   } 
 
   @Override 
   public void onPageScrollStateChanged(int state) { 
   } 
  }); 
 } 
}

上述內(nèi)容就是怎么在Fragment中使用ViewPager實現(xiàn)一個底部導(dǎo)航欄，你們學(xué)到知識或技能了嗎？如果還想學(xué)到更多技能或者豐富自己的知識儲備，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

名稱欄目：怎么在Fragment中使用ViewPager實現(xiàn)一個底部導(dǎo)航欄
文章網(wǎng)址：http://www.rwnh.cn/article18/gopidp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站維護、關(guān)鍵詞優(yōu)化、Google、外貿(mào)網(wǎng)站建設(shè)、移動網(wǎng)站建設(shè)、域名注冊

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)