1

私がやろうとしていることが Visual States を使用して可能であることを願っています...

私がやりたいのは、stackPanel を「In」と「Out」の 2 つの状態の間で切り替えるボタンを用意することです。次に、ボタンのクリック イベントで VisualStateManager.GoToState を呼び出して、2 つの状態を切り替えます。

パネルの状態

私が遭遇した問題は、状態を StackPanel にアタッチする方法がわからないことです。Expression Blend を使用できません。だから私は立ち往生しています... VisualStateManagerを使用してこのパネルをアニメーション化する方法はありますか? (ストーリーボードを使用してインとアウトのアニメーションを作成できることはわかっていますが、可能であればステートを使用したいと思います)

これが可能になることを本当に願っています。それ以外の場合、ボタンにギミックなロールオーバー効果を実行する以外に、VisualStateManager は何に適していますか?

助けてくれてありがとう！

4

1 に答える 1

2

Blendを起動して、これを取得しました：

<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
    x:Class="WpfApplication1.MainWindow"
    x:Name="Window"
    Title="MainWindow"
    Width="640" Height="480">

    <StackPanel x:Name="LayoutRoot">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="PanelState">
                <VisualState x:Name="In"/>
                <VisualState x:Name="Out">
                    <Storyboard>
                        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="stackPanel">
                            <EasingThicknessKeyFrame KeyTime="0" Value="-65,15,0,0"/>
                        </ThicknessAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <i:Interaction.Behaviors>
            <ei:DataStateBehavior Binding="{Binding IsChecked, ElementName=toggleButton}" Value="True" TrueState="In" FalseState="Out"/>
        </i:Interaction.Behaviors>
        <Button Content="Button" Width="50" HorizontalAlignment="Left" Click="Button_Click"/>
        <StackPanel x:Name="stackPanel" Height="100" HorizontalAlignment="Left" Margin="0,15,0,0">
            <TextBlock><Run Text="Funnytext"/></TextBlock>
        </StackPanel>
        <ToggleButton x:Name="toggleButton" Content="Toggle" Width="50" HorizontalAlignment="Left"/>
    </StackPanel>
</Window>

コードビハインド:

private void Button_Click(object sender, System.Windows.RoutedEventArgs e)
{
    var sgs=VisualStateManager.GetVisualStateGroups(LayoutRoot);
    var sg=sgs[0] as VisualStateGroup;
    VisualStateManager.GoToElementState(LayoutRoot, ((VisualState) sg.States[sg.CurrentState == sg.States[0]?1:0]).Name,true);
}

（スタックパネルの意味がわからなかったので、2つだけ含​​めました）

編集: クリックハンドラーが含まれていないことに気づきませんでした。便宜上、トグルボタンを使用して状態を切り替える例を含めました...

于 2011-02-22T21:56:11.137 に答える