B4J Question [Solved] How to make my own multi-colered icons for AS_TabMenuAdvanced?

[MicroDrie]

With AS TabMenu Advanced I want to use my own multicolor "icons". The AS_TabMenuAdvanced uses a 256 pixels x 256 pixels and 97 dpi and 32 bit monochrome png image.
The icon I created is displayed as a square colored block, while the same icon is displayed correctly in an image view. I did find a comment in one of the posts that a multi color option would be added, but I can't find that and I can't find anything about how to create your own icon.

How do I create a usable icon that displays correctly in AS_TabMenuAdvanced?

 

[Alexander Stolte]

If you give me an example project, then I can see what the problem is.

 

[MicroDrie]

This is the result whereby under the AS_TabMenuAdvanced the left image use an ImageView and the right one is a display with B4XImageView.

Perhaps the problem can be traced back to the fact that my icon image contains more detail, although the image (created as an export from EdrawMax and scaled down to the same dimensions and resolutions as the other working images) displays correctly in both the mageView, and in the B4XImageView.

I am aware that I am pushing the boundaries of what you can do with this fantastic menu. My goal is to provide a complete overview at a glance through BadgeValue of the number of items and the name of the menu item, I can also indicate a status.

Edit: Missing project added.

 

[Alexander Stolte]

If you give me an example project, then I can see what the problem is.

 

[MicroDrie]

My project zip file was to large, this is the code:

Sub Class_Globals
    Private Root As B4XView
    Private xui As XUI
    Private AS_TabMenuAdvanced_Design1 As AS_TabMenuAdvanced
    
    Private ImageView1 As ImageView
    Private B4XImageView1 As B4XImageView
End Sub

Public Sub Initialize
    
End Sub

'This event will be called once, before the page becomes visible.
Private Sub B4XPage_Created (Root1 As B4XView)
    Root = Root1
    Root.LoadLayout("frm_main")
    
    Dim bmp As B4XBitmap = xui.LoadBitmap(File.DirAssets, "DocType.png")
    FillImageToView(bmp, ImageView1)
    
    B4XImageView1.Bitmap = bmp
    B4XPages.SetTitle(Me,"AS_TabMenuAdvanced")
    
    'Design #1
'    AS_TabMenuAdvanced_Design1.Index = 2
    AS_TabMenuAdvanced_Design1.CornerRadius = AS_TabMenuAdvanced_Design1.mBase.Height
    AS_TabMenuAdvanced_Design1.IndicatorVisible = True
    AS_TabMenuAdvanced_Design1.IndicatorProperties.Color = xui.Color_White
    AddTabs(AS_TabMenuAdvanced_Design1)

End Sub

Private Sub AddTabs(TabMenu As AS_TabMenuAdvanced)
    
'    TabMenu.AddTab("DocType",B4XImageView1.mBase.SetBitmap(B4XImageView1.Bitmap), B4XImageView1.Bitmap)
    TabMenu.AddTab("DocType",xui.LoadBitmap(File.DirAssets,"DocType.png"),xui.LoadBitmap(File.DirAssets,"home_inactive.png"))
    TabMenu.AddTab("HTML",xui.LoadBitmap(File.DirAssets,"parking_active.png"),xui.LoadBitmap(File.DirAssets,"parking_inactive.png"))
    TabMenu.AddTab("Head",xui.LoadBitmap(File.DirAssets,"maps_active.png"),xui.LoadBitmap(File.DirAssets,"maps_inactive.png"))
    TabMenu.AddTab("Body",xui.LoadBitmap(File.DirAssets,"maps_active.png"),xui.LoadBitmap(File.DirAssets,"maps_inactive.png"))
    TabMenu.AddTab("Create",xui.LoadBitmap(File.DirAssets,"maps_active.png"),xui.LoadBitmap(File.DirAssets,"maps_inactive.png"))
    
'    --- Reset all items count
    TabMenu.GetTab(0).xTab.BadgeValue = 2
    TabMenu.GetTab(1).xTab.BadgeValue = 0
    TabMenu.GetTab(2).xTab.BadgeValue = 0
    TabMenu.GetTab(3).xTab.BadgeValue = 0
    TabMenu.GetTab(4).xTab.BadgeValue = 0
    
    TabMenu.Refresh
    AS_TabMenuAdvanced_Design1.GetTab(0).xTab.Text = "Not used"
    AS_TabMenuAdvanced_Design1.Refresh
End Sub

Sub FillImageToView(bmp As B4XBitmap, ImageView As B4XView)
    Dim bmpRatio As Float = bmp.Width / bmp.Height
    Dim viewRatio As Float = ImageView.Width / ImageView.Height
    If viewRatio > bmpRatio Then
        Dim NewHeight As Int = bmp.Width / viewRatio
        bmp = bmp.Crop(0, bmp.Height / 2 - NewHeight / 2, bmp.Width, NewHeight)
    Else if viewRatio < bmpRatio Then
        Dim NewWidth As Int = bmp.Height * viewRatio
        bmp = bmp.Crop(bmp.Width / 2 - NewWidth / 2, 0, NewWidth, bmp.Height)
    End If
    Dim scale As Float = 1
    #if B4i
    scale = GetDeviceLayoutValues.NonnormalizedScale
    #End If
    ImageView.SetBitmap(bmp.Resize(ImageView.Width * scale, ImageView.Height * scale, True))
End Sub

The layout contaits the AS_TabMenuAdvanced_Design1, an ImageView1 and a B4XImageView1

 

[Alexander Stolte]

Delete the object folder in the zip and the auto backup and send the example project.

I don't need the code, I need an example project which shows the error along with the affected icon.

 

[MicroDrie]

B4I and B4A directory deleted in Zip file

 

[Alexander Stolte]

It does not work because your icon has a background color.
If you do not want the icons themselves to be colored, then set the Designer Property "ColorIcons" to "False"