PathStyle corrupts button image

[Joe]

I have some  RadPathButtons (inside a WrapPanel) with attached commands.  When the commands are enabled, I want the paths to show up in black.    Instead they show up in grey, even though the attached commands are enabled and do execute when I click them.  See the first attached image ("before_style.png") to see what I mean

<WrapPanel x:Name="ViewPanel"
           Background="{StaticResource GsBackgroundDark}"
           VerticalAlignment="Top"
           HorizontalAlignment="Stretch"
           Margin="0"
            >

    <tk:RadPathButton Margin="10 10 0 0"
                      Height="40"
                      Width="40"
                      IsEnabled="True"
                      Foreground="Black"
                      PathGeometry="{StaticResource HeightMapPathGeometry}"
                      Command="{Binding ShowHeightMapCmd}"
        />

    <tk:RadPathButton Margin="10 10 0 0"
                      Height="40"
                      Width="40"
                      IsEnabled="True"
                      ToolTip="Show Scan Images"
                      PathGeometry="{StaticResource ImagesGeometry}"
                      Command="{Binding ShowImagesCmd}"
    />
</WrapPanel>

 

 

So, following Telerik's advice, I added a style resource to use in each of the button's PathStyle Property

 

<WrapPanel.Resources>
    <Style x:Key="MyPathStyle" TargetType="{x:Type Path}">
        <Setter Property="Fill" Value="Black"/>
        <Setter Property="Stroke" Value="Black"/>
    </Style>
</WrapPanel.Resources>

 

Then I set this resource as the PathStyle for each of the buttons.   For example (see line #7 below)

01.<tk:RadPathButton Margin="10 10 0 0"
02.                  Height="40"
03.                  Width="40"
04.                  IsEnabled="True"
05.                  ToolTip="Show Scan Images"
06.                  PathGeometry="{StaticResource ImagesGeometry}"
07.                  PathStyle="{StaticResource MyPathStyle}"
08.                  Command="{Binding ShowImagesCmd}"
09./>

 

But then when I run my application again, the button icons don't look even recognizable.  It's like they've expanded far beyond the boundaries of the button, when all I did was try to change the color.  Look at the the second attached image ("after_style.png") to see what I mean

Can you tell me what I am missing?  I never expected merely applying a color to the paths would change their geometry.

[Joe]

I was able to get around this by also adding another setter to my style for the Stretch property

<Setter Property="Stretch" Value="Uniform"/>

 

Don't know why this was needed -- I tried unsuccessfully to base my style on the "default" for path -- but it fixes the problem and is a minor fix so I am OK now

 

 

[Martin]

Hi,

In our default path style in the setter of the button we have a Stretch="Fill". When you set a new style, all of our setters are removed. The key for our "default" style for the Path in the RadPathButton is "RadPathButtonPathStyle".

By default the Path will automatically size the geometry based on the geometry's points (the Stretch property is by default None). If they are larger than the size of the Path control, they will be clipped, as was most probably the case with the paths you are using.

Setting Stretch to Uniform will force the geometry to become as large as possible without overflowing and keep its aspect ratio. Fill will force it to stretch to fill the Path container and UniformToFill will keep the aspect ratio and stretch it to fill the maximum space and some clipping might occur.

We do not set that property to the Path instance in the ControlTemplate of the RadPathButton, so that it can be changed via the style.

I am glad that you have managed to get around that behavior. If you have any other questions, please do not hesitate to contact us further.

Regards,
Martin
Progress Telerik