How to Implement Tab labels for Android-combination of ActivityGroup and GridView

In the previous section, we have introduced three methods for implementing Tab paging by combining TabActivity and TabHost. Here, we will introduce the combination of ActivityGroup and GridView to implement Tab paging. In fact, this is similar to TabActivity and TabHost. However, you can separate the Tab header (option bar) from the page view. The Tab header is implemented using the GridView, and the sub-page is implemented using the LinearLayout container. Then, each sub-Activity is loaded into the LinearLayout container as a View. You will find that LinearLayout is not just a layout container, but also has many advantages.

Implementation:

1. The main class inherits the ActivityGroup

Public class GridViewTabPage extends ActivityGroup

2. Obtain the Activity view of each subpage

Intent intent = new Intent (GridViewTabPage. this, Page1.class );

SubPageView = getLocalActivityManager (). startActivity (
"SubPageView" + I, intent );

3. Load to container

PageContainer. addView (subPageView. getDecorView (),
LayoutParams. FILL_PARENT, LayoutParams. FILL_PARENT );

1. layout XML file: main. xml

<? Xml version = "1.0" encoding = "UTF-8"?> <Br/> <LinearLayout <br/> android: id = "@ + id/gridViewTab" <br/> android: layout_width = "fill_parent" <br/> android: layout_height = "fill_parent" <br/> xmlns: android = "http://schemas.android.com/apk/res/android" <br/> android: orientation = "vertical" <br/> <GridView <br/> android: id = "@ + id/gv_tabPage" <br/> android: layout_width = "fill_parent" <br/> android: layout_height = "wrap_content" <br/> android: numColumns = "3" <br/> </GridView> <br/> <LinearLayout <br/> android: id = "@ + id/pageContainer" <br/> android: layout_below = "@ + id/gvTopBar" <br/> android: layout_width = "fill_parent" <br/> android: layout_height = "fill_parent"> <br/> </LinearLayout> </p> </LinearLayout> <br/>

 

2. Code file:

Image adapter: ImageAdapter. java

Package com. myandroid. test; </p> <p> import android. content. context; <br/> import android. graphics. color; <br/> import android. util. log; <br/> import android. view. view; <br/> import android. view. viewGroup; <br/> import android. widget. baseAdapter; <br/> import android. widget. gridView; <br/> import android. widget. imageView; </p> <p> public class ImageAdapter extends BaseAdapter {<br/> private Context context; <br/> private int width; <br/> private int height; <br/> private ImageView [] imageViews; <br/> private Integer [] imgeIDs; </p> <p> public ImageAdapter (Context context, Integer [] imageIDs, int width, int height) {<br/> this. context = context; <br/> this. imgeIDs = imageIDs; <br/> this. width = width; <br/> this. height = height; <br/> imageViews = new ImageView [imageIDs. length]; <br/> for (int I = 0; I <imageViews. length; I ++) {<br/> imageViews [I] = new ImageView (context ); <br/>}</p> <p> public int getCount () {<br/> // TODO Auto-generated method stub <br/> return imgeIDs. length; <br/>}</p> <p> public Object getItem (int position) {<br/> // TODO Auto-generated method stub <br/> return position; <br/>}</p> <p> public long getItemId (int position) {<br/> // TODO Auto-generated method stub <br/> return position; <br/>}</p> <p>/** <br/> * click Settings <br/> * @ param selectedID <br/> */<br/> public void setFocus (int selectedID) {<br/> Log. e ("Seqence", "setFocus"); <br/> for (int I = 0; I <imageViews. length; I ++) {<br/> imageViews [I]. setBackgroundColor (Color. BLACK); <br/>}< br/> imageViews [selectedID]. setBackgroundColor (Color. YELLOW ); <br/>}</p> <p>/** <br/> * image Settings <br/> */<br/> public View getView (int position, view convertView, ViewGroup parent) {<br/> // TODO Auto-generated method stub <br/> Log. e ("Seqence", "getView"); <br/> imageViews [position]. setImageResource (imgeIDs [position]); <br/> imageViews [position]. setLayoutParams (new GridView. layoutParams (width, height); <br/> imageViews [position]. setBackgroundColor (android. r. drawable. picture_frame); </p> <p> return imageViews [position]; <br/>}</p> <p >}< br/>

 

Master File: GridViewTabPage. java

Package com. myandroid. test; </p> <p> import android. app. activityGroup; <br/> import android. content. intent; <br/> import android. graphics. color; <br/> import android. graphics. drawable. colorDrawable; <br/> import android. OS. bundle; <br/> import android. util. log; <br/> import android. view. gravity; <br/> import android. view. view; <br/> import android. view. window; <br/> import android. view. viewGroup. layoutParams; <Br/> import android. widget. adapterView; <br/> import android. widget. gridView; <br/> import android. widget. linearLayout; <br/> import android. widget. adapterView. onItemClickListener; </p> <p> public class GridViewTabPage extends ActivityGroup {</p> <p> private GridView gv_tabPage; // top Tab <br/> private ImageAdapter imageAdapter; // image adapter <br/> public LinearLayout pageContainer; // container for storing sub-pages <br/> private Intent [] Intents; // page Jump Intent <br/> private Window [] subPageView; // View of the subpage <br/> private Integer [] tabImages = {R. drawable. a1, // tab icon <br/> R. drawable. a2, R. drawable. a3 ,}; </p> <p >@override <br/> public void onCreate (Bundle savedInstanceState) {<br/> super. onCreate (savedInstanceState); <br/> setContentView (R. layout. main); <br/> Log. e ("Sequence", "start"); // used for testing <br/> gv_tabPage = (GridView) findViewById (R. id. g V_tabPage); <br/> gv_tabPage.setNumColumns (tabImages. length); // set the number of columns <br/> gv_tabPage.setSelector (new ColorDrawable (Color. TRANSPARENT); // The TRANSPARENT color when selected <br/> gv_tabPage.setGravity (Gravity. CENTER); // CENTER <br/> gv_tabPage.setVerticalSpacing (0); // vertical interval <br/> int width = this. getWindowManager (). getdefadisplay display (). getWidth () // obtain the screen width <br/>/tabImages. length; // width equally divided <br/> imageAdapter = new ImageAdapter (this, ta BImages, width, 48); // create an image adapter and transmit the height and width required for the image. <br/> gv_tabPage.setAdapter (imageAdapter ); // set the menu Adapter <br/> gv_tabPage.setOnItemClickListener (new ItemClickEvent (); // register the click event <br/> pageContainer = (LinearLayout) findViewById (R. id. pageContainer); <br/> SwitchPage (0); // page 0th is displayed by default. <br/> Log. e ("Sequence", "end"); <br/>}</p> <p> class ItemClickEvent implements OnItemClickListener {</p> <p> public void onItemClick (Adapte RView <?> Arg0, View arg1, int arg2, <br/> long arg3) {<br/> SwitchPage (arg2); // arg2 indicates the Selected Tab number, from 0 ~ 2 <br/>}</p> <p>/** <br/> * used to obtain intent and pageView, <br/> * similar to the singleton mode, the object does not need to be created repeatedly. At the same time, the status of the previous object is retained <br/> * The original data status is retained when the object is accessed again, such as the value in the text box. <Br/> * @ param pageID the Selected tab number (0 ~ 2) <br/> * @ return <br/> */<br/> private Window getPageView (int pageID) {<br/> if (intents = null) {<br/> intents = new Intent [3]; <br/> subPageView = new Window [3]; <br/> intents [0] = new Intent (GridViewTabPage. this, Page1.class); <br/> intents [1] = new Intent (GridViewTabPage. this, Page2.class); <br/> intents [2] = new Intent (GridViewTabPage. this, Page3.class); <br/> for (int I = 0; I <3; I ++) {<br/> subPageView [I] = getLocalActivityManager (). startActivity (<br/> "subPageView" + I, intents [I]); <br/>}< br/> Log. e ("New", "new"); <br/>}</p> <p> return subPageView [pageID]; <br/>}</p> <p>/** <br/> * Open the specified PageActivity by ID <br/> * @ param id: tab number of the selected item <br/> */<br/> private void SwitchPage (int id) <br/>{< br/> pageContainer. removeAllViews (); // all views in the container must be cleared first <br/> imageAdapter. setFocus (id); <br/> Window pageView = null; <br/> switch (id) {// obtain the subpage View <br/> case 0: <br/> pageView = getPageView (0); <br/> break; <br/> case 1: <br/> pageView = getPageView (1 ); <br/> break; <br/> case 2: <br/> pageView = getPageView (2); <br/> break; <br/> default: <br/> break; <br/>}< br/> // load the sub-page View to the LinearLayout container. <br/> pageContainer. addView (pageView. getDecorView (), <br/> LayoutParams. FILL_PARENT, LayoutParams. FILL_PARENT); <br/>}< br/>}

 

3. Add Activity registration information in AndroidManifest. xml.

<? Xml version = "1.0" encoding = "UTF-8"?> <Br/> <manifest xmlns: android = "http://schemas.android.com/apk/res/android" <br/> package = "com. myandroid. test "<br/> android: versionCode =" 1 "<br/> android: versionName =" 1.0 "> <br/> <application android: icon = "@ drawable/icon" android: label = "@ string/app_name"> <br/> ................ <br/> <! -- The declaration of the Activity to be added; otherwise, the system cannot find the file and reports an error --> <br/> <activity android: name = "Page1"> </activity> <br/> <activity android: name = "Page2"> </activity> <br/> <activity android: name = "Page3"> </activity> <br/> </application> <br/> </manifest>

 

Similarly, if there are too many Tab options, you can useGrally + ActivityGroupIntegration. The specific implementation method is similar to the combination of ActivityGroup and GridView, which can be implemented by the reader.