Android Question Reverse colours and do mirror image of FontAwesome or Material icons

RB Smissaert

Well-Known Member
Licensed User
Longtime User
For some button images I need to reverse the colours.
Also I have a button where the Material icon image needs to be flipped left to right (mirror image).
What would be the simplest way to do these things?

RBS
 

RB Smissaert

Well-Known Member
Licensed User
Longtime User
For sure your solution and @TILogistic solution are more elegant and correct and will work with any characters.
I post even my idea, simpler but for sure limited in case you need to make the same thing with many many buttons.
Thanks, will have a look at that.
I only needed this really for one (keyboard) button as there is no good forward delete button in the FontAwesome images or Material icon images.

RBS
 
Upvote 0

TILogistic

Expert
Licensed User
Longtime User
Check out these solutions, while I find the color changing solution I developed to convert to SVG.
But it is based on the Flooding algorithm
and
 
Upvote 0

TILogistic

Expert
Licensed User
Longtime User
I solved this now with an icon file that has the right colours (file attached).
This seems simpler than altering colours and works fine now.
Still flipping the image with the Java code.

B4X:
'Sets the rotation angle around the Y or X axis of the given view
'v = view
'Angle = rotation angle in degrees
Sub setRotationY(v As View, angle As Float)
    Dim jo = v As JavaObject
    jo.RunMethod("setRotationY", Array As Object(angle))
End Sub

Sub setRotationX(v As View, angle As Float)
    Dim jo = v As JavaObject
    jo.RunMethod("setRotationX", Array As Object(angle))
End Sub

'Sets the X pivot point of the given view
'v = view
'X = X coordinate of the pivot in pixels
'reference upper left corner, default pivot middle of the view
Sub setPivotX(v As View, X As Float)
    Dim jo = v As JavaObject
    jo.RunMethod("setPivotX", Array As Object(X))
End Sub

Sub setPivotY(v As View, X As Float)
    Dim jo = v As JavaObject
    jo.RunMethod("setPivotY", Array As Object(X))
End Sub

Sub FlipViewImage(v As View, bHorizontal As Boolean)
  
    If bHorizontal Then
        setPivotX(v, v.Width / 2)
        setRotationY(v, 180)
    Else
        setPivotY(v, v.Height / 2)
        setRotationX(v, 180)
    End If
  
End Sub

Sub BitMapFromFile(strFolder As String, strFile As String, iOldColour As Int, iNewColour As Int, _
                   bKeepAlphaLevel As Boolean, iWidth As Int, iHeight As Int) As Bitmap
  
    Dim bmp As Bitmap
  
    bmp = LoadBitmapResize(strFolder, strFile, (iWidth / fActivityWidthRatio) / fTextRatio, (iHeight / fActivityHeightRatio) / fTextRatio, True)
  
    If iOldColour <> iNewColour Then
        bmp = ReplaceColor(bmp, iOldColour, iNewColour, bKeepAlphaLevel)
    End If
  
    Return bmp
  
End Sub

Sub ReplaceColor(bmp2 As B4XBitmap, OldColor As Int, NewColor As Int, KeepAlphaLevel As Boolean) As B4XBitmap
  
    Dim x As Int
    Dim y As Int
    Dim BMC As BitmapCreator = CreateBC(bmp2)
    Dim oldargb As ARGBColor
    Dim newargb As ARGBColor
    Dim a As ARGBColor
  
    BMC.ColorToARGB(OldColor, oldargb)
    BMC.ColorToARGB(NewColor, newargb)
  
    If KeepAlphaLevel Then
        For x = 0 To BMC.mWidth - 1
            For y = 0 To BMC.mHeight - 1
                BMC.GetARGB(x, y, a)
                If a.r = oldargb.r And a.g = oldargb.g And a.b = oldargb.b Then
                    newargb.a = a.a
                    BMC.SetARGB(x, y, newargb)
                End If
            Next
        Next
    Else
        For x = 0 To BMC.mWidth - 1
            For y = 0 To BMC.mHeight - 1
                BMC.GetARGB(x, y, a)
                If a.a = oldargb.a And a.r = oldargb.r And a.g = oldargb.g And a.b = oldargb.b Then
                    newargb.a = a.a
                    BMC.SetARGB(x, y, newargb)
                End If
            Next
        Next
    End If
  
    Return BMC.Bitmap
  
End Sub

'All this has to do with a custom keyboard and in the class clsKeyboard:
'flipping the image won't take place here as it is not the default to do a forwards delete,
'but just added this here as an example

    'Del button at the right side of the fourth row
    '----------------------------------------------
    dLeft = pnlKeys.Width - (42dip + 6dip)
  
    Dim b As Button
    b.Initialize("KeyboardButton")
    b.TextColor = Colors.Black
    b.TextSize = fButtonTextSize
    b.SingleLine = True
    'b.Typeface = Typeface.MATERIALICONS
    b.Typeface = Typeface.DEFAULT
    b.Tag = 38
    'b.Text = Chr(0xE14A) 'backspace
    b.Gravity = Gravity.CENTER
    b.Padding = Array As Int(0,0,0,0)
  
    Dim CD As ColorDrawable
    CD.Initialize(0xFFC8C8C8, 6dip) 'GREY, rounded corners
    b.Background = CD
  
    Dim bmp As Bitmap = cMP.BitMapFromFile(File.DirAssets, "back_delete.png", 0, 0, True, 35dip, 30dip)
  
    Dim cs As CSBuilder
    cs.Initialize.Image(bmp, 35dip, 30dip,False)
    b.Text = cs

    pnlKeys.AddView(b, dLeft, dTop, 42dip, 36dip)
  
    '----------------------------------------------------------------------------------
    'To mirror flip the button image (do this after the button was added to the panel!)
    FlipViewImage(b, True)
    '----------------------------------------------------------------------------------

    arrKeyboardButtons(38) = b

RBS
EDIT
B4X:
    Dim Bmp As B4XBitmap = FontToBitmap(Chr(0xE14A), xui.CreateMaterialIcons(100), 100, xui.Color_Black)
 
    B4XImageView1.Bitmap = Bmp
    B4XImageView1.mBackgroundColor = xui.Color_Transparent
    B4XImageView1.Update


    Dim bce As BitmapCreatorEffects
    bce.Initialize
    Dim NewBmp As B4XBitmap = bce.ReplaceColor(Bmp, xui.Color_Black, xui.Color_Red, True)
    NewBmp = bce.FlipHorizontal(NewBmp)
    
    B4XImageView2.Bitmap = NewBmp
    B4XImageView2.mBackgroundColor = xui.Color_Transparent
    B4XImageView2.Update
1726660315699.png
 
Last edited:
Upvote 0

RB Smissaert

Well-Known Member
Licensed User
Longtime User
EDIT
B4X:
    Dim Bmp As B4XBitmap = FontToBitmap(Chr(0xE14A), xui.CreateMaterialIcons(100), 100, xui.Color_Black)
 
    B4XImageView1.Bitmap = Bmp
    B4XImageView1.mBackgroundColor = xui.Color_Transparent
    B4XImageView1.Update


    Dim bce As BitmapCreatorEffects
    bce.Initialize
    Dim NewBmp As B4XBitmap = bce.ReplaceColor(Bmp, xui.Color_Black, xui.Color_Red, True)
    NewBmp = bce.FlipHorizontal(NewBmp)
   
    B4XImageView2.Bitmap = NewBmp
    B4XImageView2.mBackgroundColor = xui.Color_Transparent
    B4XImageView2.Update
View attachment 157070
Thanks for that and I have switched now from using the Java code to using B4XBitmapEffects and FlipHorizontal, just because it is a bit
clearer what is going on and giving me more control over the bitmaps.
I stick with using the posted icon file, rather than changing colours as it is all a bit simpler with the black edge around the image.
All working fine now.

B4X:
Sub ToggleDeleteButton
    
    If     bForwardDelete Then
        If bToggledDeleteButton = False Then
            bmpDeleteForward  = BMCE.FlipHorizontal(bmpDeleteBack)
            bToggledDeleteButton = True
        End If
        Dim cs As CSBuilder
        cs.Initialize.Image(bmpDeleteForward, 35dip, 30dip,False)
        arrKeyboardButtons(38).Text = cs
        arrKeyboardButtonsSymbols(38).Text = cs
    Else
        Dim cs As CSBuilder
        cs.Initialize.Image(bmpDeleteBack, 35dip, 30dip,False)
        arrKeyboardButtons(38).Text = cs
        arrKeyboardButtonsSymbols(38).Text = cs
    End If
    
End Sub

RBS
 
Upvote 0
Top