Setting a letter spacing for a Label in Android and iOS turned into an interesting research for me. I would expect that such a common task would be easily done with a help of a Renderer or an Effect. However, I was very surprised to discover that some platforms do not have a built-in support for setting letter spacing.
Android
It turned out that setting letter spacing it is not possible on pre Lollipop (< 21) without hacks when on Lollipop+ there is a dedicated method: setLetterSpacing(). Luckily this SO post offered a creative solution:
.. method adds a space between each letter of the String and with SpannedString changes the TextScaleX of the spaces, allowing positive and negative spacing ..
The math in this solution is a bit weird and should be adjusted according to your specific needs. Otherwise it is doing it’s job nicely.
Checking the Distribution dashboard, it seems that 15.3% of users are using KitKat or older and 84.7% are using Lollipop or newer Android version. So hopefully very soon this recipe could be simplified🤞.
iOS
On iOS it is (as expected) a one-liner using attributedText property.
The recipe
I combined the details described above into Effect:
Just to add some information: You can also add line spacing or underline your label.
Just change your code inside your effects to the following…
Android effect:
var formsLabel = Element as Label;
// Letter spacing
lbl.LetterSpacing = letterSpacing / (float) formsLabel.FontSize;
// By the way: You need to divide through the original font size of your forms label because Android is using em here instead of points.
// Line spacing
lbl.SetLineSpacing(0, lineSpacing); // available since API level 1
// Underline
lbl.PaintFlags = textView.PaintFlags | PaintFlags.UnderlineText; // not sure if works since API level 1
iOS effect:
var text = new NSMutableAttributedString(lbl.Text);
// Letter spacing
text.AddAttribute(UIStringAttributeKey.KerningAdjustment, new NSNumber(letterSpacing), new NSRange(0, text.Length));
// Line spacing
var paragraphStyle = new NSMutableParagraphStyle { LineSpacing = lineSpacing };
text.AddAttribute(UIStringAttributeKey.ParagraphStyle, paragraphStyle, new NSRange(0, text.Length));
// Underline
text.AddAttribute(UIStringAttributeKey.UnderlineStyle, new NSNumber((int) NSUnderlineStyle.Single), new NSRange(0, text.Length));
lbl.AttributedText = text;
LikeLike