[B4X] [XUI] AS Tab Menu (Bottom Menu/Navigation)

[ggpanta]

But that way I change the color of all the tab. I want to change the color of just a specific tab.

You can add something like this in the menu (ASTabMenu.bas):

Public Sub setTabBG (index As Int, colour As Int)
    Dim tmp_tab As B4XView = xpnl_tabbase.GetView(index)
    tmp_tab.Color = colour
End Sub

After, using:

MainTabMenu.setTabBG(0, Colors.Green)

Will change the bg colour of the selected tab.

 

[ggpanta]

@Alexander Stolte

These are some additions of mine you might find useful:

Public Sub setTabBG (index As Int, colour As Int)
    Dim tmp_tab As B4XView = xpnl_tabbase.GetView(index)
    tmp_tab.Color = colour
End Sub

Public Sub getTabCount() As Int
    Return xpnl_tabbase.NumberOfViews
End Sub

Public Sub getTabSelected() As Int
    For i = 0 To getTabCount -1
        Dim tmp_tab As B4XView = xpnl_tabbase.GetView(i)
        Dim tmp_Text As B4XView = tmp_tab.GetView(0)
     
        If tmp_Text.TextColor == g_SelectedTabTextColor Then
            Return i
        End If
    Next
    Return -1
End Sub

Public Sub setTabUnderlineSize(width As Int)
        Dim tmp_tab As B4XView = xpnl_underline
        
        If width = -1 Then
            width = xpnl_tabbase.GetView(0).Width / 2
        End If
        
        tmp_tab.Left = xpnl_tabbase.GetView(getTabSelected).Left + ( xpnl_tabbase.GetView(getTabSelected).Width - width ) / 2
        tmp_tab.Width = width
End Sub

Note: The getTabSelected obviously will break if the user does not have a different text colour for the active/selected tab, but it suits me and I didn't want to change the tab creation to add an indicator in the component to keep my changes compatible with future updates of yours.

This is a very nice menu btw thanks for making it

 

[M.G.R]

Please how to change icons?

 

[M.G.R]

and how to add an URL for every tab?
sorry i am new in this

 

[ggpanta]

Please how to change icons?

You add the icon either while creating the Tab:

TabMenu.AddTab(xui.Color_ARGB(255, 154, 197, 239), "Home", TabMenu.FontToBitmap(Chr(0xF015), False, 15, xui.Color_White), "")

or by using .setTabIcon():

TabMenu.setTabIcon(0, TabMenu.FontToBitmap(Chr(0xF015), False, 15, xui.Color_White))

and how to add an URL for every tab?
sorry i am new in this

Where exactly would you like to add the URL ? Note that using a URL for the text of each tab will make it look a bit ugly on most devices since it will be too long.

 

[M.G.R]

Where exactly would you like to add the URL ? Note that using a url for the text of each tab will make it look a bit ugly on most devices since it will be too long.

no, i mean when i click on home icon for example, i go to home page, and if i click on Categorise, i go to Categorise section on my site
i use webview

also how to make the size bigger between icon and text

 

[Alexander Stolte]

and how to add an URL for every tab?

Use the tag property to put a url to a tab, you can set a tag by adding a new tab or at runtime with the property ".setTabTag"
The tag is the last parameter in the add tab function: ASTabMenu1.AddTab(xui.Color_ARGB(255,39, 174, 97),"Test",Null,"PutYourURLHere")

 

[Alexander Stolte]

also how to make the size bigger between icon and text

On line 230 is the relevant code for this:

    If isHorizontal = True Then
            xlbl_text.SetLayoutAnimated(0,0,xpnl_base.Height/2,xpnl_base.Width,txt_height)
                ximg_icon.SetLayoutAnimated(0,xpnl_base.Width/2 - icon_height/2 ,xpnl_base.Height/2 - icon_height/1.5,icon_height,icon_height)
            Else
                xlbl_text.SetLayoutAnimated(0,0,xpnl_base.Height/2,xpnl_base.Width,txt_height)
                ximg_icon.SetLayoutAnimated(0,xpnl_base.Width/2 - icon_height/2 ,xpnl_base.Height/2 - icon_height/1.5,icon_height,icon_height)
                End If

change the "icon_height/1.5" to "icon_height/1.6"

 

[Alexander Stolte]

getTabSelected()

Oh i forgot the CurrentIndex property. I have a better code for it because I already have it with me internally

getTabCount()

use the: "TabSize" property

setTabUnderlineSize

Use this property: "UnderLineHeight"

Update
V1.04
-Add getCurrentIndex - gets the current tab index
-Add getTabBackgroundColor and setTabBackgroundColor - gets or sets the tab background color

 

[M.G.R]

Use the tag property to put a url to a tab, you can set a tag by adding a new tab or at runtime with the property ".setTabTag"
The tag is the last parameter in the add tab function: ASTabMenu1.AddTab(xui.Color_ARGB(255,39, 174, 97),"Test",Null,"PutYourURLHere")

i have put my URL but when i click on tab it do nothing

    ASTabMenu_horizontal.AddTab(xui.Color_ARGB(255,17, 127, 64),"Home",LoadBitmap(File.DirAssets,"Home.png"),"https://www.google.com")

do i miss anything?

 

[Alexander Stolte]

do i miss anything?

yes, the tag property is a place to store informations for a tab. If you click on a Tab then you can get the tag from the selected tab from the index and put the url into your webview.

 

[Jorge M A]

You need to handle it yourself in TabClick event.
EDIT: Alexander beat me for a microseconds....

 

[M.G.R]

You need to handle it yourself in TabClick event.

Great, its worked now

If index = 1 Then
        WebView1.LoadUrl("https://www.yahoo.com")
    End If
    
    If index = 2 Then
        WebView1.LoadUrl("https://www.msn.com")
    End If

Thank you Jorge M A, Thank you Alexander Stolte

 

[M.G.R]

Another quesion,
How to upgrade to V1.04 ?
did i lose all my settings?

 

[Jorge M A]

did i lose all my settings?

I don't think so. Less so in this version that adds methods and not properties.
Update the library, open your project, open your layout with the designer and save the file.
You should have no problem running it.

 

[Alexander Stolte]

did i lose all my settings?

you never lose your settings, not even if I add another property to the designer.

 

[jose luis gudino]

I congratulate you, excellent library
Thank you
(ASTabMenu
Author: Alexander Stolte
Version: 1.02 )

 

[giannimaione]

is there a scrollview property?
how to solve ASTabMenu (vertical mode) when there are many .AddTab ;
now i use ASTabMenu 1.04 for B4J

 

[Alexander Stolte]

is there a scrollview property?

this is not planned for this view, because then there would be another dependency on the xcustomlistview.

how to solve ASTabMenu (vertical mode) when there are many .AddTab ;

what do you mean?

 

[giannimaione]

is there a scrollview property?
your answer:

this is not planned for this view, because then there would be another dependency on the xcustomlistview.