iOS Question FontToBitmap looks blurry

angel_ · Jul 22, 2020

When I use FontToBitmap the text or icon looks blurry, in B4A it doesn't, there is a way to improve the sharpness and change the size (I see it a bit small)

FontAwesome To Bitmap

Unlike an older "TextToBitmap" sub that you can find in the forum, this code vertically centers the icon. It can also be used in B4J and B4i (only need to change the font line). Sub Activity_Create(FirstTime As Boolean) 'usage example Activity.AddMenuItem3("Android", "Test"...

www.b4x.com

Alexander Stolte · Jul 22, 2020

set the font size to 40, but the text is not made for this view...

Erel · Jul 22, 2020

Try this:

B4X:

Public Sub FontToBitmap (text As String, Fuente As B4XFont, color As Int) As B4XBitmap
    Dim xui As XUI
    Dim p As B4XView = xui.CreatePanel("")
    p.SetLayoutAnimated(0, 0, 0, 32dip, 32dip)
    Dim cvs1 As B4XCanvas
    cvs1.Initialize(p)
    Dim fnt As B4XFont = Fuente
    Dim r As B4XRect = cvs1.MeasureText(text, fnt)
    Dim BaseLine As Int = cvs1.TargetRect.CenterY - r.Height / 2 - r.Top
    cvs1.DrawText(text, cvs1.TargetRect.CenterX, BaseLine, fnt, color, "CENTER")
    Dim bmp As B4XBitmap = cvs1.CreateBitmap
    Dim cg As NativeObject = bmp
    Dim uiimg As NativeObject
    bmp = uiimg.Initialize("UIImage").RunMethod("imageWithCGImage:scale:orientation:", Array(cg.RunMethod("CGImage", Null), 1, _
            cg.GetField("imageOrientation")))
    cvs1.Release
    Return bmp
End Sub

angel_ · Jul 22, 2020

Almost no change

TILogistic · Jul 22, 2020

angel_ said:
Almost no change

test:

xui.CreateFontAwesome(64)

FontToBitmap(Chr(0xF2B9), xui.CreateFontAwesome(64), xui.Color_White)

TILogistic · Jul 22, 2020

or Test:

xui.CreateMaterialIcons(64)
xui.CreateFontAwesome(64)

SetFontToBitmap(Chr(0xF2B9), xui.CreateFontAwesome(64), 32, xui.Color_White)

B4X:

Public Sub SetFontToBitmap (FontText As String, FontType As B4XFont , FontSize As Float, FontColor As Int) As B4XBitmap
    Dim xui As XUI
    Dim p As B4XView = xui.CreatePanel("")
    p.SetLayoutAnimated(0, 0, 0, 32dip, 32dip)
    Dim cvs1 As B4XCanvas
    cvs1.Initialize(p)
    Dim r As B4XRect = cvs1.MeasureText(FontText, xui.CreateFont2(FontType, FontSize))
    Dim BaseLine As Int = cvs1.TargetRect.CenterY - r.Height / 2 - r.Top
    cvs1.DrawText(FontText, cvs1.TargetRect.CenterX, BaseLine, xui.CreateFont2(FontType, FontSize), FontColor, "CENTER")
    cvs1.Invalidate
    Dim b As B4XBitmap = cvs1.CreateBitmap
    cvs1.Release
    Return b
End Sub

angel_ · Jul 22, 2020

oparra said:
test:

xui.CreateFontAwesome(64)

You're right, 64 is too much but 30 is pretty good, although there is still loss of image quality

TILogistic · Jul 22, 2020

test:

SetFontToBitmap(Chr(0xF2B9), xui.CreateFontAwesome(64), 32, xui.Color_White)

post: #6

setup:

fonts: 64 font imput
Size: 32 or 36 font output

see

adjust:

p.SetLayoutAnimated(0, 0, 0, 32dip, 32dip)

???

TILogistic · Jul 22, 2020

see sample:

fonts: 64 font imput
Size: 36 font output

angel_ · Jul 22, 2020

It still has that loss of sharpness that's kind of annoying that doesn't happen in B4A

TILogistic · Jul 22, 2020

angel_ said:
It still has that loss of sharpness that's kind of annoying that doesn't happen in B4A

View attachment 97492

post: 6 and 9

fonts: 64 font imput
Size: 36 font output

TILogistic · Jul 22, 2020

check this:

[B4X] [BitmapCreator] Change Color of Bitmap

Hello, the Output is not optimal. Have a look down, to Erels code snip for better results. With this snip, you can easy change a Bitmap/Icon Color. This only makes sense if the picture is monochrome with a transparent background like Icons. Usage: ImageView1.Bitmap =...

www.b4x.com

it can be a class problem (I have not used this class):

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

A better menu, can you find here Hey B4X-Forum! New Year, new views! :) The first one from me for this year is a better, simpler, faster and scalable Tab/Bottom-Menu. i spend a lot of time in creating views, some views i need by my self, but some views not and to create a high quality view...

www.b4x.com

Alexander Stolte · Jul 22, 2020

oparra said:
it can be a class problem

no, i use erels code and this was working very well on B4I.

angel_ · Jul 22, 2020

oparra said:
see sample:
View attachment 97491

fonts: 64 font imput
Size: 36 font output

Gracias, I will continue testing

angel_ · Jul 22, 2020

Alexander Stolte said:
no, i use erels code and this was working very well on B4I.

Can you see the sharp image? Maybe it's my device

Semen Matusovskiy · Jul 23, 2020

How https://www.b4x.com/android/forum/attachments/threepages-zip.85130/ looks on your phone ? If I do not make a mistake the size of bitmap is 30 * 30dp (too small .to look sharp)

TILogistic · Jul 23, 2020

Semen Matusovskiy said:
How https://www.b4x.com/android/forum/attachments/threepages-zip.85130/ looks on your phone ? If I do not make a mistake the size of bitmap is 30 * 30dp (too small .to look sharp)

very well done.

But you use the native bar control (TabBarController).

Semen Matusovskiy · Jul 23, 2020

Use own symbols in

B4X:

TabControl.Pages = Array (CreateTabBarItem ("Chat",    0xF1D7, modulePage1), _
                              CreateTabBarItem ("Balance", 0xF24E, modulePage2), _
                              CreateTabBarItem ("Mail",    0xF003, modulePage3))

and compare results.

If in my sample a sharp is better, it's possible to think about modifications in SetFontToBitmap.
But I think the icons looks the same and a problem is in small size.

iOS Question FontToBitmap looks blurry

Well-Known Member

Attachments

Expert

B4X founder

Well-Known Member

Expert

Expert

Well-Known Member

Expert

Expert

Well-Known Member

Expert

Expert

Expert

Well-Known Member

Well-Known Member

Well-Known Member

Expert

Well-Known Member

Similar Threads

Privacy & Transparency

Privacy & Transparency