Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Icons cropped (after update from 11.2.2 to 11.2.3) #17809

Open
Limula-PMA opened this issue Dec 20, 2024 · 6 comments
Open

Icons cropped (after update from 11.2.2 to 11.2.3) #17809

Limula-PMA opened this issue Dec 20, 2024 · 6 comments

Comments

@Limula-PMA
Copy link

Describe the bug

Soon after updating to the latest Avalonia release, I noticed all icons were cropped on their right side, when included in various container (NavigationViewItem, SettingsExpander, MenuFlyoutItem, ...)

I'm using FluentAvalonia as well, which could also be the cause.
I've included a small sample project (with a navigation view). You can simply switch between Avalonia 11.2.2 and 11.2.3 to see the difference.

Avalonia 11.2.2:
before

Avalonia 11.2.3:
after

Other examples:
after_2
test

To Reproduce

Simply create any of the aforementioned containers (NavigationViewItem, SettingsExpander, MenuFlyoutItem) and include an icon in it. Switching from 11.2.2 to 11.2.3 will (if the icon is wide enough) crop it.

Expected behavior

I would expect the icon to stay fully visible.

Avalonia version

11.2.3

OS

Windows

Additional context

Here's a small sample project:
TestApp.zip

@robloo
Copy link
Contributor

robloo commented Dec 21, 2024

Can confirm -- this is a serious issue that unfortunately makes the current version of Avalonia unusable.

I don't think it's an issue with FluentAvalonia. The FontIcon rendering and custom FluentAvalonia font haven't changed in some time. The changes to the font metric calculations in Avalonia were made before 11.2.3 as well so again, likely not the FluentAvalonia font.

@robloo
Copy link
Contributor

robloo commented Dec 21, 2024

Also, this is likely a duplicate of #17795

@kuiperzone
Copy link

I am seeing cropping vertically also.

@Gillibald
Copy link
Contributor

Gillibald commented Dec 21, 2024

I can't reproduce the issue with some pure building blocks

<DockPanel LastChildFill="False">
    <TextBlock
    HorizontalAlignment="Center"
    VerticalAlignment="Center"
    FontFamily="Segoe MDL2 Assets"
    Foreground="Black"
    FontSize="44"
    Background="Magenta"
    Text="&#xE70D;"/>
  <TextBlock
    HorizontalAlignment="Center"
    VerticalAlignment="Center"
    FontFamily="Segoe MDL2 Assets"
    Foreground="Black"
    FontSize="44"
    Background="Magenta"
    Text="&#xE70D;"/>
  <TextBlock
    HorizontalAlignment="Center"
    VerticalAlignment="Center"
    FontFamily="Segoe MDL2 Assets"
    Foreground="Black"
    FontSize="44"
    Background="Magenta"
    Text="&#xE70D;"/>  <TextBlock
    HorizontalAlignment="Center"
    VerticalAlignment="Center"
    FontFamily="Segoe MDL2 Assets"
    Foreground="Black"
    FontSize="44"
    Background="Magenta"
    Text="&#xE70D;"/>
</DockPanel>

Screenshot 2024-12-21 122515

Provide me a sample that uses a TextBlock and is not limiting the TextBlock's size I can have a deeper look. At the moment all provided samples limit the TextBlock's with so the text is clipped.

The linked issue has a sample that is limiting the TextBlock to a max width of 12 but in the TextBlock needs at least a width of 16

@textGamex
Copy link

textGamex commented Dec 21, 2024

The bug can be consistently reproduced on the TreeView.

<TreeView>
        <TreeViewItem Header="Test">
            <TreeViewItem Header="Test2" />
        </TreeViewItem>
</TreeView>

image
image

@robloo
Copy link
Contributor

robloo commented Dec 21, 2024

@Gillibald This might be related to paths here. However, in the other issue it surely is a problem with font-based icons so I'm still thinking it's text formatting related.

The other issue is this path was always 12px by 12px. It's been that way for a long time. So why would the rendering of the path only now be too wide?

You can say the issue is because of the width constraint but there certainly is more to the story. We need to know why it's happening now. It's also may be an issue with the starting position / margins of the rendering.

NotroDev added a commit to SkEditorTeam/SkEditor that referenced this issue Dec 30, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants