Android Question CSBuilder and VerticalAlign

RB Smissaert

Well-Known Member
Licensed User
Longtime User
I want to show a CSBuilder text in the label where that text has 2 FontAwesome characters in it.
These 2 FontAwesome characters show up a bit too high, so I am trying to correct that with VerticalAlign spans.
With trial and error I have it kind of working with this code:

B4X:
    cs.Initialize.Typeface(Typeface.DEFAULT).Size(18).Append("This allows you to run quickly through" & CRLF & _
                                                             "a list of patients by clicking the" & CRLF).Pop
    cs.Typeface(Typeface.FONTAWESOME).Size(28).VerticalAlign(-12dip).Append(Chr(0xF0D8)).Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).VerticalAlign(-16dip).Append(" and ").Pop
    cs.Typeface(Typeface.FONTAWESOME).Size(28).VerticalAlign(-12dip).Append(Chr(0xF0D7)).Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).VerticalAlign(-16dip).Append(" buttons on various pages.").Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).Append(CRLF & CRLF & "Start, will start this option." & CRLF & _
    "Stop will stop it.").PopAll

There still is a problem as the line holding the 2 FontAwesome characters shows slightly too low and sofar I have been unable to fix this.
I noticed that this is a simpler using the BCTextEngine:

B4X:
    BBCodeView1.Text = _
$"[TextSize=18]This allows you to run quickly through a
list of patients by clicking the [TextSize=28][Vertical=3][FontAwesome=0xF0D8/][/Vertical][TextSize=18] and [TextSize=28][Vertical=3][FontAwesome=0xF0D7/][/Vertical][TextSize=18]
buttons on various pages.

Start will start this option.
Stop will stop it.
"$

This makes it show all fine, but I currently not using BCTextEngine in my app and using that instead would involve lots of code changes.
I guess I must be doing something wrong in my CSBuilder code.

RBS
 

RB Smissaert

Well-Known Member
Licensed User
Longtime User
There is no relation between CSBuilder and BCTextEngine. They work completely different.
Yes, I understand that.
I just mentioned it to show that BCTextengine seems to handle vertical text adjustment better.
My question was: what am I doing wrong in my CSBuilder code?

RBS
 
Upvote 0

RB Smissaert

Well-Known Member
Licensed User
Longtime User
You should have posted a screenshot though I can't see anything wrong with your code.
Yes, attached a screenshot.

RBS
 

Attachments

  • VerticalLineAdjustment.png
    VerticalLineAdjustment.png
    188.5 KB · Views: 73
Upvote 0

toby

Well-Known Member
Licensed User
Longtime User
csb.vertical.jpg
I changed the font awesome size from 28 to 18 and its vertical alignment from -12 to -14 and got the above result which solves your spacing problem with a smaller icon size. If I were you, I would be satisfied with the result and move on to something else; this might not be good enough for you though.


B4X:
    Dim cs As CSBuilder
    cs.Initialize.Typeface(Typeface.DEFAULT).Size(18).Append("This allows you to run quickly through" & CRLF & _
                                                             "a list of patients by clicking the" & CRLF).Pop
    cs.Typeface(Typeface.FONTAWESOME).Size(18).VerticalAlign(-14dip).Append(Chr(0xF0D8)).Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).VerticalAlign(-16dip).Append(" and ").Pop
    cs.Typeface(Typeface.FONTAWESOME).Size(18).VerticalAlign(-14dip).Append(Chr(0xF0D7)).Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).VerticalAlign(-16dip).Append(" buttons on various pages.").Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).Append(CRLF & CRLF & "Start, will start this option." & CRLF & _
    "Stop will stop it.").PopAll
    Button1.Text=cs
 
Last edited:
Upvote 0

RB Smissaert

Well-Known Member
Licensed User
Longtime User
View attachment 141612
I changed the font awesome size from 28 to 18 and its vertical alignment from -12 to -14 and got the above result which solves your spacing problem with a small icon size. If I were you, I would be satisfied with the result and move on to something else; this might not be good enough for you though.


B4X:
    Dim cs As CSBuilder
    cs.Initialize.Typeface(Typeface.DEFAULT).Size(18).Append("This allows you to run quickly through" & CRLF & _
                                                             "a list of patients by clicking the" & CRLF).Pop
    cs.Typeface(Typeface.FONTAWESOME).Size(18).VerticalAlign(-14dip).Append(Chr(0xF0D8)).Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).VerticalAlign(-16dip).Append(" and ").Pop
    cs.Typeface(Typeface.FONTAWESOME).Size(18).VerticalAlign(-14dip).Append(Chr(0xF0D7)).Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).VerticalAlign(-16dip).Append(" buttons on various pages.").Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).Append(CRLF & CRLF & "Start, will start this option." & CRLF & _
    "Stop will stop it.").PopAll
    Button1.Text=cs
Thanks, that works indeed nicely.

RBS
 
Upvote 0

RB Smissaert

Well-Known Member
Licensed User
Longtime User
View attachment 141612
I changed the font awesome size from 28 to 18 and its vertical alignment from -12 to -14 and got the above result which solves your spacing problem with a smaller icon size. If I were you, I would be satisfied with the result and move on to something else; this might not be good enough for you though.


B4X:
    Dim cs As CSBuilder
    cs.Initialize.Typeface(Typeface.DEFAULT).Size(18).Append("This allows you to run quickly through" & CRLF & _
                                                             "a list of patients by clicking the" & CRLF).Pop
    cs.Typeface(Typeface.FONTAWESOME).Size(18).VerticalAlign(-14dip).Append(Chr(0xF0D8)).Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).VerticalAlign(-16dip).Append(" and ").Pop
    cs.Typeface(Typeface.FONTAWESOME).Size(18).VerticalAlign(-14dip).Append(Chr(0xF0D7)).Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).VerticalAlign(-16dip).Append(" buttons on various pages.").Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).Append(CRLF & CRLF & "Start, will start this option." & CRLF & _
    "Stop will stop it.").PopAll
    Button1.Text=cs
This makes it look better. Not sure why the size of the line break lines need to be reduced.

B4X:
    cs.Initialize.Typeface(Typeface.DEFAULT).Size(18).Append("This allows you to run quickly through" & CRLF & _
                                                             "a list of patients by clicking the" & CRLF).Pop
    cs.Typeface(Typeface.FONTAWESOME).Size(18).VerticalAlign(-14dip).Append(Chr(0xF0D8)).Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).VerticalAlign(-16dip).Append(" and ").Pop
    cs.Typeface(Typeface.FONTAWESOME).Size(18).VerticalAlign(-14dip).Append(Chr(0xF0D7)).Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).VerticalAlign(-16dip).Append(" buttons on various pages.").Pop
    cs.Typeface(Typeface.DEFAULT).Size(4).Append(CRLF & CRLF).Pop
    cs.Typeface(Typeface.DEFAULT).Size(18).Append("Start, will start this option." & CRLF & _
    "Stop will stop it.").PopAll

RBS
 
Upvote 0
Top