2.4.x -> 3.0.0 icons is bigger

[SKProCH]

Previously discussed at #65

Workaround

Use Padding="2" on your MaterialIcons. You can set it to every MaterialIcon via this style:

<Style Selector="MaterialIcon">
  <Setter Property="Padding" Value="2" />
<Style/>

Solution

Probably need implement some backward compatibility styles/resources import to allow old users to use 3.x.x with a old sized.

Probably we also need tests to cover this.

[sn4k3]

I still had no time to dig into this.
I will try ASAP

[SKProCH]

I'll also take a look.

[ilCosmico]

The workaround with Padding="2" partially fixes the issue, but WindowMinimize still renders incorrectly: it stretches horizontally to fill the available width of the button instead of respecting the Height constraint.

This happens when MaterialIcon is used inside a ControlTemplate with only Height set and no explicit Width. The icon expands to fill the parent Border, which itself stretches to fill the Button. The other window icons (WindowMaximize, WindowClose) are less noticeable because their SVG paths are more square, but WindowMinimize is a horizontal line so the stretching is very evident.

Minimal reproduction (Material.Icons.WPF 3.0.0):

<Window.Resources>
    <Style x:Key="WindowMinimizeButton" TargetType="Button">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Border Name="Border" Background="Transparent">
                        <materialIcons:MaterialIcon Height="16" Kind="WindowMinimize" Name="Icon"/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="WindowMaximizeButton" TargetType="Button">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Border Name="Border" Background="Transparent">
                        <materialIcons:MaterialIcon Height="16" Kind="WindowMaximize" Name="Icon"/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="WindowCloseButton" TargetType="Button">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Border Name="Border" Background="Transparent">
                        <materialIcons:MaterialIcon Height="16" Kind="WindowClose" Name="Icon"/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>

<StackPanel Orientation="Horizontal" VerticalAlignment="Top" HorizontalAlignment="Right">
    <Button Style="{StaticResource WindowMinimizeButton}" Width="45" Height="30"/>
    <Button Style="{StaticResource WindowMaximizeButton}" Width="45" Height="30"/>
    <Button Style="{StaticResource WindowCloseButton}" Width="45" Height="30"/>
</StackPanel>

2.4.1 (correct):

3.0.0 (bug):

This is a regression from 2.4.x behavior where setting Height alone on MaterialIcon inside a ControlTemplate was sufficient to render the icon at the correct size.

[SKProCH]

Everyone is invited to come to #70 and share their opinion if you have something to say regarding the desired sizing behavior.

[SKProCH]

I merged the fixed Width/Height=24 for a Path, and this is making the sizing the same as in 2.x.x.

This is published as https://www.nuget.org/packages/Material.Icons/3.0.2-nightly.0.1, so check it and share your feedback.

[ilCosmico]

@SKProCH Just tested the nightly, and it's working perfectly for us, thanks! Do you have an ETA on the stable release?

[SKProCH]

Well, lets push it now, since apparently (I hope) it fixes the problem.

[SKProCH]

v3.0.2 is published, so I closing this issue, if it still persist under some conditions - please, write details here or open a new one