19

मेरे जैसे लोग हैं, जो कुछ TabHost और ViewPager, उंगलियों और पृष्ठों को बदलने के लिए टैब क्लिक के साथ पेज स्वाइप सहित लागू करने के लिए एक तरह से ढूंढने में कठिनाई था के लिए एक छोटी ट्यूटोरियल। दिखाया गया समाधान एंड्रॉइड संस्करण 2.2+ के साथ संगत है।ट्यूटोरियल Android 2.2 में TabHost के उपयोग को लागू करने के लिए + ViewPager और टुकड़े

इसमें टैब्स प्रारंभिक, टैब और पेज स्क्रॉलिंग प्रबंधन से जुड़े व्यूपेगर शामिल हैं।

इसकी मुख्य विशेषता एंड्रॉइड (फ्रॉयो, एपीआई संस्करण 8, एंड्रॉइड 2.2) के पुराने संस्करणों और विभिन्न उद्देश्यों के लिए सरल कार्यान्वयन के लिए अनुकूलन है।

मुझे आशा है कि यह उपयोगी होगा।

+1

आप यहां प्रोजेक्ट डाउनलोड कर सकते हैं: https://github.com/acarrer/tabhostandfragments –

उत्तर

46

ट्यूटोरियल में 4 कक्षाएं और 2 लेआउट शामिल हैं। इसका परीक्षण एंड्रॉइड फोन 2.2 के साथ किया गया है और आप कोशिश करने के लिए बस & पेस्ट कॉपी कर सकते हैं।

यह ट्यूटोरियल & सुधारों के लिए खुला है!

MainActivity.java (मुख्य गतिविधि):

package samples.tabhost.andreaoid.net; 

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.support.v4.view.ViewPager; 
import android.support.v4.view.ViewPager.OnPageChangeListener; 
import android.widget.TabHost; 
import android.widget.TabHost.OnTabChangeListener; 

public class MainActivity extends FragmentActivity implements OnTabChangeListener, OnPageChangeListener { 

    MyPageAdapter pageAdapter; 
    private ViewPager mViewPager; 
    private TabHost mTabHost; 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.activity_main); 

     mViewPager = (ViewPager) findViewById(R.id.viewpager); 

     // Tab Initialization 
     initialiseTabHost(); 

     // Fragments and ViewPager Initialization 
     List<Fragment> fragments = getFragments(); 
     pageAdapter = new MyPageAdapter(getSupportFragmentManager(), fragments); 
     mViewPager.setAdapter(pageAdapter); 
     mViewPager.setOnPageChangeListener(MainActivity.this); 
    } 

    // Method to add a TabHost 
    private static void AddTab(MainActivity activity, TabHost tabHost, TabHost.TabSpec tabSpec) { 
     tabSpec.setContent(new MyTabFactory(activity)); 
     tabHost.addTab(tabSpec); 
    } 

    // Manages the Tab changes, synchronizing it with Pages 
    public void onTabChanged(String tag) { 
     int pos = this.mTabHost.getCurrentTab(); 
     this.mViewPager.setCurrentItem(pos); 
    } 

    @Override 
    public void onPageScrollStateChanged(int arg0) { 
    } 

    // Manages the Page changes, synchronizing it with Tabs 
    @Override 
    public void onPageScrolled(int arg0, float arg1, int arg2) { 
     int pos = this.mViewPager.getCurrentItem(); 
     this.mTabHost.setCurrentTab(pos); 
    } 

    @Override 
     public void onPageSelected(int arg0) { 
    } 

    private List<Fragment> getFragments(){ 
     List<Fragment> fList = new ArrayList<Fragment>(); 

     // TODO Put here your Fragments 
     MySampleFragment f1 = MySampleFragment.newInstance("Sample Fragment 1"); 
     MySampleFragment f2 = MySampleFragment.newInstance("Sample Fragment 2"); 
     MySampleFragment f3 = MySampleFragment.newInstance("Sample Fragment 3"); 
     fList.add(f1); 
     fList.add(f2); 
     fList.add(f3); 

     return fList; 
    } 

    // Tabs Creation 
    private void initialiseTabHost() { 
     mTabHost = (TabHost) findViewById(android.R.id.tabhost); 
     mTabHost.setup(); 

     // TODO Put here your Tabs 
     MainActivity.AddTab(this, this.mTabHost, this.mTabHost.newTabSpec("Tab1").setIndicator("Tab1")); 
     MainActivity.AddTab(this, this.mTabHost, this.mTabHost.newTabSpec("Tab2").setIndicator("Tab2")); 
     MainActivity.AddTab(this, this.mTabHost, this.mTabHost.newTabSpec("Tab3").setIndicator("Tab3")); 

     mTabHost.setOnTabChangedListener(this); 
    } 
} 

MyPageAdapter.java (टुकड़ा प्रबंधक):

package samples.tabhost.andreaoid.net; 

import java.util.List; 
import android.support.v4.app.Fragment; 
import android.support.v4.app.FragmentManager; 
import android.support.v4.app.FragmentPagerAdapter; 

public class MyPageAdapter extends FragmentPagerAdapter { 
    private List<Fragment> fragments; 

    public MyPageAdapter(FragmentManager fm, List<Fragment> fragments) { 
     super(fm); 
     this.fragments = fragments; 
    } 

    @Override 
    public Fragment getItem(int position) { 
     return this.fragments.get(position); 
    } 

    @Override 
    public int getCount() { 
     return this.fragments.size(); 
    } 
} 

MyTabFactory (टैब प्रबंधक):

package samples.tabhost.andreaoid.net; 

import android.content.Context; 
import android.view.View; 
import android.widget.TabHost.TabContentFactory; 

public class MyTabFactory implements TabContentFactory { 

    private final Context mContext; 

    public MyTabFactory(Context context) { 
     mContext = context; 
    } 

    public View createTabContent(String tag) { 
     View v = new View(mContext); 
     v.setMinimumWidth(0); 
     v.setMinimumHeight(0); 
     return v; 
    } 
} 

MySampleFragment.java (एकल टुकड़ा - प्रदर्शन के उद्देश्य से शामिल है):

package samples.tabhost.andreaoid.net; 

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

public class MySampleFragment extends Fragment { 

    private static View mView; 

    public static final MySampleFragment newInstance(String sampleText) { 
     MySampleFragment f = new MySampleFragment(); 

     Bundle b = new Bundle(); 
     b.putString("bString", sampleText); 
     f.setArguments(b); 

    return f; 
    } 

    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { 

     mView = inflater.inflate(R.layout.sample_fragment, container, false); 
     String sampleText = getArguments().getString("bString"); 

     TextView txtSampleText = (TextView) mView.findViewById(R.id.txtViewSample); 
     txtSampleText.setText(sampleText); 

     return mView; 
    } 
} 

activity_main.xml:

<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:paddingBottom="@dimen/activity_vertical_margin" 
    android:paddingLeft="@dimen/activity_horizontal_margin" 
    android:paddingRight="@dimen/activity_horizontal_margin" 
    android:paddingTop="@dimen/activity_vertical_margin" 
    tools:context=".MainActivity" > 

    <TabHost 
     android:id="@android:id/tabhost" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" > 
     <LinearLayout 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:orientation="vertical" > 
      <TabWidget 
       android:id="@android:id/tabs" 
       android:orientation="horizontal" 
       android:layout_width="fill_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" /> 
      <android.support.v4.view.ViewPager 
       android:id="@+id/viewpager" 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:layout_gravity="bottom" /> 
     </LinearLayout> 
    </TabHost> 
</RelativeLayout> 

sample_fragment.xml (आप यहाँ रख सकते हैं अपने खंड लेआउट):

<?xml version="1.0" encoding="utf-8"?> 

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

    <TextView 
     android:id="@+id/txtViewSample" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentRight="true" 
     android:layout_alignParentTop="true" 
     android:text="" /> 

</RelativeLayout> 
+0

वास्तव में सहायक !! धन्यवाद एंड्रिया .. :) – Tony

+0

टैब स्विचिंग एमुलेटर पर चपटा है। टैब सामग्री स्पष्ट रूप से आकार बदल रहा है। कोई जानता है क्यों? – ajeh

+0

धन्यवाद ..... ठीक great..working ... – Sunny

संबंधित मुद्दे