TabHost example

Erel

Administrator
Staff member
Licensed User
In this example we will create one layout with a TabHost that fills the entire screen. Using a custom class which you can use in your own project we will add three tabs to the TabHost by loading additional three layout files.
The class is included in the attached zip file.

The first layout (MainLayout) consists of a single TabHost.
Using the following script the TabHost is set to fill the entire available screen:
B4X:
'All variants script
TabHost1.SetLeftAndRight(0, 100%x)
TabHost1.SetTopAndBottom(0, 100%y)
We also set the NativeClass property to: .ExtendedTabHost
At runtime our class will be instantiated instead of the standard TabHost.

The ExtendedTabHost includes a helper method named extendedAddTab which is useful for adding tabs.
It expects 4 arguments:
- Tab title
- Default bitmap (for the title)
- Selected bitmap (for the title)
- The tab page view.

We will create 3 tabs based on three different layout files:
B4X:
   @Override
   public void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      Designer4android d4a = new Designer4android("MainLayout");
      ViewGroup vg = d4a.loadLayout(this, this);
      setContentView(vg);
   }
   public void onLayoutLoaded(Designer4android d4a, boolean success, Exception e) {
      if (!success) {
         Log.e("MyTag", "Error loading layout file", e);
         finish(); //close the activity
         return;
      }
      ExtendedTabHost tabHost1 = (ExtendedTabHost)d4a.getView("TabHost1");
      tabHost1.extendedAddTab("", BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher), 
            BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher),
            new Designer4android("Tab1Layout").loadLayout(this, null));
      tabHost1.extendedAddTab("tab 2", null, null, new Designer4android("Tab2Layout").loadLayout(this, null));
      tabHost1.extendedAddTab("tab 3", null, null, new Designer4android("Tab3Layout").loadLayout(this, null));
      
   }
The result is:

 

Attachments

Top