Jak wykonać efekty przejścia za pomocą kontrolki ramki w WPF?

Myślałem, że to będzie łatwe, ale chyba nie.

Mam 2 strony, które ładują się w mojej ramce. Chcę być w stanie albo mieć ładny efekt slajdów z jednej strony na drugą lub po prostu prosty efekt zanikania.

Wydaje się, że nie można znaleźć tego nigdzie w Internecie.

Update 1 Przyjęta odpowiedź jest dobra, ale znalazłem jeszcze lepszą. http://www.japf.fr/2008/07/8/comment-page-1/

Update 2 Jeśli możesz w to uwierzyć, znalazłem jeszcze lepsze rozwiązanie.
http://fluidkit.codeplex.com/

Author: Dave Clemmer, 2010-01-25

3 answers

Jest podobny problem omówiony tutaj: Animacja przejścia przy przechodzeniu na stronę za pomocą opisanej tam techniki można przesuwać \ przesuwać ramkę za każdym razem, gdy nowa strona jest poruszana. Smth jak to:

Xaml:

...
<Frame Name = "frame" Navigating="frame_Navigating">
...

Kod:

...
private bool                        _allowDirectNavigation = false;
private NavigatingCancelEventArgs   _navArgs = null;
private Duration                    _duration = new Duration(TimeSpan.FromSeconds(1));
private double                      _oldHeight = 0;

private void frame_Navigating(object sender, NavigatingCancelEventArgs e)
{
    if (Content!=null && !_allowDirectNavigation)
    {
        e.Cancel = true;

        _navArgs = e;
        _oldHeight = frame.ActualHeight;

        DoubleAnimation animation0 = new DoubleAnimation();
        animation0.From = frame.ActualHeight;
        animation0.To = 0;
        animation0.Duration = _duration;
        animation0.Completed += SlideCompleted;
        frame.BeginAnimation(HeightProperty, animation0);
    }
    _allowDirectNavigation = false;
}

private void SlideCompleted(object sender, EventArgs e)
{
    _allowDirectNavigation = true;
    switch (_navArgs.NavigationMode)
    {
        case NavigationMode.New:
            if (_navArgs.Uri == null)
                frame.Navigate(_navArgs.Content);
            else
                frame.Navigate(_navArgs.Uri);
            break;
        case NavigationMode.Back:
            frame.GoBack();
            break;
        case NavigationMode.Forward:
            frame.GoForward();
            break;
        case NavigationMode.Refresh:
            frame.Refresh();
            break;
    }

    Dispatcher.BeginInvoke(DispatcherPriority.Loaded,
        (ThreadStart)delegate()
        {
            DoubleAnimation animation0 = new DoubleAnimation();
            animation0.From = 0;
            animation0.To = _oldHeight;
            animation0.Duration = _duration;
            frame.BeginAnimation(HeightProperty, animation0);
        });
}
...

Mam nadzieję, że to pomoże, pozdrawiam

 18
Author: serge_gubenko,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-01-26 04:58:02

Moja odpowiedź jest ulepszoną wersją odpowiedzi udzielonej przez serge_gebunko.
Daje efekt przesuwania w lewo i w prawo .

XAML

...
<Frame Name = "MainFrame" Navigating="MainFrame_Navigating">
...

C #

 private void MainFrame_OnNavigating(object sender, NavigatingCancelEventArgs e) {
                var ta = new ThicknessAnimation();
                ta.Duration = TimeSpan.FromSeconds(0.3);
                ta.DecelerationRatio = 0.7;
                ta.To = new Thickness(0 , 0 , 0 , 0);
                if (e.NavigationMode == NavigationMode.New) {         
                    ta.From = new Thickness(500, 0, 0, 0);                                                  
                }
                else if (e.NavigationMode == NavigationMode.Back) {                
                    ta.From = new Thickness(0 , 0 , 500 , 0);                                               
                }
                 (e.Content as Page).BeginAnimation(MarginProperty , ta);
            }
 7
Author: Wong Jia Hau,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-04-10 08:42:49

To prawdopodobnie nie jest najlepsza odpowiedź, ale może Ci pomóc lub przynajmniej dać kilka pomysłów. W Silverlight uzyskałem ten rodzaj przesuwnego efektu przejścia między stronami za pomocą TransitioningContentControl z Silverlight Toolkit. Jest to kontrola treści, która zasadniczo pozwala zdefiniować niestandardowy storyboard w stanie wizualnym w celu przejścia między starą i nową treścią za każdym razem, gdy zawartość się zmieni. Zawiera również niektóre domyślne (fade / up/down) przejścia, jeśli nie chcesz poświęcić czasu na zdefiniowanie niestandardowego storyboardu.

Zdaję sobie sprawę, że pracujesz z WPF i że TransitioningContentControl nie jest dostępny w WPF ani w zestawie narzędzi WPF. Jednak nie może być zbyt trudno przenieść tę kontrolę na WPF lub przynajmniej zrobić taką, która robi coś podobnego. Patrząc na źródło wygląda na to, że może to być wykonalne, jeśli masz czas i jest to rodzaj kontroli, którą możesz ponownie użyć w innych miejscach.

The kod źródłowy jest tutaj dla wersji Silverlight i Jesse Liberty maładny samouczek , który przechodzi przez sterowanie w Silverlight.

 1
Author: Dan Auclair,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-10-15 23:32:10