28

我正在開發一個Android應用程序,我想使用3個選項卡導航使用片段爲每個選項卡,但我不知道如何創建它的結構。TabHost與片段和片段活動

我想分別添加每個片段,因爲每個片段都不同,但我不知道在FragmentActivity中將它們添加到哪裏。

我有這些文件。

tabs_layout.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:layout_height="match_parent" 
    android:layout_width="match_parent"> 

    <TabHost android:id="@android:id/tabhost" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 

     <LinearLayout 
       android:orientation="vertical" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" > 

      <TabWidget 
       android:id="@android:id/tabs" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
      /> 

      <FrameLayout 
       android:id="@android:id/tabcontent" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 

      > 

       <FrameLayout 
        android:id="@+id/tabRateAPet" 
        android:layout_width="match_parent" 
        android:layout_height="match_parent" 

       /> 

       <FrameLayout 
        android:id="@+id/tabViewMyRates" 
        android:layout_width="match_parent" 
        android:layout_height="match_parent" 

       /> 

       <FrameLayout 
        android:id="@+id/tabViewGlobalRates" 
        android:layout_width="match_parent" 
        android:layout_height="match_parent" 

       /> 


      </FrameLayout> 
     </LinearLayout> 
    </TabHost> 
</LinearLayout> 

TabsMain.java

import android.os.Bundle; 
import android.support.v4.app.Fragment; 
import android.support.v4.app.FragmentActivity; 

public class MainTabsActivity extends FragmentActivity { 
public static final String RATE_A_PET = "Rate a Pet"; 
public static final String MY_RATES = "My Rates"; 
public static final String GLOBAL_RATES = "Global Rates"; 

@Override 
    public void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.tabs_layout); 
} 
} 

Tabs.java

import android.app.Activity; 
import android.os.Bundle; 
import android.support.v4.app.Fragment; 
import android.support.v4.app.FragmentManager; 
import android.util.Log; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 
import android.widget.TabHost; 
import android.widget.TabHost.OnTabChangeListener; 
import android.widget.TabHost.TabSpec; 
import android.widget.TextView; 

public class Tabs extends Fragment implements OnTabChangeListener { 
    private static final String TAG = "FragmentTabs"; 
    public static final String RATE_A_PET = "Rate a Pet"; 
    public static final String MY_RATES = "My Rates"; 
    public static final String GLOBAL_RATES = "Global Rates"; 

    private View mRoot; 
    private TabHost mTabHost; 
    private int mCurrentTab; 

    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, 
      Bundle savedInstanceState) { 
//  super.onCreateView(inflater, container, savedInstanceState); 
     mRoot = inflater.inflate(R.layout.tabs_layout, null); 
     mTabHost = (TabHost) mRoot.findViewById(android.R.id.tabhost); 
     setupTabs(); 
     return mRoot; 
    } 

    private void setupTabs() { 
     mTabHost.setup(); // important! 
     mTabHost.addTab(newTab(RATE_A_PET, R.string.tabRateAPet, R.id.tabRateAPet)); 
     mTabHost.addTab(newTab(MY_RATES, R.string.tabViewMyRates, R.id.tabViewMyRates)); 
    } 

    private TabSpec newTab(String tag, int labelId, int tabContentId) { 
     Log.d(TAG, "buildTab(): tag=" + tag); 

     View indicator = LayoutInflater.from(getActivity()).inflate(
       R.layout.tab, 
       (ViewGroup) mRoot.findViewById(android.R.id.tabs), false); 
     ((TextView) indicator.findViewById(R.id.text)).setText(labelId); 

     TabSpec tabSpec = mTabHost.newTabSpec(tag); 
     tabSpec.setIndicator(indicator); 
     tabSpec.setContent(tabContentId); 
     return tabSpec; 
    } 


    @Override 
    public void onTabChanged(String tabId) { 
     Log.d(TAG, "onTabChanged(): tabId=" + tabId); 
     if (RATE_A_PET.equals(tabId)) { 
      updateTab(tabId, R.id.tabRateAPet); 
      mCurrentTab = 0; 
      return; 
     } 
     if (MY_RATES.equals(tabId)) { 
      updateTab(tabId, R.id.tabViewMyRates); 
      mCurrentTab = 1; 
      return; 
     } 
     if (GLOBAL_RATES.equals(tabId)) { 
      updateTab(tabId, R.id.tabViewGlobalRates); 
      mCurrentTab = 2; 
      return; 
     } 
    } 
    private void updateTab(String tabId, int placeholder) { 
     FragmentManager fm = getFragmentManager(); 
     if (fm.findFragmentByTag(tabId) == null) { 
      fm.beginTransaction() 
        .replace(placeholder, new RateMyPetActivity(), tabId) 
        .commit(); 
     } 
    } 

} 
+0

請參閱本教程,如果您發現任何困難。我可以問我... http://manishkpr.webheavens.com/android-viewpager-example/ – TheFlash

+0

您也可以參考this.http:// wptrafficanalyzer。在/博客/添加導航標籤包含列表視圖到動作欄在Android/ – Shadow

回答

73

我建議建立爲每個標籤單獨的片段文件。我最近做這一樣,所以我提出了我下面的代碼:

佈局文件

activity_main.xml中

<android.support.v4.app.FragmentTabHost 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@android:id/tabhost" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

<LinearLayout 
    android:orientation="vertical" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

    <TabWidget 
     android:id="@android:id/tabs" 

     android:orientation="horizontal" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_weight="0"/> 

    <FrameLayout 
     android:id="@android:id/tabcontent" 
     android:layout_width="0dp" 
     android:layout_height="0dp" 
     android:layout_weight="0"/> 

    <FrameLayout 
     android:id="@+id/realtabcontent" 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1"/> 

</LinearLayout> 
</android.support.v4.app.FragmentTabHost> 

tab1_view.xml //使用這個格式添加相應的標籤佈局(請務必更改字符串變量)

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout 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:orientation="vertical" 
     tools:context=".DeviceFragment" > 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="@string/tab1_fragment_string" /> 

</LinearLayout> 

SRC文件

MainActivity.java //注意,在.addTab過程中我只使用了文本。您還可以使用您需要添加到hdpi文件夾的繪圖添加圖標。在這個例子中,我也只創建了三個選項卡。

package com.example.applicationname; 

import android.os.Bundle; 
import android.support.v4.app.FragmentActivity; 
import android.support.v4.app.FragmentTabHost; 

public class MainActivity extends FragmentActivity { 
    // Fragment TabHost as mTabHost 
    private FragmentTabHost mTabHost; 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 

     super.onCreate(savedInstanceState); 
     setContentView(R.layout.activity_main); 

     mTabHost = (FragmentTabHost)findViewById(android.R.id.tabhost); 
     mTabHost.setup(this, getSupportFragmentManager(), R.id.realtabcontent); 

     mTabHost.addTab(mTabHost.newTabSpec("tab1").setIndicator("Tab1"), 
      Tab1Fragment.class, null); 
     mTabHost.addTab(mTabHost.newTabSpec("tab2").setIndicator("Tab2"), 
      Tab2Fragment.class, null); 
     mTabHost.addTab(mTabHost.newTabSpec("tab3").setIndicator("Tab3"), 
      Tab3Fragment.class, null); 
    } 
} 

Tab1Fragment.java //再次複製的標籤的所需數量

package com.example.applicationname; 

import android.os.Bundle; 
import android.support.v4.app.Fragment; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 

public class Tab1Fragment extends Fragment { 

@Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, 
     Bundle savedInstanceState) { 
     // Inflate the layout for this fragment 
     View V = inflater.inflate(R.layout.tab1_view, container, false); 

     return V; 
    } 
} 

確保您的R.java和strings.xml中文件的設置是否正確,然後你的標籤應該是啓動並運行。

+0

好的。我會去檢查它。謝謝。我稍後會說,如果這對我有用:) – imarban

+1

歡迎您!很高興它幫助 –

+0

我們可以像iOS一樣將標籤移動到底部嗎? – Dharmendra