User avatar
AdamJonsson
Topic Author
Posts: 6
Joined: 18 Jun 2019, 09:46

Set VisualState for RowDefinition

21 Aug 2019, 15:27

Hi y'all!

I need to alter the value of a Grid RowDefinition for different VisualStates.
How is this achieved?

I read somewhere that one way was to give the RowDefinition a name (x:Name="..")
but I'm unsure of how to use it.
 
User avatar
sfernandez
Site Admin
Posts: 1628
Joined: 22 Dec 2011, 19:20

Re: Set VisualState for RowDefinition

23 Aug 2019, 00:42

RowDefinition.Height property is of type GridLength and WPF doesn't provide an animation timeline to animate that type.

There are ways of doing this by animating an attached property, but that will require code (setting the RowDefinition.Height in code when the attached property changes).

Another option (pure xaml) would be to use "Auto" in the row, then place an element in that row that will determine the row size and animate that element:
<Grid
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Grid.Resources>
        <Storyboard x:Key="anim">
            <DoubleAnimation To="10" Storyboard.TargetName="row0" Storyboard.TargetProperty="Height" AutoReverse="True"/>
        </Storyboard>
    </Grid.Resources>
    <Grid Width="200" Height="200">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Decorator x:Name="row0" Grid.Row="0" Height="100"/>
        <Rectangle Grid.Row="0" Fill="Red"/>
        <Rectangle Grid.Row="1" Fill="Blue"/>
        
    </Grid>
    <Button Content="Animate" HorizontalAlignment="Center" VerticalAlignment="Bottom">
        <Button.Triggers>
            <EventTrigger RoutedEvent="Button.Click">
                <BeginStoryboard Storyboard="{StaticResource anim}"/>
            </EventTrigger>
        </Button.Triggers>
    </Button>
</Grid>

Who is online

Users browsing this forum: asusralis and 2 guests