1. 程式人生 > >FragmentTabHost+Fragment+ViewPager實現內外層巢狀

FragmentTabHost+Fragment+ViewPager實現內外層巢狀

轉載,原博地址:http://blog.csdn.net/xiangxue336/article/details/22804971

今天介紹現在比較流行的一種app佈局方式:內外層巢狀Tab,子Tab可以實現滑動切換。

    實現原理:FragmentTabHost+Fragment實現第一層Tab。

                    在Fragment裡利用ViewPaper,實現第二層Tab,也就是子Tab。

    從原理可以看出,這兩層Tab是完全解耦的,沒有任何事件和資料聯絡,那麼先介紹第一層怎麼實現,由於google對FragmentTabHost+Fragment封裝的比較好,實現過程無非是FragmentTabHost+Fragment的使用過程。

    可以用一句話來說明過程:就是給FragmentTabHost設定一定數量的按鈕背景。

  1. publicstatic  Context context;  
  2.     /** 
  3.      * 中間內容的fragment 
  4.      */
  5.     private Fragment frg_content;  
  6.     /** 
  7.      * fragmentTabHost 
  8.      */
  9.     private FragmentTabHost frg_tabHost;  
  10.     /** 
  11.      * 定義陣列來存放按鈕圖片 
  12.      */
  13.     private
    int intImageViewArray[] = {  
  14.             R.drawable.selector_bt_bookstore_featured, R.drawable.selector_bt_bookstore_top,  
  15.             R.drawable.selector_bt_bookstore_category, R.drawable.selector_bt_bookstore_search  
  16.     };  
  17.     /** 
  18.      * 定義陣列來存放Fragment介面 
  19.      */
  20.     private Class fragmentArray[] = {  
  21.             BookstoreFeaturedFragment.class, BookstoreTopFragment.class,  
  22.             BookstoreCategoryFragment.class, BookstoreSearchFragment.class
  23.     };  
  24.     /** 
  25.      * Tab選項卡的文字 
  26.      */
  27.     private String txt_Array[] = {  
  28.             "精選""排行""分類""搜尋"
  29.     };  
  30.     @Override
  31.     publicvoid onCreate(Bundle savedInstanceState) {  
  32.         super.onCreate(savedInstanceState);  
  33.     overridePendingTransition(R.anim.slide_right_in, R.anim.slide_mid_left_out);  
  34.     setContentView(R.layout.ac_bookstore_main);  
  35.         // 得到fragment的個數
  36.         int count = intImageViewArray.length;  
  37.         // 例項化TabHost物件,得到TabHost
  38.         frg_tabHost = (FragmentTabHost) findViewById(android.R.id.tabhost);  
  39.         frg_tabHost.setup(this, getSupportFragmentManager(), R.id.realtabcontent);  
  40.         for (int i = 0; i < count; i++) {  
  41.             // 為每一個Tab按鈕設定圖示、文字和內容
  42.               ImageView imageView = new ImageView(this);  
  43. //          imageView.setImageResource(intImageViewArray[i]);
  44.             imageView.setImageDrawable(skinContext.getResources().getDrawable(intImageViewArray[i]));  
  45.             imageView.setScaleType(ScaleType.CENTER_CROP);  
  46.             TabSpec tabSpec = frg_tabHost.newTabSpec(txt_Array[i]).setIndicator(imageView);  
  47.             // 將Tab按鈕新增進Tab選項卡中
  48.               frg_tabHost.addTab(tabSpec, fragmentArray[i], null);  
  49.         }  
  50.         frg_tabHost.setCurrentTab(0);  
  51.         getSlidingMenu().setSlidingEnabled(false);  
  52.     }  

這樣就實現了點選哪個按鈕,就顯示哪個fragment。

這樣就存在一個問題,就是tab佈局問題,顯示在上面還是下面:

tab顯示在底部的佈局:

  1. <LinearLayout  
  2.       android:layout_width="fill_parent"
  3.       android:layout_height="fill_parent"
  4.       android:orientation="vertical" >  
  5.       <FrameLayout  
  6.           android:id="@+id/realtabcontent"
  7.           android:layout_width="fill_parent"
  8.           android:layout_height="0dip"
  9.           android:layout_weight="1" />  
  10.       <android.support.v4.app.FragmentTabHost  
  11.           android:id="@android:id/tabhost"
  12.           android:layout_width="fill_parent"
  13.           android:layout_height="wrap_content" >  
  14.           <FrameLayout  
  15.               android:id="@android:id/tabcontent"
  16.               android:layout_width="0dp"
  17.               android:layout_height="0dp"
  18.               android:layout_weight="0" />  
  19.       </android.support.v4.app.FragmentTabHost>  
  20.   </LinearLayout>  

tab顯示在頂部的佈局:

  1. <LinearLayout  
  2.       android:layout_width="fill_parent"
  3.       android:layout_height="fill_parent"
  4.       android:orientation="vertical" >  
  5.       <android.support.v4.app.FragmentTabHost  
  6.           android:id="@android:id/tabhost"
  7.           android:layout_width="fill_parent"
  8.           android:layout_height="wrap_content" >  
  9.           <FrameLayout  
  10.               android:id="@android:id/tabcontent"
  11.               android:layout_width="0dp"
  12.               android:layout_height="0dp"
  13.               android:layout_weight="0" />  
  14.       </android.support.v4.app.FragmentTabHost>  
  15.       <FrameLayout  
  16.           android:id="@+id/realtabcontent"
  17.           android:layout_width="fill_parent"
  18.           android:layout_height="0dip"
  19.           android:layout_weight="1" />  
  20.   </LinearLayout>  

對比可以看出:realtabcontent是fragment顯示的位置,一般是豎向填充:layout_weight="1"
                       tabhost是tab按鈕放置位置,一般是橫向填充,高度根據背景自適應。

                       tabcontent是幹什麼用的呢?看下程式碼:

  1. publicvoid switchContent(Fragment fragment) {  
  2.        getSupportFragmentManager().beginTransaction().replace(android.R.id.tabcontent, fragment)  
  3.                .commit();  
  4.    }  

這行程式碼的作用是 顯示frament頁,所以我認為tabcontent指的是當前frament頁面,可以用於頁面的重新整理。

這樣第一層tab就實現了。

我們在實現第二層tab,其實即使ViewPaper的使用方法:

ViewPager的使用比較簡單,完全可以當做一個listview使用:

  1. viewpager_featured.setAdapter(viewPagerAdapter);// 設定ViewPager的介面卡
  2. viewpager_featured.setCurrentItem(0);  

還可以設定快取頁面個數:viewpager_featured.setOffscreenPageLimit(2);用來防止頁面重新整理,這個數值越大會佔用越多記憶體。所以放置資料重新整理的方法是設定繫結資料的狀態,根據資料狀態覺得是否要重新整理。

主要講解下ViewPager和tab結合的時候的使用,特別是有動畫效果的時候的使用。

這裡介紹一種tab實現方式:1.tab 個數可刪減。2、焦點tab顯示在可見位置

這裡tab按鈕用textview來實現,先動態的初始化tab個數,以及根據顯示字數多少設定寬度:

  1. /** 
  2.      * 設定側滑資料 
  3.      */
  4.     privatevoid setSlideMenu() {  
  5.         // 包含TextView的LinearLayout
  6.         int two_width = 60;  
  7.         int three_width = 90;  
  8.         

    相關推薦

    FragmentTabHost+Fragment+ViewPager實現外層

    轉載,原博地址:http://blog.csdn.net/xiangxue336/article/details/22804971 今天介紹現在比較流行的一種app佈局方式:內外層巢狀Tab,子Tab可以實現滑動切換。     實現原理:FragmentT

    Android RxJava 實戰系列:優雅實現 網路請求回撥

    轉自-----http://blog.csdn.net/carson_ho/article/details/78315696,請為大神打call 前言 Rxjava,由於其基於事件流的鏈式呼叫、邏輯簡潔 & 使用簡單的特點,深受各大 Android

    Android Fragment+Viewpager實現左右滑動和點選 實現DrawerLayout

    xml佈局程式碼: <android.support.v4.widget.DrawerLayout xmlns:android=“http://schemas.android.com/apk/res/android” xmlns:app=“http://schemas.androi

    一層RecyclerView實現list RecyclerViewgrid RecyclerView

    有需求的可以看看前言準備工作具體實現感謝 前言 還是先上圖看下效果,不符要求或者不感興趣的老哥就可以省個時間去做其他事了。 效果圖: 準備工作 首先我們分析這個圖,我們可以把張圖分為三種類型的item,分別是頭部帶標題的一欄,中間內容,和尾部空白填充。 我

    部類------類、區域性類、匿名類、lambda

    巢狀類、區域性類:是帶有名字的,可以多次使用,巢狀類使用相對更為靈活一點,區域性類在函式內內部。匿名類只是使用一次,lambda是匿名類的簡寫。 巢狀類: 是否有名稱空間:是 是否可以生面為static型別:可以宣告為static類,建立方式OuterClass.S

    Android中Fragment+Viewpager實現左右滑動和點選

    一.佈局檔案 <?xml version="1.0" encoding="utf-8"?> <android.support.v4.view.ViewPager android:id="@+id/viewpager" andr

    fastjson parse類中有部類時,且部類部類報錯

    com.alibaba.fastjson.JSONException: create instance error, class com.XXXX.model.ClassA$ClassInnerBat com.alibaba.fastjson.parser.deserial

    C++ 部類(類)

    內部類 內部類就像這個類的一個成員函式,所以內部類有權訪問外部類內容(包括private內容)。但是內部類就相當於在一個作用域內定義了一個類,這個作用域內的其他變數是無權訪問這個類的。 class Out{ public : void Fun (

    ThinkPHP5 資源分組路由配置方法(可以根據需要實現多層,注意:資源分組路由配置順序依次是層次遞減)

    use think\Route; //資源巢狀分組路由配置方法(可以根據需要實現多層巢狀,注意:分組路由配置順序依次是巢狀層次遞減): // 更改巢狀資源路由blogs資源的資源變數名為blog_id //從表路由(分組路由配置順序必須是從表路由優先配置,否則從表路由一

    recyclerview裡面實現多佈局recyclerview第一次進入的時候出現自動滾動到第二天reccyclerview問題

    今天用recyclerview寫的時候出現一個問題,第一層用的一個imageview,第二層用的是recyclerview,第三層也是recyclerview,,第一層進去的時候出現一個問題,顯示不是從第一層imageview而是自動滾到了第二層recyclerview,查

    Fragment+ViewPager實現類似ActionBar切換的效果

    使用Fragment+ViewPager實現類似網易新聞客戶端的多頁面左右滑動切換的效果,需要有android.support.v4的支援包,可以相容Android 2.0以上版本,具體程式碼如下: private TextView mWealthRank_tv; p

    Python遞迴實現多層dict遍歷例項--三級選單/多級選單功能

    要求:構建一個三(N)級選單,實現使用者可以根據指示選擇進入選單,退出選單,返回上層選單功能。知識點:dict資料的遍歷方法,遞迴遍歷方法。環境:Python3.6實現程式碼:#!/usr/bin/evn python # -*-coding:utf8 -*- class m

    ThinkPHP5 資源路由配置方法(可以根據需要實現多層)

    use think\Route; //資源巢狀路由配置方法(可以根據需要實現多層巢狀): // 更改巢狀資源路由blogs資源的資源變數名為blog_id Route::resource('blogs','index/Blog',['var'=>['blogs'=&g

    Android關於小米相簿懸浮標題欄、凍結標題欄的實現方式(型RecycleView)

    效果圖如下: 網上完全查詢不到關於凍結標題欄的實現方式,經過幾天的摸索嘗試,終於實現了這種效果;當然在過程中遇到了很多問題拖延了進度,關鍵是沒有摸清思路。 本文的實現方式已經盡了本人最大的能力進行簡化,並解決了快速滑動造成的錯亂問題,具體思路如下:

    MySQL用while實現for迴圈(插入學生成績資訊功能)

    本次實驗的目的在於實現mysql中自動插入學生成績資訊,即給每個學生自動插入1~6號課程的成績, 屬性如下: 學生學號(i):1~23 課程號(j):1~6 成績:用rand()函式來實現自動填成績 此功能在java中用兩個for迴圈巢狀即可,程式碼如下: for(in

    Android程式設計心得-使用ActionBar+Fragment+ViewPager實現動態切換Menu效果

    1.首先上效果圖 2.本例實現的效果主要適用於當前頁面有多個頁籤時,進行Fragment切換時,可以利用不同的Menu樣式與當前Fragment中的內容進行配合,可以大大增加複用性,看到效果圖後,下面我來介紹我實現這一效果的主要步驟 2.1  因為此處我有3個樣式,那

    ScrollView+TabLayout+ViewPager+ListView複雜滑動、上拉載入

    先來看看要實現佈局的樣式哈,我感覺手動畫的更詳細嘿嘿。 要實現的就是這樣的複雜佈局,這裡面涉及到各種巢狀滑動的衝突,還涉及ListView的上拉載入,接下來一點點開始哈。 一、ScrollView巢狀ListView 首先從整體看就會看到Scrol

    TabLayou+fragment+viewpager實現滑動切換頁面

    在android studio中新增依賴 com.android.support:design:23.2.1 TabLayou 主要實現的是標題頭的 滑動 這個 控制元件 類似於 ScrollView ## XML中的佈局 <L

    關於viewPagerviewPager,切換上層fragmentfragment不顯示的問題

    最近遇到個問題,兩個viewPager巢狀,切換外層的Fragment的時候,內層的fragment不顯示內容, 解決方法: 設定第二個viewPager的adapter時,FragmentManager應使用getChildFragmentManager,例:

    使用fragmentFragmentTabHost實現篩選切換框架

    想要實現一個效果篩選切換的導航頁,著實費了翻腦筋,大概腦子鬆弦了,請教了不少同事,最後還是用自己鬆弦的大腦想出來了,不多說了,看圖: 思路一:用的FragmentTabHost新增兩個fragmentA,fragmentB,點選商品切換,移除fragmentA,fra