TabHost example


B4X founder
Staff member
Licensed User
Longtime 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:
'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:
   public void onCreate(Bundle savedInstanceState) {
      Designer4android d4a = new Designer4android("MainLayout");
      ViewGroup vg = d4a.loadLayout(this, this);
   public void onLayoutLoaded(Designer4android d4a, boolean success, Exception e) {
      if (!success) {
         Log.e("MyTag", "Error loading layout file", e);
         finish(); //close the activity
      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:



    954 bytes · Views: 989