Skip to content

Span does not inherit text styling from Label if that styling is applied using Style  #21326

@hansmbakker

Description

@hansmbakker

Description

This is a followup from #21034 (comment).

In #21191, text styling is inherited from Label on a contained Span but only if those properties are set directly on the Label.

However, I believe text styling is often applied using Style and this usecase is not covered yet. In my opinion it would make sense for a Span to be consistent with the text look & feel of the parent Label by default, unless specified explicitly.

Issue

In this image you see several attempts where the FontFamily setter value of the Heading style class is not properly inherited in the spans. The font family should be PoppinsSemiBold - you can see that the cases using spans are not bold:
image

Test cases (corresponding to the labels in the Code section)

  1. converts a string containing sections marked with * to a FormattedString with Spans - the ConverterParameter sets the TextColor of marked Spans
  2. manual creation of FormattedString containing multiple Spans
  3. string is converted to FormattedString containing one Span using implicit operator of FormattedString
  4. only a Label with Text (not FormattedText) gets the correct FontFamily

Actual behavior

Only the Label not using Spans will have the the correct FontFamily

Expected behavior

Spans not having FontFamily set, inherit the FontFamily from the parent Label.

Steps to Reproduce

  1. Create a new MAUI app
  2. Add some styling classes with TargetType="Label".
  3. If you use a custom FontFamily, register it in MauiProgram.cs
  4. Create a Label containing a FormattedString with one or more Spans
  5. Apply the styling classes on the Label
  6. See that the text in the Spans does not match the styling applied using the styling classes

Styles.xaml

<Style Class="Heading"
       TargetType="Label">
    <Setter Property="FontFamily"
            Value="PoppinsSemiBold" />
</Style>
<Style Class="Heading04"
       TargetType="Label">
    <Setter Property="FontSize"
            Value="20" />
    <Setter Property="LineHeight"
            Value="1.5" />
    <Setter Property="CharacterSpacing"
            Value="0.024" />
    <Setter Property="SemanticProperties.HeadingLevel"
            Value="Level4" />
</Style>

MainPage.xaml

<VerticalStackLayout Spacing="8">
    <Label FormattedText="{Binding Source={x:StaticResource HeadingText}, Converter={StaticResource markStringWithColorSpanConverter}, ConverterParameter={StaticResource Forest500}}"
           StyleClass="Heading, Heading04" />

    <Label StyleClass="Heading, Heading04">
        <Label.FormattedText>
            <FormattedString>
                <Span TextColor="{StaticResource Forest500}">Permanent</Span>
                <Span>workers</Span>
            </FormattedString>
        </Label.FormattedText>
    </Label>

    <Label FormattedText="{x:StaticResource HeadingText}"
           StyleClass="Heading, Heading04" />

    <Label Text="{x:StaticResource HeadingText}"
           StyleClass="Heading, Heading04" />
</VerticalStackLayout>

Link to public reproduction project repository

https://github.com/hansmbakker/bugrepro-span-inheritance

Version with bug

8.0.10 SR3

Is this a regression from previous behavior?

No, this is something new

Last version that worked well

Unknown/Other

Affected platforms

iOS, Android, Windows, macOS, Other (Tizen, Linux, etc. not supported by Microsoft directly), I was not able test on other platforms

Affected platform versions

This is platform-independent

Did you find any workaround?

It is possible to set the properties directly on Label or Span, but that is exactly what this issue is about - not having to do that.

Relevant log output

No response

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions