как анимировать переход от одного представления к другому при использовании шаблонов данных для связи представления с моделью представления - PullRequest
Новая
       10

как анимировать переход от одного представления к другому при использовании шаблонов данных для связи представления с моделью представления

4 голосов
/ 16 августа 2010

Я опубликую свой исходный код, который у меня есть на данный момент, и объясню мою проблему после этого.

это окно, где я хочу, чтобы переход произошел 

<Window x:Class="MyApp.MainView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MyApp" Height="600" Width="800">
<StackPanel>
    <Button Content="View1" Command="{Binding View1Command}"/>
    <Button COntent="View2" Command="{Binding View2Command}"/>
    <ContentControl Content="{Binding MyContent}"/>
</StackPanel>

Это связанная модель представления 

public class MainViewModel
{
    public RelayCommand View1Command{ get; private set;}
    public RelayCommand View2Command{ get; private set;}

    //INotifyPropertyChanged is implemented of course
    public ViewModelBase MyContent { get; set;}

    public MainViewModel()
    {
        View1Command = new RelayCommand(() => { MyContent = new ViewModel1();});
        View2Command = new RelayCommand(() => { MyContent = new ViewModel2();});
    }
}

В app.xaml я использовал шаблон данных, чтобы связать ViewModel1 с View1 и ViewModel2 с View2. Это все работает, как ожидалось. При нажатии на кнопки вид меняется, привязка данных работает и все в порядке.

Что мне нравится делать сейчас, так это использовать анимацию при изменении вида.

что мне нужно сделать, чтобы оживить переход между двумя представлениями, скажем, с постепенной анимацией для нового представления. старый вид исчезает, а новый исчезает в течение одной секунды.

надеюсь, вы сможете мне помочь.

С наилучшими пожеланиями

Паскаль

p.s. если мой подход с шаблоном данных не имеет смысла, и анимация невозможна с этим подходом, я открыт для других передовых методов, чтобы перейти от представления onw к другому. решение, которое я использую, взято из демонстрационного приложения wpf Карлом Шиффлетом, но я не знаю, является ли это правильным решением для того, что я пытаюсь сделать.

Ответы [ 2 ]

0 голосов
/ 01 августа 2011

Я изменил свой подход к переходу, используя локатор модели представления для привязки представления к viewmodel и менеджер визуальных состояний для перехода.

0 голосов
/ 06 июня 2011 
<Window.Resources>
<Storyboard x:Key="OnClick1">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="CC1">
                <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="CC2">
                <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
        <Storyboard x:Key="OnClick2">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="CC1">
                <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="CC2">
                <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
</Window.Resources>
<Window.Triggers>       
        <EventTrigger RoutedEvent="ButtonBase.Click" SourceName="button">
            <BeginStoryboard x:Name="OnClick1_BeginStoryboard" Storyboard="{StaticResource OnClick1}"/>
            <BeginStoryboard x:Name="OnClick2_BeginStoryboard" Storyboard="{StaticResource OnClick2}"/>
        </EventTrigger>
    </Window.Triggers>
    <StackPanel> 
            <Button x:Name="button" Content="View1" Command="{Binding View1Command}"/>  
            <Button Content="View2" Command="{Binding View2Command}"/> 
            <Grid>
                <ContentControl Name="CC1" Opacity="1" Content="{Binding MyContent}"/> 
                <ContentControl Name="CC2" Opacity="0" Content="{Binding MyContent}"/> 
            </Grid>
            </StackPanel>
...