B4A Library TabHostExtras

Here is a new library i have created that allows you to customise a TabHost.

TabHostExtras
Version: 2.2

• TabHostExtras
  Methods:
  • GetTagWidget (TabHost1 As TabHost) As TabWidget
    Returns TabHost1's TabWidget.
    Allowing you to customize various settings.
  • getTabContentViewPadding (tabHost1 As TabHost) As RectWrapper
    Get the layout padding of tabHost1 TabContentView
    Returns a Rect object containing pixel values
  • getTabEnabled (tabHost1 As TabHost, index As Int) As Boolean
    Get the Enabled state of TabIndicator #index in tabHost1
  • getTabHeight (tabHost1 As TabHost) As Int
    Get the height (in pixels) of the TabIndicators in tabHost1
  • getTabHostPadding (tabHost1 As TabHost) As RectWrapper
    Get the layout padding of tabHost1 container View
    Returns a Rect object containing pixel values
  • getTabIcon (tabHost1 As TabHost, TabIndex As Int) As ImageViewWrapper
    Get the (icon) ImageView of TabIndicator #TabIndex in tabHost1
  • getTabTextSize (tabHost1 As TabHost) As Float
    Get the text size (in pixels) of all TabIndicators
  • getTabVisibility (tabHost1 As TabHost, index As Int) As Boolean
    Get the visibility of TabIndicators #index in tabHost1
  • setTabContentViewPadding (tabHost1 As TabHost, left As Int, top As Int, right As Int, bottom As Int)
    Set the layout padding (in dip) of tabHost1 TabContentView
  • setTabEnabled (tabHost1 As TabHost, enabled As Boolean)
    Enable or disable all TabIndicators in tabHost1
  • setTabEnabled2 (tabHost1 As TabHost, enabled As Boolean, index As Int)
    Enable or disable TabIndicator #index in tabHost1
  • setTabGradientDrawable (tabHost1 As TabHost, orientation As String, color1 As Int, color2 As Int, cornerRadius As Float)
    Set a GradientDrawable as the background on all TabIndicators in tabHost1
    All fours corner radii of the GradientDrawable are set to the value of cornerRadius (in pixels)
  • setTabGradientDrawable2 (tabHost1 As TabHost, orientation As String, color1 As Int, color2 As Int, cornerRadius() As Float)
    Set a GradientDrawable as the background on all TabIndicators in tabHost1
    Corner radii of the GradientDrawable are set individually (in pixels) based upon the number of elements in the array cornerRadius:
    1 element defines all corner radii
    2 elements define corner radii in order top left and right, bottom left and right
    4 elements define corner radii in order top-left, top-right, bottom-right, bottom-left
  • setTabHeight (tabHost1 As TabHost, tabHeight As Int)
    Set the height (in pixels) of all TabIndicators in tabHost1
  • setTabHostPadding (tabHost1 As TabHost, left As Int, top As Int, right As Int, bottom As Int)
    Set the layout padding (in dip) of tabHost1 container View
  • setTabTextColor (tabHost1 As TabHost, Color As Int)
    Set the color to be used for all tab indicators text.
    This color will be used for all tab indicators regardless of their selected state.
  • setTabTextColorStateList (tabHost1 As TabHost, ColorStateListName As String)
    Set a ColorStateList to be used for the text color of all tab indicators.
    The ColorStateList must be defined in XML in your application Objects/res/drawable folder.
    Color for selected and not selected tab state can be defined.
  • setTabTextSize (tabHost1 As TabHost, TextSize As Float)
    Set the text size of all TabIndicators
    TextSize is assumed to be in units of dip.
  • setTabTitle (tabHost1 As TabHost, Title As String, TabIndex As Int)
    Set the Title text of TabIndicator #TabIndex in tabHost1
  • setTabVisibility (tabHost1 As TabHost, visible As Boolean)
    Set the visibility of all TabIndicators in tabHost1
  • setTabVisibility2 (tabHost1 As TabHost, visible As Boolean, index As Int)
    Set the visibility of TabIndicator #index in tabHost1
• TabWidget
  Methods:
  • BringToFront
  • GetChildTabViewAt (TabIndex As Int) As View
    Returns the tab indicator view at the given index.
    The returned View will be a ViewGroup with 2 child Views:
    An ImageView at index 0 and a TextView at Index 1.
  • GetTabIcon (TabIndex As Int) As ImageViewWrapper
    Get the (icon) ImageView of the tab indicator view at the given index.
  • GetTabLabel (TabIndex As Int) As LabelWrapper
    Get the (TextView) Label of the tab indicator view at the given index.
  • Initialize (arg1 As String)
  • Invalidate
  • Invalidate2 (arg0 As Rect)
  • Invalidate3 (arg0 As Int, arg1 As Int, arg2 As Int, arg3 As Int)
  • IsInitialized As Boolean
  • RemoveView
  • RequestFocus As Boolean
  • SendToBack
  • SetBackgroundImage (arg0 As Bitmap)
  • SetLayout (arg0 As Int, arg1 As Int, arg2 As Int, arg3 As Int)
  Properties:
  • Background As Drawable
  • Color As Int [write only]
  • DividerDrawable As Drawable [write only]
    Sets the drawable to use as a divider between the tab indicators.
  • Enabled As Boolean
    Get or Set the enabled state of the TabWidget.
  • Height As Int
  • Left As Int
  • LeftStripDrawable As Drawable [write only]
    Sets the drawable to use as the left part of the strip below the tab indicators.
  • RightStripDrawable As Drawable [write only]
    Sets the drawable to use as the right part of the strip below the tab indicators.
  • StripEnabled As Boolean
    Get or Set whether the bottom strips on the tab indicators are drawn or not.
  • TabCount As Int [read only]
    Get the number of tab indicator views.
  • Tag As Object
  • Top As Int
  • Visible As Boolean
  • Width As Int

Attached are the library files and a little demo.
If you run the demo try your device's 'Menu' key and toggle the tabs from visible to hidden.

I originally created this functionality in a code module and once it was working created the library.
So i have attached the code module as a separate attachment in case anyone wants to use it - the Reflection library is required if you use the code module but is not required if you use the library of course.

The code module has a Sub (not included in the library):

GetTabIndicators(TabHost1 As TabHost) As View()

This will return an array of Views, these Views are the TabHost's TabIndicators.
Anyone hoping to further customise the look of a TabHost may find this Sub useful - see the code module demo for an example of changing the TabIndicators' Color property.

Martin.

 

[AscySoft]

Is text size of tab heading adjustable ?

Good question. What about its color? (or I am missing something)

 

[peacemaker]

Is text size of tab heading adjustable ?

No news about this ? Impossible at all ?

 

[latcc]

When I use your tab library I get the attached image.

But the spaces between each tab are lost. The only way to differentiate between tabs is to curve the tabs' upper corners. Your library merges all the tabs together. Any way to keep them looking separate as with the normal tab display?

 

[neelmon]

Selected Tab Back Color

Hi There,

Is it possible to change the Selected Tab Background Color only? Is so, then how?

Regards,
KS

 

[TomDuncan]

Is text size of tab heading adjustable ?

Any word on Text size and colour for the Tabhost as yet?

 

[latcc]

I think he's no longer around.

 

[warwound]

Hi all.

Yes i'm still around!

B4A is a hobby for me and i have no time for it when i have work to do so my apologies there.

Anyway the big hurdle here is that TabHostExtras is not a simple wrapper type of library...

The library's original few methods all worked fine, but as i added more methods i ran into a problem.
The default B4A TabHost is created and passed to a method - it is an object that has been constructed.

The last few feature requests are actions that need to be performed in the TabHost constructor.
Trying to change the default TabHost's properties and behaviour after it has been constructed is problematic.
The changes are not properly applied - look at this post, see how the modified TabHost is not properly rendered?

The TabIndicators have no space between them and the TabStrip does not properly re-render itself when a Tab is hidden.

Setting the TextSize of a TabIndicator may be possible as requested here.

But i suspect that setting the selected TabIndicator background color would be a problem.

Anyway my point is i don't have the time to investigate what can and what can't be done.

I'd be happy to export the Eclipse project and attach it to this thread if anyone else is interested in updating it - is anyone interested?

Martin.

 

[Ricky D]

I can't get it to work

I have downloaded the the code and the sample project works.

But when I try to put it into my app the TabHostExtras isn't coming up in the ide.

I have a reference to the library v1.5

What am I missing?

regards, Ricky

Disregard - I managed to get it working

 

[jprovan]

Sure, export the code. I would be happy to look at it and support it.

 

[warwound]

OK here's the exported Eclipse project.

If you look at the .classpath file you'll see that i've got three external archives added to the build path:

<?xml version="1.0" encoding="UTF-8"?>
<classpath>
   <classpathentry kind="src" path="src"/>
   <classpathentry kind="con" path="org.eclipse.jdt.launching.JRE_CONTAINER"/>
   <classpathentry kind="lib" path="C:/Program Files (x86)/Android/android-sdk/platforms/android-8/android.jar"/>
   <classpathentry kind="lib" path="C:/Program Files (x86)/Anywhere Software/Basic4android/Libraries/B4AShared.jar"/>
   <classpathentry kind="lib" path="C:/Program Files (x86)/Anywhere Software/Basic4android/Libraries/Core.jar"/>
   <classpathentry kind="output" path="bin"/>
</classpath>

If those libraries are in different locations on your computer then (once you have imported the project into eclipse), right click the project title select Build Path then Configure BuildPath to set the correct paths.

In the src folder you'll see the source code for the current version 1.5 of TabHostExtras and also TabHostExtrasTemp.java 1.51 which would have been the next update.

It contains just two new untested methods:

setTabStripDrawable(TabHost, ColorDrawable, Drawable)

setTabStripEnabled(TabHost, boolean)

These new methods as i mentioned in my last post are problematic...

The B4A TabHost has been created and initialised, it is passed to a TabHostExtras (static) method where we attempt to modify it.
Some methods work as desired and others have unpredictable consequences.

Be sure to keep this thread updated with your progress!

Martin.

 

[touchvip]

TabHostExtras Compile Error

TabHostExtras Compile Error，Show Error description: Unknown type: reflector

Line 10: Dim Reflector1 As Reflector

 

[Erel]

You should add a reference to the Reflection library.

The list of libraries is available here: Libraries - Basic4android Wiki

 

[warwound]

I think you've downloaded the old Code module and not the new library.

This project started off as a Code module and then i made it into a library.
The first post in this thread contains links to both the Code module and the latest version of the library.

You want TabHostExtras_v1.5.zip and NOT TabHostExtrasCodeModule.zip.

Martin.

 

[touchvip]

uses 1.5 There is no error

TabHostExtrasCodeModule run is just a black screen

 

[warwound]

TabHostExtrasCodeModule run is just a black screen

I've download and run the TabHostExtrasCodeModule.zip and it work ok here on a 480x800 Froyo emulator.

Screenshot attached.

What device or emulator are you trying to run it on?

Also - is there a reason you are trying to use the code module and not the library?
The code module has very few features compared to the library.
The only reason you might want to use the code module is if you're trying to implement features that are not part of the library.

Martin.

 

[warwound]

I have updated TabHostExtras to version 1.6.

Just one new method to document:

setTabTitle (tabHost1 As TabHost, Title As String, TabIndex As Int)

Set the text of the tab indexed by TabIndex to the String Title.

This code will update the text of the currently selected tab:

MyTabHostExtras.setTabTitle(MyTabHost, "A new title", TabHost1.CurrentTab)

The code for this new method gets access to the TextView that displays the TabIndicator title text.
So i imagine that updating the style of that TextView should be possible now - setting FontSize and Color for example.
I'll look at that another day though, i'm too busy to look at it today.

I've added the new version to the first post in this thread.

Martin.

 

[Jost aus Soest]

Great library!

You've saved my day! (e. g. setTabTitle and setTabVisibility2)
:sign0142:

 

[warwound]

TabHostExtras updated to version 1.7

I have added two new methods to get and set the size of the tab indicator text:

getTabTextSize (tabHost1 As TabHost) As Float

Get the text size (in pixels) of the TabIndicator text.

setTabTextSize (tabHost1 As TabHost, TextSize As Float)

Set the text size of the TabIndicator text
TextSize is assumed to be in units of dip.

Example code:

Log("The current TabIndicator TextSize is: "&MyTabHostExtras.getTabTextSize(TabHost1)&" pixels")   '   returns 14 on Froyo 2.2 emulator
   
'   set the TabIndicator TextSize to 20dip
MyTabHostExtras.setTabTextSize(TabHost1, 20)
   
Log("The new TabIndicator TextSize is: "&MyTabHostExtras.getTabTextSize(TabHost1)&" pixels")   '   return value depends on device density

I was hoping to add methods to set the text color, but as it would have involved wrapping the Android ColorStateList Class it would take more time than i have to spare at the moment.
Maybe another day i'll look at that..

Anyway TabHostExtras version 1.7 is attached to the first post in this thread.

Martin.

 

[thedesolatesoul]

Hi Martin,

A couple of questions:

1/ Regarding the adding to setting the TabIndicator TextColor (I thnk thats what the individual tabs are called?). Can you give me a pointer where I can find the TextColor property (I mean in terms of where that object exists). And I will try to add a method to change it.

2/ Is it possible to get the width of a Tab? I tried the following (similar to height) but it didnt seem to work properly.

@ShortName("TabWidth")
   public static int getTabWidth(TabHost tabHost1)
     {
       return tabHost1.getTabWidget().getChildAt(0).getLayoutParams().width;
     }

3/ I have added a method for setting the statelistdrawable. It seems to work fine, but it requires that I know the width/height of a tab to work.

   @ShortName("setTabSLD") 
   public static void setTabSLD(TabHost tabHost1, StateListDrawable sld)
     {
       TabWidget tabWidget1 = tabHost1.getTabWidget();
       int tabCount = tabWidget1.getChildCount();
       while (tabCount-- > 0)
         tabWidget1.getChildAt(tabCount).setBackgroundDrawable(sld);
     }

And thank you for the library and source code.

 

[warwound]

Hi.

This method should help you:

/**
 * Set the text size of all TabIndicators
 *TextSize is assumed to be in units of dip.
 */
public void setTabTextSize(TabHost tabHost1, float TextSize){
   TabWidget tabWidget1 = tabHost1.getTabWidget();
   int tabCount = tabWidget1.getChildCount();
   while (tabCount-- > 0) {
      RelativeLayout rLayout = (RelativeLayout) tabWidget1.getChildAt(tabCount);
      ((TextView) rLayout.getChildAt(1)).setTextSize(TextSize);
   }
}

rLayout.getChildAt(0) is the TabIndicator ImageView.

and

rLayout.getChildAt(1) is the TabIndicator TextView.

You may need to look at the documentation for RelativeLayout but i suspect the ImageView and/or TextView will give you the values you want.

Martin.