blob: 4e27f003a7ed4fcf5641ff91a2ae49f8698bd571 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
|
<UserControl x:Class="MaterialDesignDemo.TransitionsDemo.TransitionsDemoHome"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:MaterialDesignDemo.TransitionsDemo"
xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
xmlns:smtx="clr-namespace:ShowMeTheXAML;assembly=ShowMeTheXAML"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.TextBlock.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="256" />
</Grid.RowDefinitions>
<TextBlock Style="{StaticResource MaterialDesignDisplay2TextBlock}">Transitions Demo</TextBlock>
<smtx:XamlDisplay Key="transitions" Grid.Row="1">
<!-- the transitioner will manage your transitions. notice how SelectedIndex is set to zero: the first slide (instead of the default of -1) -->
<materialDesign:Transitioner SelectedIndex="0" AutoApplyTransitionOrigins="True">
<!-- you can use a slide for each page, let's add a touch of fade for our first page -->
<materialDesign:TransitionerSlide OpeningEffect="{materialDesign:TransitionEffect FadeIn}">
<local:Slide1_Intro />
</materialDesign:TransitionerSlide>
<!-- but you can use bare xaml too -->
<local:Slide2_Intro />
<!-- you can control (and create your own) wipes -->
<materialDesign:TransitionerSlide>
<materialDesign:TransitionerSlide.BackwardWipe>
<materialDesign:CircleWipe />
</materialDesign:TransitionerSlide.BackwardWipe>
<materialDesign:TransitionerSlide.ForwardWipe>
<materialDesign:SlideWipe Direction="Right" />
</materialDesign:TransitionerSlide.ForwardWipe>
<local:Slide3_Intro />
</materialDesign:TransitionerSlide>
<!-- now we are going to slide this in by combining some extra effects. the inner content slides in, so we'll set the outer background and clip, to keep things nice -->
<materialDesign:TransitionerSlide Background="{DynamicResource MaterialDesignDarkBackground}"
Foreground="{DynamicResource MaterialDesignDarkForeground}"
ClipToBounds="True">
<materialDesign:TransitionerSlide.OpeningEffects>
<materialDesign:TransitionEffect Kind="SlideInFromLeft" Duration="0:0:0.8" />
<materialDesign:TransitionEffect Kind="SlideInFromBottom" Duration="0:0:0.8" OffsetTime="0:0:0.15" />
</materialDesign:TransitionerSlide.OpeningEffects>
<local:Slide4_CombineTransitions />
</materialDesign:TransitionerSlide>
<local:Slide5_TransitioningContent />
<local:Slide6_Origins />
<local:Slide7_MVVM />
</materialDesign:Transitioner>
</smtx:XamlDisplay>
</Grid>
</UserControl>
|
