|
5 | 5 | xmlns:i="using:Microsoft.Xaml.Interactivity" |
6 | 6 | xmlns:local="using:TransitionHelperExperiment.Samples" |
7 | 7 | xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" |
8 | | - xmlns:wct="using:CommunityToolkit.WinUI" |
| 8 | + xmlns:ui="using:CommunityToolkit.WinUI" |
9 | 9 | mc:Ignorable="d"> |
10 | 10 |
|
11 | 11 | <Page.Resources> |
12 | | - <wct:TransitionHelper x:Key="MyTransitionHelper"> |
13 | | - <wct:TransitionConfig Id="background" |
| 12 | + <ui:TransitionHelper x:Key="MyTransitionHelper"> |
| 13 | + <ui:TransitionConfig Id="background" |
14 | 14 | ScaleMode="Scale" /> |
15 | | - <wct:TransitionConfig Id="image" |
| 15 | + <ui:TransitionConfig Id="image" |
16 | 16 | ScaleMode="Scale" /> |
17 | | - <wct:TransitionConfig Id="name" |
| 17 | + <ui:TransitionConfig Id="name" |
18 | 18 | ScaleMode="Custom"> |
19 | | - <wct:TransitionConfig.CustomScalingCalculator> |
| 19 | + <ui:TransitionConfig.CustomScalingCalculator> |
20 | 20 | <local:CustomTextScalingCalculator /> |
21 | | - </wct:TransitionConfig.CustomScalingCalculator> |
22 | | - </wct:TransitionConfig> |
23 | | - <wct:TransitionConfig EnableClipAnimation="true" |
| 21 | + </ui:TransitionConfig.CustomScalingCalculator> |
| 22 | + </ui:TransitionConfig> |
| 23 | + <ui:TransitionConfig EnableClipAnimation="true" |
24 | 24 | Id="desc" /> |
25 | | - </wct:TransitionHelper> |
| 25 | + </ui:TransitionHelper> |
26 | 26 |
|
27 | 27 | <ImageBrush x:Key="ImageBackgroundBrush" |
28 | 28 | ImageSource="ms-appx:///Assets/Owl2.jpg" /> |
|
36 | 36 | Spacing="10"> |
37 | 37 | <Grid Width="50" |
38 | 38 | Height="50"> |
39 | | - <Border wct:TransitionHelper.Id="background" |
| 39 | + <Border ui:TransitionHelper.Id="background" |
40 | 40 | Background="{ThemeResource SystemControlBackgroundChromeMediumBrush}" |
41 | 41 | CornerRadius="4" /> |
42 | 42 | <Border Width="36" |
43 | 43 | Height="36" |
44 | | - wct:TransitionHelper.Id="image" |
| 44 | + ui:TransitionHelper.Id="image" |
45 | 45 | Background="{StaticResource ImageBackgroundBrush}" |
46 | 46 | CornerRadius="18" /> |
47 | 47 | </Grid> |
48 | | - <StackPanel wct:TransitionHelper.Id="guide" |
| 48 | + <StackPanel ui:TransitionHelper.Id="guide" |
49 | 49 | Spacing="2"> |
50 | 50 | <Button x:Name="MinToMidButton" |
51 | 51 | Content="" |
52 | 52 | Style="{StaticResource NavigationBackButtonNormalStyle}"> |
53 | 53 | <i:Interaction.Behaviors> |
54 | 54 | <i:EventTriggerBehavior EventName="Click"> |
55 | | - <wct:StartTransitionAction Source="{Binding ElementName=FirstControl}" |
| 55 | + <ui:StartTransitionAction Source="{Binding ElementName=FirstControl}" |
56 | 56 | Target="{Binding ElementName=SecondControl}" |
57 | 57 | Transition="{StaticResource MyTransitionHelper}" /> |
58 | 58 | </i:EventTriggerBehavior> |
|
63 | 63 | Style="{StaticResource NavigationBackButtonNormalStyle}"> |
64 | 64 | <i:Interaction.Behaviors> |
65 | 65 | <i:EventTriggerBehavior EventName="Click"> |
66 | | - <wct:StartTransitionAction Source="{Binding ElementName=FirstControl}" |
| 66 | + <ui:StartTransitionAction Source="{Binding ElementName=FirstControl}" |
67 | 67 | Target="{Binding ElementName=ThirdControl}" |
68 | 68 | Transition="{StaticResource MyTransitionHelper}" /> |
69 | 69 | </i:EventTriggerBehavior> |
|
76 | 76 | HorizontalAlignment="Center" |
77 | 77 | VerticalAlignment="Top" |
78 | 78 | Visibility="Collapsed"> |
79 | | - <Border wct:TransitionHelper.Id="background" |
| 79 | + <Border ui:TransitionHelper.Id="background" |
80 | 80 | Background="{ThemeResource SystemControlBackgroundChromeMediumBrush}" |
81 | 81 | CornerRadius="8" /> |
82 | 82 | <StackPanel Padding="20" |
83 | 83 | Orientation="Horizontal" |
84 | 84 | Spacing="20"> |
85 | 85 | <Border Width="50" |
86 | 86 | Height="50" |
87 | | - wct:TransitionHelper.Id="image" |
| 87 | + ui:TransitionHelper.Id="image" |
88 | 88 | Background="{StaticResource ImageBackgroundBrush}" |
89 | 89 | CornerRadius="25" /> |
90 | 90 | <StackPanel Width="400" |
91 | 91 | VerticalAlignment="Center" |
92 | 92 | Spacing="5"> |
93 | | - <TextBlock wct:TransitionHelper.Id="name">Magic</TextBlock> |
94 | | - <TextBlock wct:TransitionHelper.Id="desc">Magic is a cute 😺.</TextBlock> |
| 93 | + <TextBlock ui:TransitionHelper.Id="name">Magic</TextBlock> |
| 94 | + <TextBlock ui:TransitionHelper.Id="desc">Magic is a cute 😺.</TextBlock> |
95 | 95 | </StackPanel> |
96 | | - <StackPanel wct:TransitionHelper.Id="guide" |
| 96 | + <StackPanel ui:TransitionHelper.Id="guide" |
97 | 97 | Orientation="Horizontal" |
98 | 98 | Spacing="2"> |
99 | 99 | <Button Content="" |
100 | 100 | Style="{StaticResource NavigationBackButtonNormalStyle}"> |
101 | 101 | <i:Interaction.Behaviors> |
102 | 102 | <i:EventTriggerBehavior EventName="Click"> |
103 | | - <wct:ReverseTransitionAction Transition="{StaticResource MyTransitionHelper}" /> |
| 103 | + <ui:ReverseTransitionAction Transition="{StaticResource MyTransitionHelper}" /> |
104 | 104 | </i:EventTriggerBehavior> |
105 | 105 | </i:Interaction.Behaviors> |
106 | 106 | </Button> |
|
109 | 109 | Style="{StaticResource NavigationBackButtonNormalStyle}"> |
110 | 110 | <i:Interaction.Behaviors> |
111 | 111 | <i:EventTriggerBehavior EventName="Click"> |
112 | | - <wct:StartTransitionAction Source="{Binding ElementName=SecondControl}" |
| 112 | + <ui:StartTransitionAction Source="{Binding ElementName=SecondControl}" |
113 | 113 | Target="{Binding ElementName=FirstControl}" |
114 | 114 | Transition="{StaticResource MyTransitionHelper}" /> |
115 | 115 | </i:EventTriggerBehavior> |
|
120 | 120 | Style="{StaticResource NavigationBackButtonNormalStyle}"> |
121 | 121 | <i:Interaction.Behaviors> |
122 | 122 | <i:EventTriggerBehavior EventName="Click"> |
123 | | - <wct:StartTransitionAction Source="{Binding ElementName=SecondControl}" |
| 123 | + <ui:StartTransitionAction Source="{Binding ElementName=SecondControl}" |
124 | 124 | Target="{Binding ElementName=ThirdControl}" |
125 | 125 | Transition="{StaticResource MyTransitionHelper}" /> |
126 | 126 | </i:EventTriggerBehavior> |
|
133 | 133 | HorizontalAlignment="Center" |
134 | 134 | VerticalAlignment="Center" |
135 | 135 | Visibility="Collapsed"> |
136 | | - <Border wct:TransitionHelper.Id="background" |
| 136 | + <Border ui:TransitionHelper.Id="background" |
137 | 137 | Background="{ThemeResource SystemControlBackgroundChromeMediumBrush}" |
138 | 138 | CornerRadius="8" /> |
139 | 139 | <StackPanel Padding="20" |
140 | 140 | HorizontalAlignment="Center" |
141 | 141 | Spacing="20"> |
142 | 142 | <Border Width="80" |
143 | 143 | Height="80" |
144 | | - wct:TransitionHelper.Id="image" |
| 144 | + ui:TransitionHelper.Id="image" |
145 | 145 | Background="{StaticResource ImageBackgroundBrush}" |
146 | 146 | CornerRadius="40" /> |
147 | 147 | <StackPanel Spacing="5"> |
148 | 148 | <TextBlock MaxWidth="200" |
149 | 149 | HorizontalAlignment="Center" |
150 | | - wct:TransitionHelper.Id="name" |
| 150 | + ui:TransitionHelper.Id="name" |
151 | 151 | FontSize="24" |
152 | 152 | TextAlignment="Center" |
153 | 153 | TextWrapping="Wrap"> |
154 | 154 | Magic is my cat's name |
155 | 155 | </TextBlock> |
156 | 156 | <TextBlock HorizontalAlignment="Center" |
157 | | - wct:TransitionHelper.Id="desc"> |
| 157 | + ui:TransitionHelper.Id="desc"> |
158 | 158 | Magic is a cute 😺, but sometimes very naughty. |
159 | 159 | </TextBlock> |
160 | 160 | </StackPanel> |
161 | 161 | <StackPanel Padding="50,100" |
162 | | - wct:TransitionHelper.IsIndependent="True"> |
| 162 | + ui:TransitionHelper.IsIndependent="True"> |
163 | 163 | <Rectangle Width="200" |
164 | 164 | Height="20" |
165 | 165 | Margin="10" |
|
197 | 197 | <StackPanel Margin="10" |
198 | 198 | HorizontalAlignment="Right" |
199 | 199 | VerticalAlignment="Top" |
200 | | - wct:TransitionHelper.Id="guide" |
| 200 | + ui:TransitionHelper.Id="guide" |
201 | 201 | Orientation="Horizontal" |
202 | 202 | Spacing="2"> |
203 | 203 | <Button Content="" |
204 | 204 | Style="{StaticResource NavigationBackButtonNormalStyle}"> |
205 | 205 | <i:Interaction.Behaviors> |
206 | 206 | <i:EventTriggerBehavior EventName="Click"> |
207 | | - <wct:ReverseTransitionAction Transition="{StaticResource MyTransitionHelper}" /> |
| 207 | + <ui:ReverseTransitionAction Transition="{StaticResource MyTransitionHelper}" /> |
208 | 208 | </i:EventTriggerBehavior> |
209 | 209 | </i:Interaction.Behaviors> |
210 | 210 | </Button> |
|
213 | 213 | Style="{StaticResource NavigationBackButtonNormalStyle}"> |
214 | 214 | <i:Interaction.Behaviors> |
215 | 215 | <i:EventTriggerBehavior EventName="Click"> |
216 | | - <wct:StartTransitionAction Source="{Binding ElementName=ThirdControl}" |
| 216 | + <ui:StartTransitionAction Source="{Binding ElementName=ThirdControl}" |
217 | 217 | Target="{Binding ElementName=FirstControl}" |
218 | 218 | Transition="{StaticResource MyTransitionHelper}" /> |
219 | 219 | </i:EventTriggerBehavior> |
|
224 | 224 | Style="{StaticResource NavigationBackButtonNormalStyle}"> |
225 | 225 | <i:Interaction.Behaviors> |
226 | 226 | <i:EventTriggerBehavior EventName="Click"> |
227 | | - <wct:StartTransitionAction Source="{Binding ElementName=ThirdControl}" |
| 227 | + <ui:StartTransitionAction Source="{Binding ElementName=ThirdControl}" |
228 | 228 | Target="{Binding ElementName=SecondControl}" |
229 | 229 | Transition="{StaticResource MyTransitionHelper}" /> |
230 | 230 | </i:EventTriggerBehavior> |
|
0 commit comments