Other [work in progress] BCText - Cross platform text engine

Erel

B4X founder
Staff member
Licensed User
Longtime User
BCText is a custom and cross platform text engine. It can be used for all kinds of things such as cross platform implementation of CSBuilder, rich text view, specialized text layouts and other cases where you need full control over the text layout.

More information next week.

It is not 100% ready and especially it is missing another layer above the engine that will make it easier to build the text with the various options.

B4J code depends on the attached jBitmapCreator (v4.71).

t.gif
 

Attachments

  • jBitmapCreator.zip
    45.1 KB · Views: 1,044
  • BCText.zip
    62.9 KB · Views: 423
Last edited:

xulihang

Active Member
Licensed User
Longtime User
Looking forward to a rich text editor.

I have come across this error with b4j:

B4X:
Compiling code.    Error
Error compiling program.
Error description: Unknown member: alphathresholdforcbcextraction
Error occurred on line: 363
CharBC.AlphaThresholdForCBCExtraction = 0
Word: alphathresholdforcbcextraction
 
Upvote 0

jimmyF

Active Member
Licensed User
Longtime User
Be sure to copy the new jBitmapCreator to your Internal Libraries folder; NOT the Additional Libraries.
 
Upvote 0

agraham

Expert
Licensed User
Longtime User
I've just tried this but unfortunately the text is really 'fuzzy' on my system which is a Surface Studio with display scaling set to 200%. It also looks fuzzy on the screenshot above though on my system the contrast between the 'Click' text on the button and the other text is stark :(
2019-05-10_101936.png



It reminds me of the first Visual Studio versions that used WPF instead of WinForms for the editor and had fuzzy text and which eventually required the WPF team to rewrite WPF text handling to sharpen it up.
 
Upvote 0

Erel

B4X founder
Staff member
Licensed User
Longtime User
1. Kerning is not implemented. Will probably be added in a future version.

2. About the fuzziness:
a. It is very sharp on mobile devices (where the scale is always more than 160dpi).
b. It should look as sharp as other text on most desktops which run with no text scaling.
It also looks fuzzy on the screenshot above
It looks better in reality. The animated gif is low quality.

I will try to improve it on High DPI desktops.
 
Upvote 0

agraham

Expert
Licensed User
Longtime User
It's a whole lot better at smaller text sizes than it was before, which was a bit grim :( Here's Bold 14 and normal 12 which is more like the sizes I would use. The only comment I would make is that the character spacing is a bit too wide. It's not so obvious with this fragment but seen as a whole they are just that little bit too far apart.
2019-05-11_173437.png
 
Last edited:
Upvote 0

agraham

Expert
Licensed User
Longtime User
'setSpaceBetweenCharacters' doesn't seem to affect the space character itself so if you set it to a larger value you can't see the spaces between words any more. Set it to 300dip/100 and I get a 'java.lang.ArrayIndexOutOfBoundsException: arraycopy: length -4 is negative' at 'bitmapcreator._drawrect2 (java line: 2569)'
 
Upvote 0

agraham

Expert
Licensed User
Longtime User
It looks like you further improved the high dpi desktop rendering. It seems spot-on 100% acceptable now - and looks good on all five of my Androids too. Your screenshots above don't do justice to the perceived sharpness on real devices.

I see you fixed SpaceBetweenCharacters as well :)
 
Upvote 0

Erel

B4X founder
Staff member
Licensed User
Longtime User
BC is indeed BitmapCreator.

When I started with it, the plan was to create a class that adds text drawing features to BitmapCreator. BitmapCreator can be used for all kinds of things, one of them is an alternative to Canvas / B4XCanvas. Text drawing is missing from BitmapCreator.
Eventually for various reasons I've decided to switch to a rich text engine. It is still based on BitmapCreator features.

BitmapCreator itself started as a class that creates 32-bit BMP images where the main use case was to create gradients and color pickers graphics. That's the reason for its a bit uninspired name.
Later it was rewritten several times with many improvements. Among other it is now the base of XUI2D games.
 
Upvote 0

Erel

B4X founder
Staff member
Licensed User
Longtime User
Many changes have been done. Beta version will be released tomorrow.

firefox_upHbf2YZpG.png


Code:
B4X:
Dim btn As Button
btn.Initialize("btn")
btn.Text = "Click!"
btn.SetLayoutAnimated(0, 0, 0, 100dip, 40dip)
Dim pnl As B4XView = xui.CreatePanel("")
pnl.SetLayoutAnimated(0, 0, 0, 200dip, 120dip)
pnl.LoadLayout("CustomListView")
BBCodeView1.Views.Put("btn", btn)
BBCodeView1.Views.Put("clv", pnl)
For i = 1 To 50
   CustomListView1.AddTextItem($"Item ${i}"$, "")
Next
BBCodeView1.Text = _
$"[Alignment=Center][TextSize=20][b][u]This is the title[/u][/b][/TextSize][/Alignment]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc fermentum elit vitae nisi faucibus, vitae lacinia turpis mattis.
Lets add a [Color=#ff0000][b]button:[/b][/color] [View=btn Vertical=10/]  and more text here...
We can also add links, for example: [url]https://www.google.com[/url]. You can click on the link. The title will be updated.
Here is a nice logo: [img dir=${File.DirAssets} FileName="logo.png" width=50/]
Do you wonder whether it is possible to add more complex views?
Sure: [vertical=30][view=clv/][/vertical]
We can also download an image here: [url="DonManfred's avatar"][img url="https://b4x-4c17.kxcdn.com/android/forum/data/avatars/l/42/42649.jpg?1432374732" width=60 height=60/][/url]
Note that you must explicitly set the dimensions of such images.
"$
 
Upvote 0
Top