Jaap van Vliet
Jaap van Vliet

Reputation: 53

WPf Path rotation not working

I want to rotate a Path when I change a property from my datacontext. I've added a colorchange to see the storyboard actually being executed. But no rotation...

<Grid Grid.Column="0" Grid.Row="0" Background="Green" Margin="0,10,10,10" Width="100" Height="100">
        <Grid.Resources>
            <Style TargetType="Path">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Expanded}" Value="True">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <local:BrushAnimation Duration="0:0:1" To="Red" Storyboard.TargetProperty="Fill"/>
                                    <DoubleAnimation Duration="0:0:1" To="45" Storyboard.TargetProperty="(LayoutTransform).(RotateTransform.Angle)"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                        <DataTrigger.ExitActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation Duration="0:0:2" To="90" Storyboard.TargetProperty="(LayoutTransform).(RotateTransform.Angle)"/>
                                    <local:BrushAnimation Duration="0:0:2" To="Yellow" Storyboard.TargetProperty="Fill"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.ExitActions>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Grid.Resources>

        <Path VerticalAlignment="Stretch" Fill="Aqua" Stretch="Uniform" RenderTransformOrigin="0.5, 0.5">
            <Path.Data>
                <StreamGeometry>F1M154.2217,60.96L45.7777,100L154.2217,139.04z</StreamGeometry>
            </Path.Data>
        </Path>
    </Grid>

Upvotes: 2

Views: 5471

Answers (1)

lokusking
lokusking

Reputation: 7456

You have to add an RotateTransform to your Path first

<Path VerticalAlignment="Stretch" Fill="Aqua" Stretch="Uniform" RenderTransformOrigin="0.5, 0.5" x:Name="Path">
            <Path.Data>
                <StreamGeometry>F1M154.2217,60.96L45.7777,100L154.2217,139.04z</StreamGeometry>
            </Path.Data>
            <Path.LayoutTransform>
                <RotateTransform Angle="0"></RotateTransform>
            </Path.LayoutTransform>
        </Path>

Upvotes: 6

Related Questions