TabStripItem formatting text on Android

[CosmanAgraz]

I'm working with Tabs / TabStrip / TabStripItem and I'm running into a problem (this is only tested on Android).

I'm creating a Label using a FormattedString and Span tags. Each Span tag has its own style (its own fontSize / fontWeight).

When I attach this Label to the TabStripItem 'label' property, it removes the Span's style and resets it all to default.

Here's my code:

const createTabLabel = (name, description) =>
{
    const tabTitle = new Label();

    const title = new Span();
    title.text = name + '\n';
    title.fontSize = 24;

    const subTitle = new Span();
    subTitle.text = description;
    subTitle.fontSize = 8;

    const formattedStringLabel = new FormattedString();
    formattedStringLabel.spans.push(title);
    formattedStringLabel.spans.push(subTitle);

    tabTitle.formattedText = formattedStringLabel;

    return tabTitle;
}

Tab creation here:

export const createTabs = (collection) =>
{
    const tabs = new Tabs();
    const tabStrip = new TabStrip();

    const tabStripItems = [];
    const tabContentItems = [];

    const tabLabel = createTabLabel( "Title", "Sub-Title");
    const tabStripItem = new TabStripItem();
    tabStripItem.label = tabLabel;

    const nestedStack = new StackLayout();
    nestedStack.addChild(tabLabel);

    const contentItem = new TabContentItem();
    contentItem.content = nestedStack;

    tabStripItems.push(tabStripItem);
    tabContentItems.push(contentItem);

    tabStrip.items = tabStripItems;
    tabs.tabStrip = tabStrip;

    tabs.items = tabContentItems;

    return tabs;
}

As you can see, the fontSize change gets applied when the Label is displayed on the StackLayout but not inside the TabStripItem

Oddly enough, changing the TabStripItem object's "textTransform" to "none" removes the uppercasing:

tabStripItem.textTransform = "none";

I'm just wondering how I can edit the Tab's label css programmatically. I'm using dynamic data. Number of tabs / name and content is all dynamic.