Значения Animate Margin между состояниями в WPF - PullRequest
Новая
       4

Значения Animate Margin между состояниями в WPF

4 голосов
/ 16 декабря 2010

Я пытаюсь ознакомиться с WPF для предстоящего проекта. У меня проблема с анимацией полей между штатами. Используя Blend, я получил следующий пример XAML. Если я запускаю состояние «Большой» из кодового блока, прямоугольник внезапно расширяется через 1 секунду вместо «ослабления» расширения, что является желаемым эффектом. 

<Grid x:Name="LayoutRoot">
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="VisualStateGroup">
            <VisualStateGroup.Transitions>
                <VisualTransition GeneratedDuration="0:0:1"/>
            </VisualStateGroup.Transitions>
            <VisualState x:Name="Large">
                <Storyboard>
                    <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="rectangle">
                        <EasingThicknessKeyFrame KeyTime="0" Value="64,135,47,191"/>
                    </ThicknessAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    <Rectangle x:Name="rectangle" Fill="#FFF4F4F5" Margin="428,135,47,191" Stroke="Black"/>
</Grid>

Заранее спасибо!

1 Ответ

5 голосов
/ 16 декабря 2010

Я думаю, это потому, что у вас в анимации только один ключевой кадр, равный 0.

попробуйте это: 

<Grid x:Name="LayoutRoot">
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="CommonStates">

            <VisualStateGroup.Transitions>
                <!--Take one second to transition to the Large state.-->
                <VisualTransition To="Large" GeneratedDuration="0:0:1"/>
            </VisualStateGroup.Transitions>

            <VisualState x:Name="Normal" />

            <!--Change the Margin to "64,135,47,191" when the states gets to "Large"-->
            <VisualState x:Name="Large">
                <Storyboard>
                    <ThicknessAnimation Storyboard.TargetName="rectangle" Storyboard.TargetProperty="Margin" To="64,135,47,191" />
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    <Rectangle x:Name="rectangle" Margin="428,135,47,191" Fill="#FFF4F4F5" Stroke="Black"/>
</Grid>

edit: Я был не очень доволен своим первым выстрелом, поэтому вот лучший способ сделать это.

...