CommunityToolkit
/
WindowsCommunityToolkit
зеркало из
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Merge remote-tracking branch 'origin/master' into dev/split-controls 

# Conflicts:
#	Microsoft.Toolkit.Uwp.SampleApp/Microsoft.Toolkit.Uwp.SampleApp.csproj
#	Microsoft.Toolkit.Uwp.SampleApp/Models/Sample.cs
#	Microsoft.Toolkit.Uwp.UI.Controls/Microsoft.Toolkit.Uwp.UI.Controls.csproj
#	Microsoft.Toolkit.Uwp.UI.Controls/Themes/Generic.xaml
#	SmokeTests/SmokeTests.proj
#	Windows Community Toolkit.sln
This commit is contained in:
michael-hawker 2021-01-21 13:00:32 -08:00
Родитель 2376dd33d2 58f8166bb7
Коммит f55f101ca2
274 изменённых файлов: 10139 добавлений и 5206 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

5
.editorconfig
Просмотреть файл

@ -324,4 +324,7 @@ dotnet_diagnostic.SA1652.severity = none
dotnet_diagnostic.SA1629.severity = none # DocumentationTextMustEndWithAPeriod: Let's enable this rule back when we shift to WinUI3 (v8.x). If we do it now, it would mean more than 400 file changes.
dotnet_diagnostic.SA1413.severity = none # UseTrailingCommasInMultiLineInitializers: This would also mean a lot of changes at the end of all multiline initializers. It's also debatable if we want this or not.
dotnet_diagnostic.SA1314.severity = none # TypeParameterNamesMustBeginWithT: We do have a few templates that don't start with T. We need to double check that changing this is not a breaking change. If not, we can re-enable this.
dotnet_diagnostic.SA1314.severity = none # TypeParameterNamesMustBeginWithT: We do have a few templates that don't start with T. We need to double check that changing this is not a breaking change. If not, we can re-enable this.
dotnet_diagnostic.SA1000.severity = none # Hide warnings when using the new() expression from C# 9.
dotnet_diagnostic.SA1313.severity = none # Hide warnings for record parameters.
dotnet_diagnostic.SA1101.severity = none # Hide warnings when accessing properties without "this".

Двоичные данные
Microsoft.Toolkit.Uwp.SampleApp/Assets/Llama.mp3 Normal file
Просмотреть файл

Двоичный файл не отображается.

109
Microsoft.Toolkit.Uwp.SampleApp/Microsoft.Toolkit.Uwp.SampleApp.csproj
Просмотреть файл

@ -137,6 +137,7 @@
<!-- A reference to the entire .Net Framework and Windows SDK are automatically included -->
<Content Include="Assets\BrushAssets\TileTexture.png" />
<Content Include="Assets\BrushAssets\NoiseTexture.png" />
<Content Include="Assets\Llama.mp3" />
<Content Include="Assets\mslogo.png" />
<Content Include="Assets\NotificationAssets\Cloudy-Square.png" />
<Content Include="Assets\NotificationAssets\Cloudy.png" />
@ -271,6 +272,7 @@
<Content Include="Icons\More.png" />
<Content Include="Icons\Notifications.png" />
<Content Include="Icons\Services.png" />
<Content Include="SamplePages\Animations\Effects\FadeBehavior.png" />
<Content Include="SamplePages\ColorPicker\ColorPicker.png" />
<Content Include="SamplePages\TilesBrush\TilesBrush.png" />
<Content Include="SamplePages\Eyedropper\Eyedropper.png" />
@ -295,7 +297,6 @@
<Content Include="SamplePages\BackgroundTaskHelper\BackgroundTaskHelper.png" />
<Content Include="SamplePages\BluetoothLEHelper\BluetoothLEHelper.png" />
<Content Include="SamplePages\BackdropBlurBrush\BackdropBlurBrush.png" />
<Content Include="SamplePages\Blur\BlurBehavior.png" />
<Content Include="SamplePages\CameraPreview\CameraPreview.png" />
<Content Include="SamplePages\CameraHelper\CameraHelper.png" />
<Content Include="SamplePages\Connected Animations\ConnectedAnimations.png" />
@ -306,7 +307,6 @@
<Content Include="SamplePages\LoginButton\LoginButton.png" />
-->
<Content Include="SamplePages\FadeHeader\FadeHeaderBehavior.png" />
<Content Include="SamplePages\Fade\FadeBehavior.png" />
<Content Include="SamplePages\FocusTracker\FocusTracker.png" />
<Content Include="SamplePages\BladeView\BladeView.png" />
<Content Include="SamplePages\Carousel\Carousel.png" />
@ -328,7 +328,6 @@
<Content Include="SamplePages\Incremental Loading Collection\icon.png" />
<Content Include="SamplePages\LayoutTransformControl\LayoutTransformControl.png" />
<Content Include="SamplePages\InfiniteCanvas\InfiniteCanvas.png" />
<Content Include="SamplePages\Light\LightBehavior.png" />
<Content Include="SamplePages\LinkedIn Service\LinkedInLogo.png" />
<Content Include="Assets\Helpers.png" />
<Content Include="SamplePages\LiveTile\LiveTile.png" />
@ -339,18 +338,14 @@
<Content Include="SamplePages\Menu\Menu.png" />
<Content Include="SamplePages\Microsoft Translator Service\TranslatorService.png" />
<Content Include="SamplePages\NetworkHelper\NetworkHelper.png" />
<Content Include="SamplePages\Offset\OffsetBehavior.png" />
<Content Include="SamplePages\Mouse\MouseCursor.png" />
<Content Include="SamplePages\OneDrive Service\OneDriveLogo.png" />
<Content Include="SamplePages\RadialGauge\RadialGauge.png" />
<Content Include="SamplePages\RadialGradientBrush\RadialGradientBrush.png" />
<Content Include="SamplePages\RadialProgressBar\RadialProgressBar.png" />
<Content Include="SamplePages\RemoteDevicePicker\RemoteDevicePicker.png" />
<Content Include="SamplePages\ReorderGridAnimation\ReorderGrid.png" />
<Content Include="SamplePages\Rotate\RotateBehavior.png" />
<Content Include="SamplePages\Saturation\SaturationBehavior.png" />
<Content Include="SamplePages\ItemsReorderAnimation\ItemsReorderAnimation.png" />
<Content Include="SamplePages\OrbitView\OrbitView.png" />
<Content Include="SamplePages\Scale\ScaleBehavior.png" />
<Content Include="SamplePages\ScrollViewerExtensions\ScrollViewerExtensionsCode.bind" />
<Content Include="SamplePages\StaggeredPanel\StaggeredPanel.png" />
<Content Include="SamplePages\SystemInformation\SystemInformation.png" />
@ -383,11 +378,7 @@
<Content Include="SamplePages\WeatherLiveTileAndToast\WeatherLiveTileAndToast.png" />
<Content Include="SamplePages\WeatherLiveTileAndToast\WeatherLiveTileAndToastCode.bind" />
<Content Include="SamplePages\ImageEx\ImageExCode.bind" />
<Content Include="SamplePages\Offset\OffsetBehaviorCode.bind" />
<Content Include="SamplePages\Fade\FadeBehaviorCode.bind" />
<Content Include="SamplePages\RadialGauge\RadialGaugeCode.bind" />
<Content Include="SamplePages\Rotate\RotateBehaviorCode.bind" />
<Content Include="SamplePages\Scale\ScaleBehaviorCode.bind" />
<Content Include="Assets\Photos\Photos.json" />
<Content Include="Assets\Photos\OnlinePhotos.json" />
<Content Include="SamplePages\RangeSelector\RangeSelectorCode.bind" />
@ -399,13 +390,7 @@
<Content Include="SamplePages\LiveTile\LiveTileCode.bind" />
<Content Include="SamplePages\Toast\ToastCode.bind" />
<Content Include="SamplePages\RotatorTile\RotatorTileCode.bind" />
<Content Include="SamplePages\Saturation\SaturationBehaviorCode.bind" />
<Content Include="SamplePages\Saturation\SaturationBehaviorXaml.bind" />
<Content Include="SamplePages\Offset\OffsetBehaviorXaml.bind" />
<Content Include="SamplePages\Expander\ExpanderXaml.bind" />
<Content Include="SamplePages\Fade\FadeBehaviorXaml.bind" />
<Content Include="SamplePages\Scale\ScaleBehaviorXaml.bind" />
<Content Include="SamplePages\Rotate\RotateBehaviorXaml.bind" />
<Content Include="SamplePages\BladeView\BladeCode.bind" />
<Content Include="SamplePages\ScrollHeader\ScrollHeaderCode.bind" />
<Content Include="SamplePages\GridSplitter\GridSplitter.bind" />
@ -424,9 +409,7 @@
<Content Include="SamplePages\SystemInformation\SystemInformationCode.bind" />
<Content Include="SamplePages\Connected Animations\ConnectedAnimationsCode.bind" />
<Content Include="SamplePages\Loading\LoadingCode.bind" />
<Content Include="SamplePages\ReorderGridAnimation\ReorderGrid.bind" />
<Content Include="SamplePages\Light\LightBehaviorCode.bind" />
<Content Include="SamplePages\Light\LightBehaviorXaml.bind" />
<Content Include="SamplePages\ItemsReorderAnimation\ItemsReorderAnimation.bind" />
<Content Include="SamplePages\TextBoxMask\TextBoxMask.bind" />
<Content Include="SamplePages\TileControl\TileControl.bind">
<SubType>Designer</SubType>
@ -443,8 +426,6 @@
<Content Include="SamplePages\TextBoxRegex\TextBoxRegex.bind" />
<Content Include="SamplePages\RadialProgressBar\RadialProgressBarCode.bind" />
<Content Include="SamplePages\MarkdownTextBlock\MarkdownTextBlockCode.bind" />
<Content Include="SamplePages\Blur\BlurBehaviorCode.bind" />
<Content Include="SamplePages\Blur\BlurBehaviorXaml.bind" />
<Content Include="SamplePages\ViewExtensions\ViewExtensionsCode.bind">
<SubType>Designer</SubType>
</Content>
@ -616,6 +597,27 @@
<Content Include="SamplePages\AutoFocusBehavior\AutoFocusBehaviorXaml.bind" />
<Content Include="SamplePages\ColorPicker\ColorPickerXaml.bind" />
<Content Include="SamplePages\ColorPicker\ColorPickerButtonXaml.bind" />
<Content Include="SamplePages\Animations\Effects\FadeBehaviorCode.bind" />
<Content Include="SamplePages\Animations\Effects\FadeBehaviorXaml.bind" />
<Content Include="SamplePages\Animations\Activities\StartAnimationActivity.bind" />
<Content Include="SamplePages\Animations\Activities\InvokeActionsActivity.bind" />
<Content Include="SamplePages\Animations\Behaviors\BlurBehavior.png" />
<Content Include="SamplePages\Animations\Behaviors\BlurBehaviorCode.bind" />
<Content Include="SamplePages\Animations\Behaviors\BlurBehaviorXaml.bind" />
<Content Include="SamplePages\Animations\Behaviors\OffsetBehavior.png" />
<Content Include="SamplePages\Animations\Behaviors\OffsetBehaviorCode.bind" />
<Content Include="SamplePages\Animations\Behaviors\OffsetBehaviorXaml.bind" />
<Content Include="SamplePages\Animations\Behaviors\SaturationBehavior.png" />
<Content Include="SamplePages\Animations\Behaviors\SaturationBehaviorCode.bind" />
<Content Include="SamplePages\Animations\Behaviors\SaturationBehaviorXaml.bind" />
<Content Include="SamplePages\Animations\Behaviors\ScaleBehavior.png" />
<Content Include="SamplePages\Animations\Behaviors\ScaleBehaviorCode.bind" />
<Content Include="SamplePages\Animations\Behaviors\ScaleBehaviorXaml.bind" />
<Content Include="SamplePages\Animations\Behaviors\RotateBehavior.png" />
<Content Include="SamplePages\Animations\Behaviors\RotateBehaviorCode.bind" />
<Content Include="SamplePages\Animations\Behaviors\RotateBehaviorXaml.bind" />
<Content Include="SamplePages\Animations\Effects\EffectAnimations.bind" />
<Content Include="SamplePages\VisualEffectFactory\VisualEffectFactory.bind" />
</ItemGroup>
<ItemGroup>
<Compile Include="App.xaml.cs">
@ -823,9 +825,6 @@
<Compile Include="SamplePages\BladeView\BladePage.xaml.cs">
<DependentUpon>BladePage.xaml</DependentUpon>
</Compile>
<Compile Include="SamplePages\Blur\BlurBehaviorPage.xaml.cs">
<DependentUpon>BlurBehaviorPage.xaml</DependentUpon>
</Compile>
<Compile Include="SamplePages\AlignmentGrid\AlignmentGridPage.xaml.cs">
<DependentUpon>AlignmentGridPage.xaml</DependentUpon>
</Compile>
@ -835,9 +834,6 @@
<Compile Include="SamplePages\Microsoft Translator Service\MicrosoftTranslatorPage.xaml.cs">
<DependentUpon>MicrosoftTranslatorPage.xaml</DependentUpon>
</Compile>
<Compile Include="SamplePages\Saturation\SaturationBehaviorPage.xaml.cs">
<DependentUpon>SaturationBehaviorPage.xaml</DependentUpon>
</Compile>
<Compile Include="SamplePages\TileControl\TileControlPage.xaml.cs">
<DependentUpon>TileControlPage.xaml</DependentUpon>
</Compile>
@ -858,9 +854,6 @@
</Compile>
<Compile Include="SamplePages\Incremental Loading Collection\PeopleSource.cs" />
<Compile Include="SamplePages\Incremental Loading Collection\Person.cs" />
<Compile Include="SamplePages\Light\LightBehaviorPage.xaml.cs">
<DependentUpon>LightBehaviorPage.xaml</DependentUpon>
</Compile>
<Compile Include="SamplePages\LinkedIn Service\LinkedInPage.xaml.cs">
<DependentUpon>LinkedInPage.xaml</DependentUpon>
</Compile>
@ -876,8 +869,8 @@
<Compile Include="SamplePages\PrintHelper\PrintHelperPage.xaml.cs">
<DependentUpon>PrintHelperPage.xaml</DependentUpon>
</Compile>
<Compile Include="SamplePages\ReorderGridAnimation\ReorderGridPage.xaml.cs">
<DependentUpon>ReorderGridPage.xaml</DependentUpon>
<Compile Include="SamplePages\ItemsReorderAnimation\ItemsReorderAnimationPage.xaml.cs">
<DependentUpon>ItemsReorderAnimationPage.xaml</DependentUpon>
</Compile>
<Compile Include="SamplePages\RotatorTile\RotatorTilePage.xaml.cs">
<DependentUpon>RotatorTilePage.xaml</DependentUpon>
@ -906,12 +899,6 @@
<Compile Include="SamplePages\Twitter Service\TwitterPage.xaml.cs">
<DependentUpon>TwitterPage.xaml</DependentUpon>
</Compile>
<Compile Include="SamplePages\Offset\OffsetBehaviorPage.xaml.cs">
<DependentUpon>OffsetBehaviorPage.xaml</DependentUpon>
</Compile>
<Compile Include="SamplePages\Fade\FadeBehaviorPage.xaml.cs">
<DependentUpon>FadeBehaviorPage.xaml</DependentUpon>
</Compile>
<Compile Include="SamplePages\ImageEx\ImageExPage.xaml.cs">
<DependentUpon>ImageExPage.xaml</DependentUpon>
</Compile>
@ -925,12 +912,6 @@
<Compile Include="SamplePages\WeatherLiveTileAndToast\WeatherLiveTileAndToastPage.xaml.cs">
<DependentUpon>WeatherLiveTileAndToastPage.xaml</DependentUpon>
</Compile>
<Compile Include="SamplePages\Rotate\RotateBehaviorPage.xaml.cs">
<DependentUpon>RotateBehaviorPage.xaml</DependentUpon>
</Compile>
<Compile Include="SamplePages\Scale\ScaleBehaviorPage.xaml.cs">
<DependentUpon>ScaleBehaviorPage.xaml</DependentUpon>
</Compile>
<Compile Include="SamplePages\RadialGauge\RadialGaugePage.xaml.cs">
<DependentUpon>RadialGaugePage.xaml</DependentUpon>
</Compile>
@ -1272,10 +1253,6 @@
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
</Page>
<Page Include="SamplePages\Blur\BlurBehaviorPage.xaml">
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
</Page>
<Page Include="SamplePages\AlignmentGrid\AlignmentGridPage.xaml">
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
@ -1292,10 +1269,6 @@
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
</Page>
<Page Include="SamplePages\Saturation\SaturationBehaviorPage.xaml">
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
</Page>
<Page Include="SamplePages\TileControl\TileControlPage.xaml">
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
@ -1324,10 +1297,6 @@
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
</Page>
<Page Include="SamplePages\Light\LightBehaviorPage.xaml">
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
</Page>
<Page Include="SamplePages\LinkedIn Service\LinkedInPage.xaml">
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
@ -1348,7 +1317,7 @@
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
</Page>
<Page Include="SamplePages\ReorderGridAnimation\ReorderGridPage.xaml">
<Page Include="SamplePages\ItemsReorderAnimation\ItemsReorderAnimationPage.xaml">
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
</Page>
@ -1360,14 +1329,6 @@
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
</Page>
<Page Include="SamplePages\Offset\OffsetBehaviorPage.xaml">
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
</Page>
<Page Include="SamplePages\Fade\FadeBehaviorPage.xaml">
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
</Page>
<Page Include="SamplePages\Object Storage\ObjectStoragePage.xaml">
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
@ -1420,14 +1381,6 @@
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
</Page>
<Page Include="SamplePages\Rotate\RotateBehaviorPage.xaml">
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
</Page>
<Page Include="SamplePages\Scale\ScaleBehaviorPage.xaml">
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
</Page>
<Page Include="SamplePages\Weibo Service\WeiboPage.xaml">
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
@ -1502,6 +1455,10 @@
<Project>{1ae2cb5c-58a0-4f12-8e6f-2cd4aaadb34c}</Project>
<Name>Microsoft.Toolkit.Uwp.Samples.BackgroundTasks</Name>
</ProjectReference>
<ProjectReference Include="..\Microsoft.Toolkit.Uwp.UI.Behaviors\Microsoft.Toolkit.Uwp.UI.Behaviors.csproj">
<Project>{d4ff799d-0df2-495a-adc9-3bbc4aef8971}</Project>
<Name>Microsoft.Toolkit.Uwp.UI.Behaviors</Name>
</ProjectReference>
<ProjectReference Include="..\Microsoft.Toolkit.Uwp.UI.Controls.DataGrid\Microsoft.Toolkit.Uwp.UI.Controls.DataGrid.csproj">
<Project>{daeb9cec-c817-33b2-74b2-bc379380db72}</Project>
<Name>Microsoft.Toolkit.Uwp.UI.Controls.DataGrid</Name>
@ -1630,4 +1587,4 @@
<Message Text="CSFiles: @(GeneratedCSFiles->'&quot;%(Identity)&quot;')" />
<Exec Command="for %%f in (@(GeneratedCSFiles->'&quot;%(Identity)&quot;')) do echo #pragma warning disable &gt; %%f.temp &amp;&amp; type %%f | findstr /v /b &quot;#pragma&quot; &gt;&gt; %%f.temp &amp;&amp; move /y %%f.temp %%f &gt; NUL" />
</Target>
</Project>
</Project>

270
Microsoft.Toolkit.Uwp.SampleApp/Pages/About.xaml
Просмотреть файл

@ -1,158 +1,176 @@
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.Pages.About"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
xmlns:extensions="using:Microsoft.Toolkit.Uwp.UI.Extensions"
xmlns:sampleapp="using:Microsoft.Toolkit.Uwp.SampleApp"
xmlns:local="using:Microsoft.Toolkit.Uwp.SampleApp.Pages"
xmlns:animations="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:extensions="using:Microsoft.Toolkit.Uwp.UI.Extensions"
xmlns:local="using:Microsoft.Toolkit.Uwp.SampleApp.Pages"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:sampleapp="using:Microsoft.Toolkit.Uwp.SampleApp"
Loaded="Page_Loaded"
mc:Ignorable="d">
<Page.Resources>
<animations:AnimationCollection x:Key="ImplicitOffset">
<animations:OffsetAnimation Duration="0:0:0.3"></animations:OffsetAnimation>
</animations:AnimationCollection>
<animations:ImplicitAnimationSet x:Key="ImplicitOffset">
<animations:OffsetAnimation Duration="0:0:0.3" />
</animations:ImplicitAnimationSet>
<Style TargetType="ContentPresenter" x:Key="ItemsContainerStyle">
<Setter Property="animations:Implicit.Animations" Value="{StaticResource ImplicitOffset}"></Setter>
<Style x:Key="ItemsContainerStyle"
TargetType="ContentPresenter">
<Setter Property="animations:Implicit.Animations" Value="{StaticResource ImplicitOffset}" />
</Style>
<DataTemplate x:DataType="sampleapp:Sample" x:Key="RecentSampleTemplate">
<DataTemplate x:Key="RecentSampleTemplate"
x:DataType="sampleapp:Sample">
<HyperlinkButton Width="267"
HorizontalContentAlignment="Left"
Style="{StaticResource AboutHyperlinkButtonStyle}"
Click="RecentSample_Click">
<TextBlock Text="{x:Bind Name}"></TextBlock>
Click="RecentSample_Click"
Style="{StaticResource AboutHyperlinkButtonStyle}">
<TextBlock Text="{x:Bind Name}" />
</HyperlinkButton>
</DataTemplate>
<DataTemplate x:DataType="sampleapp:Sample" x:Key="NewSampleTemplate">
<HyperlinkButton Width="267" HorizontalContentAlignment="Left" Style="{StaticResource AboutHyperlinkButtonStyle}" Click="NewSample_Click">
<TextBlock Text="{x:Bind Name}"></TextBlock>
<DataTemplate x:Key="NewSampleTemplate"
x:DataType="sampleapp:Sample">
<HyperlinkButton Width="267"
HorizontalContentAlignment="Left"
Click="NewSample_Click"
Style="{StaticResource AboutHyperlinkButtonStyle}">
<TextBlock Text="{x:Bind Name}" />
</HyperlinkButton>
</DataTemplate>
<DataTemplate x:DataType="sampleapp:GitHubRelease" x:Key="ReleaseNoteTemplate">
<HyperlinkButton HorizontalAlignment="Left"
<DataTemplate x:Key="ReleaseNoteTemplate"
x:DataType="sampleapp:GitHubRelease">
<HyperlinkButton Width="208"
HorizontalAlignment="Left"
HorizontalContentAlignment="Stretch"
NavigateUri="{x:Bind Url}"
Width="208"
Click="ReleaseNotes_Click"
NavigateUri="{x:Bind Url}"
Style="{StaticResource AboutHyperlinkButtonStyle}">
<Grid>
<TextBlock Text="{x:Bind FullName}"></TextBlock>
<TextBlock Text="{x:Bind FullName}" />
<TextBlock HorizontalAlignment="Right"
Opacity="0.5"
Text="{x:Bind Published.ToString('MMM d', {x:Null})}"></TextBlock>
Text="{x:Bind Published.ToString('MMM d', {x:Null})}" />
</Grid>
</HyperlinkButton>
</DataTemplate>
<DataTemplate x:DataType="sampleapp:LandingPageLink" x:Key="LinkTemplate">
<HyperlinkButton Style="{StaticResource AboutHyperlinkButtonStyle}"
<DataTemplate x:Key="LinkTemplate"
x:DataType="sampleapp:LandingPageLink">
<HyperlinkButton Click="Link_Clicked"
NavigateUri="{x:Bind Url}"
Click="Link_Clicked">
<TextBlock Text="{x:Bind Title}"></TextBlock>
Style="{StaticResource AboutHyperlinkButtonStyle}">
<TextBlock Text="{x:Bind Title}" />
</HyperlinkButton>
</DataTemplate>
<ItemsPanelTemplate x:Key="ItemsWrapGridHorizontalTemplate">
<controls:WrapPanel Orientation="Horizontal"></controls:WrapPanel>
<controls:WrapPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</Page.Resources>
<Grid x:Name="Root" Visibility="Collapsed" extensions:VisualExtensions.NormalizedCenterPoint="0.5">
<Grid x:Name="Root"
extensions:VisualExtensions.NormalizedCenterPoint="0.5"
Visibility="Collapsed">
<controls:DropShadowPanel x:Name="DropShadow"
HorizontalAlignment="Center"
VerticalAlignment="Stretch"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
Color="Black"
BlurRadius="30"
ShadowOpacity="0">
ShadowOpacity="0"
Color="Black">
<Grid x:Name="RootGrid">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="664"></ColumnDefinition>
<ColumnDefinition Width="336"></ColumnDefinition>
<ColumnDefinition Width="664" />
<ColumnDefinition Width="336" />
</Grid.ColumnDefinitions>
<Border Grid.Column="1"
x:Name="RightBorder"
Background="{ThemeResource Background-AboutPage-SidePane}"
extensions:VisualExtensions.NormalizedCenterPoint="0, 0.5, 0">
<Border x:Name="RightBorder"
Grid.Column="1"
extensions:VisualExtensions.NormalizedCenterPoint="0, 0.5"
Background="{ThemeResource Background-AboutPage-SidePane}">
<animations:Implicit.ShowAnimations>
<animations:ScaleAnimation From="0, 1, 0" To="1" Duration="0:0:0.3"></animations:ScaleAnimation>
<animations:ScaleAnimation From="0, 1, 0"
To="1"
Duration="0:0:0.3" />
</animations:Implicit.ShowAnimations>
<animations:Implicit.HideAnimations>
<animations:ScaleAnimation From="1" To="0, 1, 0" Duration="0:0:0.3"></animations:ScaleAnimation>
<animations:ScaleAnimation From="1"
To="0, 1, 0"
Duration="0:0:0.3" />
</animations:Implicit.HideAnimations>
</Border>
<Border Background="{ThemeResource Background-AboutPage-Main}"></Border>
<Border Background="{ThemeResource Background-AboutPage-Main}" />
<Border Background="{ThemeResource Border-AboutPage-Vertical}" Width="1" HorizontalAlignment="Right"></Border>
<Border Width="1"
HorizontalAlignment="Right"
Background="{ThemeResource Border-AboutPage-Vertical}" />
<ScrollViewer x:Name="Scroller" Grid.ColumnSpan="2" VerticalScrollBarVisibility="Auto">
<Grid x:Name="InnerGrid" HorizontalAlignment="Center" animations:Implicit.Animations="{StaticResource ImplicitOffset}">
<ScrollViewer x:Name="Scroller"
Grid.ColumnSpan="2"
VerticalScrollBarVisibility="Auto">
<Grid x:Name="InnerGrid"
HorizontalAlignment="Center"
animations:Implicit.Animations="{StaticResource ImplicitOffset}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="64"></ColumnDefinition>
<ColumnDefinition Width="536"></ColumnDefinition>
<ColumnDefinition Width="64"></ColumnDefinition>
<ColumnDefinition Width="64"></ColumnDefinition>
<ColumnDefinition Width="208"></ColumnDefinition>
<ColumnDefinition Width="64"></ColumnDefinition>
<ColumnDefinition Width="64" />
<ColumnDefinition Width="536" />
<ColumnDefinition Width="64" />
<ColumnDefinition Width="64" />
<ColumnDefinition Width="208" />
<ColumnDefinition Width="64" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="84"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="50"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
<RowDefinition Height="36"></RowDefinition>
<RowDefinition Height="84" />
<RowDefinition Height="Auto" />
<RowDefinition Height="50" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="36" />
</Grid.RowDefinitions>
<StackPanel
Grid.Row="1"
Grid.Column="1">
<TextBlock
FontSize="36"
FontFamily="Segoe UI"
FontWeight="Bold"
Text="Get Started" />
<StackPanel Grid.Row="1"
Grid.Column="1">
<TextBlock FontFamily="Segoe UI"
FontSize="36"
FontWeight="Bold"
Text="Get Started" />
<TextBlock
TextWrapping="Wrap"
FontSize="14"
Margin="0,20,0,0"
Foreground="{ThemeResource Brush-Link-Normal}"
Text="The Windows Community Toolkit is a collection of helper functions, custom controls, and app services. It simplifies and demonstrates common developer patterns when building experiences for Windows 10." />
<TextBlock Margin="0,20,0,0"
FontSize="14"
Foreground="{ThemeResource Brush-Link-Normal}"
Text="The Windows Community Toolkit is a collection of helper functions, custom controls, and app services. It simplifies and demonstrates common developer patterns when building experiences for Windows 10."
TextWrapping="Wrap" />
</StackPanel>
<Grid Grid.Row="3" Grid.Column="1" animations:Implicit.Animations="{StaticResource ImplicitOffset}">
<Grid Grid.Row="3"
Grid.Column="1"
animations:Implicit.Animations="{StaticResource ImplicitOffset}">
<StackPanel>
<TextBlock Style="{StaticResource AboutPageHeader}">Recent Activity</TextBlock>
<Grid Margin="0,16,0,0">
<TextBlock Text="None"
Opacity="0.5"
FontFamily="Segoe UI"
FontSize="12"
Visibility="{x:Bind local:About.VisibleIfCollectionEmpty(RecentSamples), Mode=OneWay}"></TextBlock>
<TextBlock FontFamily="Segoe UI"
FontSize="12"
Opacity="0.5"
Text="None"
Visibility="{x:Bind local:About.VisibleIfCollectionEmpty(RecentSamples), Mode=OneWay}" />
<ItemsControl x:Name="RecentSamplesItemsControl"
ItemsPanel="{StaticResource ItemsWrapGridHorizontalTemplate}"
ItemsSource="{x:Bind RecentSamples, Mode=OneWay}"
ItemContainerStyle="{StaticResource ItemsContainerStyle}"
ItemTemplate="{StaticResource RecentSampleTemplate}"
ItemContainerStyle="{StaticResource ItemsContainerStyle}">
</ItemsControl>
ItemsPanel="{StaticResource ItemsWrapGridHorizontalTemplate}"
ItemsSource="{x:Bind RecentSamples, Mode=OneWay}" />
</Grid>
</StackPanel>
</Grid>
@ -161,36 +179,49 @@
Grid.Row="3"
Grid.RowSpan="3"
Grid.Column="4"
ItemsPanel="{StaticResource ItemsWrapGridHorizontalTemplate}"
animations:Implicit.Animations="{StaticResource ImplicitOffset}">
animations:Implicit.Animations="{StaticResource ImplicitOffset}"
ItemsPanel="{StaticResource ItemsWrapGridHorizontalTemplate}">
<StackPanel x:Name="WhatNewPanel" Margin="0,0,0,48" animations:Implicit.Animations="{StaticResource ImplicitOffset}">
<TextBlock Style="{StaticResource AboutPageHeader}" Text="{x:Bind LandingPageLinks.NewSectionTitle, Mode=OneWay}" />
<ItemsControl x:Name="WhatNewItemsControl" Margin="0,16,0,0" ItemsSource="{x:Bind NewSamples, Mode=OneWay}" ItemTemplate="{StaticResource NewSampleTemplate}"></ItemsControl>
<StackPanel x:Name="WhatNewPanel"
Margin="0,0,0,48"
animations:Implicit.Animations="{StaticResource ImplicitOffset}">
<TextBlock Style="{StaticResource AboutPageHeader}"
Text="{x:Bind LandingPageLinks.NewSectionTitle, Mode=OneWay}" />
<ItemsControl x:Name="WhatNewItemsControl"
Margin="0,16,0,0"
ItemTemplate="{StaticResource NewSampleTemplate}"
ItemsSource="{x:Bind NewSamples, Mode=OneWay}" />
</StackPanel>
<StackPanel x:Name="ReleaseNotesPanel" animations:Implicit.Animations="{StaticResource ImplicitOffset}">
<StackPanel x:Name="ReleaseNotesPanel"
animations:Implicit.Animations="{StaticResource ImplicitOffset}">
<TextBlock Style="{StaticResource AboutPageHeader}">Release Notes</TextBlock>
<ItemsControl Margin="0,16,0,0" ItemsSource="{x:Bind GitHubReleases, Mode=OneWay}" ItemTemplate="{StaticResource ReleaseNoteTemplate}"></ItemsControl>
<ItemsControl Margin="0,16,0,0"
ItemTemplate="{StaticResource ReleaseNoteTemplate}"
ItemsSource="{x:Bind GitHubReleases, Mode=OneWay}" />
</StackPanel>
</ItemsControl>
<ItemsControl x:Name="ResourcesSection"
Grid.Row="5"
Grid.Column="1"
ItemsSource="{x:Bind LandingPageLinks.Resources, Mode=OneWay}"
animations:Implicit.Animations="{StaticResource ImplicitOffset}"
ItemsPanel="{StaticResource ItemsWrapGridHorizontalTemplate}"
animations:Implicit.Animations="{StaticResource ImplicitOffset}">
ItemsSource="{x:Bind LandingPageLinks.Resources, Mode=OneWay}">
<ItemsControl.ItemTemplate>
<DataTemplate x:DataType="sampleapp:LandingPageResource">
<StackPanel MinWidth="267" Margin="0,0,0,48" animations:Implicit.Animations="{StaticResource ImplicitOffset}">
<TextBlock Style="{StaticResource AboutPageHeader}" Text="{x:Bind Title}" />
<ItemsControl
ItemsSource="{x:Bind Links}"
Margin="0,16,0,0">
<StackPanel MinWidth="267"
Margin="0,0,0,48"
animations:Implicit.Animations="{StaticResource ImplicitOffset}">
<TextBlock Style="{StaticResource AboutPageHeader}"
Text="{x:Bind Title}" />
<ItemsControl Margin="0,16,0,0"
ItemsSource="{x:Bind Links}">
<ItemsControl.ItemTemplate>
<DataTemplate x:DataType="sampleapp:LandingPageLink">
<HyperlinkButton Style="{StaticResource AboutHyperlinkButtonStyle}" NavigateUri="{x:Bind Url}" Click="Link_Clicked">
<HyperlinkButton Click="Link_Clicked"
NavigateUri="{x:Bind Url}"
Style="{StaticResource AboutHyperlinkButtonStyle}">
<TextBlock Text="{x:Bind Title}" />
</HyperlinkButton>
</DataTemplate>
@ -204,18 +235,25 @@
<Border x:Name="Separator"
Grid.Row="4"
Grid.Column="4"
BorderThickness="0,1,0,0"
BorderBrush="{ThemeResource Border-AboutPage-Horizontal}"
Margin="0,48"
animations:Implicit.Animations="{StaticResource ImplicitOffset}"></Border>
animations:Implicit.Animations="{StaticResource ImplicitOffset}"
BorderBrush="{ThemeResource Border-AboutPage-Horizontal}"
BorderThickness="0,1,0,0" />
<Border Grid.Row="4"
Grid.Column="1"
BorderThickness="0,1,0,0"
BorderBrush="{ThemeResource Border-AboutPage-Horizontal}"
Margin="0,48"
animations:Implicit.Animations="{StaticResource ImplicitOffset}"></Border>
animations:Implicit.Animations="{StaticResource ImplicitOffset}"
BorderBrush="{ThemeResource Border-AboutPage-Horizontal}"
BorderThickness="0,1,0,0" />
<HyperlinkButton animations:Implicit.Animations="{StaticResource ImplicitOffset}" x:Name="PrivacyButton" Grid.Row="9" Grid.Column="4" VerticalAlignment="Bottom" HorizontalAlignment="Center" Style="{StaticResource AboutHyperlinkButtonStyle}" NavigateUri="https://go.microsoft.com/fwlink/?LinkId=521839">
<HyperlinkButton x:Name="PrivacyButton"
Grid.Row="9"
Grid.Column="4"
HorizontalAlignment="Center"
VerticalAlignment="Bottom"
animations:Implicit.Animations="{StaticResource ImplicitOffset}"
NavigateUri="https://go.microsoft.com/fwlink/?LinkId=521839"
Style="{StaticResource AboutHyperlinkButtonStyle}">
<TextBlock>Privacy statement</TextBlock>
</HyperlinkButton>
</Grid>
@ -224,12 +262,20 @@
</controls:DropShadowPanel>
<animations:Implicit.ShowAnimations>
<animations:OpacityAnimation From="0" To="1" Duration="0:0:0.5"></animations:OpacityAnimation>
<animations:ScaleAnimation From="0.9" To="1" Duration="0:0:0.5"></animations:ScaleAnimation>
<animations:OpacityAnimation From="0"
To="1"
Duration="0:0:0.5" />
<animations:ScaleAnimation From="0.9"
To="1"
Duration="0:0:0.5" />
</animations:Implicit.ShowAnimations>
<animations:Implicit.HideAnimations>
<animations:OpacityAnimation From="1" To="0" Duration="0:0:0.2"></animations:OpacityAnimation>
<animations:ScaleAnimation To="0.9" From="1" Duration="0:0:0.2"></animations:ScaleAnimation>
<animations:OpacityAnimation From="1"
To="0"
Duration="0:0:0.2" />
<animations:ScaleAnimation From="1"
To="0.9"
Duration="0:0:0.2" />
</animations:Implicit.HideAnimations>
<VisualStateManager.VisualStateGroups>
@ -267,7 +313,7 @@
<Setter Target="WhatNewItemsControl.MinHeight" Value="0" />
<Setter Target="RecentSamplesItemsControl.MinHeight" Value="0" />
<Setter Target="RightBorder.Visibility" Value="Collapsed"></Setter>
<Setter Target="RightBorder.Visibility" Value="Collapsed" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="WideState">
@ -303,7 +349,7 @@
<Setter Target="WhatNewItemsControl.MinHeight" Value="130" />
<Setter Target="RecentSamplesItemsControl.MinHeight" Value="130" />
<Setter Target="RightBorder.Visibility" Value="Visible"></Setter>
<Setter Target="RightBorder.Visibility" Value="Visible" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>

3
Microsoft.Toolkit.Uwp.SampleApp/Pages/About.xaml.cs
Просмотреть файл

@ -151,8 +151,7 @@ namespace Microsoft.Toolkit.Uwp.SampleApp.Pages
From = 0,
To = 1,
Duration = TimeSpan.FromMilliseconds(300),
Delay = TimeSpan.FromMilliseconds(counter++ * delay),
SetInitialValueBeforeDelay = true
Delay = TimeSpan.FromMilliseconds(counter++ * delay)
});
}
}

54
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Activities/InvokeActionsActivity.bind Normal file
Просмотреть файл

@ -0,0 +1,54 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:interactions="using:Microsoft.Xaml.Interactions.Core"
xmlns:mediaactions="using:Microsoft.Xaml.Interactions.Media"
xmlns:ani="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Button Background="Gray" Width="200" Height="200" HorizontalAlignment="Center" VerticalAlignment="Center">
<ani:Explicit.Animations>
<ani:AnimationSet x:Name="MoveAnimation" IsSequential="True">
<ani:StartAnimationActivity Animation="{Binding ElementName=FadeOutAnimation}"/>
<ani:InvokeActionsActivity>
<interactions:ChangePropertyAction TargetObject="{Binding ElementName=MyText}" PropertyName="Foreground" Value="Purple"/>
<mediaactions:PlaySoundAction Source="Assets/Llama.mp3"/>
</ani:InvokeActionsActivity>
<ani:StartAnimationActivity Delay="0:0:2" Animation="{Binding ElementName=FadeInAnimation}"/>
</ani:AnimationSet>
</ani:Explicit.Animations>
<TextBlock x:Name="MyText" Text="🦙 Text">
<ani:Explicit.Animations>
<ani:AnimationSet x:Name="FadeOutAnimation">
<ani:OpacityAnimation From="1"
To="0"
Duration="0:0:1"
Delay="0"
EasingType="Linear"
EasingMode="EaseOut"/>
</ani:AnimationSet>
<ani:AnimationSet x:Name="FadeInAnimation">
<ani:OpacityAnimation From="0"
To="1"
Duration="0:0:1"
Delay="0"
EasingType="Linear"
EasingMode="EaseOut"/>
</ani:AnimationSet>
</ani:Explicit.Animations>
</TextBlock>
<interactivity:Interaction.Behaviors>
<interactions:EventTriggerBehavior EventName="Click">
<interactions:ChangePropertyAction TargetObject="{Binding ElementName=MyText}" PropertyName="Foreground" Value="White"/>
<behaviors:StartAnimationAction Animation="{Binding ElementName=MoveAnimation}"/>
</interactions:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</Page>

50
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Activities/StartAnimationActivity.bind Normal file
Просмотреть файл

@ -0,0 +1,50 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:interactions="using:Microsoft.Xaml.Interactions.Core"
xmlns:ani="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Button Background="Gray" Width="200" Height="200" HorizontalAlignment="Center" VerticalAlignment="Center">
<ani:Explicit.Animations>
<ani:AnimationSet x:Name="MoveAnimation" IsSequential="True">
<ani:TranslationAnimation Duration="0:0:3" To="0,32,0" From="0,0,0" />
<ani:StartAnimationActivity Delay="0:0:3" Animation="{Binding ElementName=FadeOutAnimation}"/>
<ani:StartAnimationActivity Delay="0:0:3" Animation="{Binding ElementName=FadeInAnimation}"/>
<ani:TranslationAnimation Duration="0:0:1" To="0,0,0" From="0,32,0" />
</ani:AnimationSet>
</ani:Explicit.Animations>
<Image Source="ms-appx:///Assets/ToolkitLogo.png" Height="100" Width="100">
<ani:Explicit.Animations>
<ani:AnimationSet x:Name="FadeOutAnimation">
<ani:OpacityAnimation From="1"
To="0"
Duration="0:0:1"
Delay="0"
EasingType="Linear"
EasingMode="EaseOut"/>
</ani:AnimationSet>
<ani:AnimationSet x:Name="FadeInAnimation">
<ani:OpacityAnimation From="0"
To="1"
Duration="0:0:1"
Delay="0"
EasingType="Linear"
EasingMode="EaseOut"/>
</ani:AnimationSet>
</ani:Explicit.Animations>
</Image>
<interactivity:Interaction.Behaviors>
<interactions:EventTriggerBehavior EventName="Click">
<behaviors:StartAnimationAction Animation="{Binding ElementName=MoveAnimation}"/>
</interactions:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</Page>

0
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Blur/BlurBehavior.png → Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/BlurBehavior.png
Просмотреть файл

Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 4.4 KiB

После

Ширина:  |  Высота:  |  Размер: 4.4 KiB

14
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/BlurBehaviorCode.bind Normal file
Просмотреть файл

@ -0,0 +1,14 @@
// XAML UIElement
<Image x:Name="ToolkitLogo" Source="ms-appx:///Assets/Square150x150Logo.png" Height="100" Width="100" >
// C# - Blur can be applied to any UIElement. In this case it is an image called ToolkitLogo.
using Microsoft.Toolkit.Uwp.UI.Animations;
// Create and attacha a sprite visual with an animatable blur effect
var sprite = await PipelineBuilder
.FromBackdrop()
.Blur(0, out EffectAnimation<float> blurAnimation)
.AttachAsync(ToolkitLogo, ToolkitLogo);
// Start the animation on the applied brush
blurAnimation(sprite.Brush, 32, TimeSpan.FromSeconds(3));

42
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/BlurBehaviorXaml.bind Normal file
Просмотреть файл

@ -0,0 +1,42 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:interactions="using:Microsoft.Xaml.Interactions.Core"
xmlns:ani="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Button Background="Gray" Width="200" Height="200" HorizontalAlignment="Center" VerticalAlignment="Center">
<media:UIElementExtensions.VisualFactory>
<media:PipelineVisualFactory>
<media:BlurEffect x:Name="ImageBlurEffect" IsAnimatable="True"/>
</media:PipelineVisualFactory>
</media:UIElementExtensions.VisualFactory>
<ani:Explicit.Animations>
<ani:AnimationSet x:Name="BlurAnimation">
<ani:BlurEffectAnimation From="0"
To="32"
Duration="0:0:3"
EasingType="Linear"
EasingMode="EaseOut"
Target="{Binding ElementName=ImageBlurEffect}"/>
</ani:AnimationSet>
</ani:Explicit.Animations>
<Image Source="ms-appx:///Assets/ToolkitLogo.png" Height="100" Width="100"/>
<interactivity:Interaction.Behaviors>
<interactions:EventTriggerBehavior EventName="Loaded">
<behaviors:StartAnimationAction Animation="{Binding ElementName=BlurAnimation}"/>
</interactions:EventTriggerBehavior>
<interactions:EventTriggerBehavior EventName="Click">
<behaviors:StartAnimationAction Animation="{Binding ElementName=BlurAnimation}"/>
</interactions:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</Page>

0
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Offset/OffsetBehavior.png → Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/OffsetBehavior.png
Просмотреть файл

Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 1.7 KiB

После

Ширина:  |  Высота:  |  Размер: 1.7 KiB

12
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/OffsetBehaviorCode.bind Normal file
Просмотреть файл

@ -0,0 +1,12 @@
// XAML UIElement
<Image x:Name="ToolkitLogo" Source="ms-appx:///Assets/Square150x150Logo.png" Height="100" Width="100" >
// C# - Offset can be applied to any UIElement. In this case it is an image called ToolkitLogo.
using Microsoft.Toolkit.Uwp.UI.Animations;
// Create and start the animation. Note that animating the offset will
// change how the item is also positioned within its parent item. If you
// want to animate the position of an element with respect to its original
// relative position to its parent, use a translation animation instead.
await AnimationBuilder.Create().Offset(to: new Vector2(20, 30), duration: TimeSpan.FromSeconds(3)).StartAsync(ToolkitLogo);

35
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/OffsetBehaviorXaml.bind Normal file
Просмотреть файл

@ -0,0 +1,35 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:interactions="using:Microsoft.Xaml.Interactions.Core"
xmlns:ani="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Button Background="Gray" Width="200" Height="200" VerticalAlignment="Top">
<ani:Explicit.Animations>
<ani:AnimationSet x:Name="OffsetAnimation">
<ani:OffsetAnimation From="0"
To="100,100,0"
Duration="0:0:3"
EasingType="Linear"
EasingMode="EaseOut"/>
</ani:AnimationSet>
</ani:Explicit.Animations>
<Image Source="ms-appx:///Assets/ToolkitLogo.png" Height="100" Width="100"/>
<interactivity:Interaction.Behaviors>
<interactions:EventTriggerBehavior EventName="Loaded">
<behaviors:StartAnimationAction Animation="{Binding ElementName=OffsetAnimation}"/>
</interactions:EventTriggerBehavior>
<interactions:EventTriggerBehavior EventName="Click">
<behaviors:StartAnimationAction Animation="{Binding ElementName=OffsetAnimation}"/>
</interactions:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</Page>

0
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Rotate/RotateBehavior.png → Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/RotateBehavior.png
Просмотреть файл

Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 1.7 KiB

После

Ширина:  |  Высота:  |  Размер: 1.7 KiB

5
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Rotate/RotateBehaviorCode.bind → Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/RotateBehaviorCode.bind
Просмотреть файл

@ -4,7 +4,4 @@
// C# - Rotate can be applied to any UIElement. In this case it is an image called ToolkitLogo.
using Microsoft.Toolkit.Uwp.UI.Animations;
await ToolkitLogo.Rotate(value: 90.0f,
centerX: 0.5f,
centerY: 0.0f,
duration: 10, delay: 0).StartAsync();
await AnimationBuilder.Create().RotationInDegrees(to: 90, duration: TimeSpan.FromSeconds(3)).StartAsync(ToolkitLogo);

41
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/RotateBehaviorXaml.bind Normal file
Просмотреть файл

@ -0,0 +1,41 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:interactions="using:Microsoft.Xaml.Interactions.Core"
xmlns:ani="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:ex="using:Microsoft.Toolkit.Uwp.UI.Extensions"
mc:Ignorable="d">
<Button Background="Gray"
Width="200"
Height="200"
HorizontalAlignment="Center"
VerticalAlignment="Center"
ex:VisualExtensions.NormalizedCenterPoint="0.5">
<ani:Explicit.Animations>
<ani:AnimationSet x:Name="RotateAnimation">
<ani:RotationInDegreesAnimation From="0"
To="360"
Duration="0:0:3"
EasingType="Linear"
EasingMode="EaseOut"/>
</ani:AnimationSet>
</ani:Explicit.Animations>
<Image Source="ms-appx:///Assets/ToolkitLogo.png" Height="100" Width="100"/>
<interactivity:Interaction.Behaviors>
<interactions:EventTriggerBehavior EventName="Loaded">
<behaviors:StartAnimationAction Animation="{Binding ElementName=RotateAnimation}"/>
</interactions:EventTriggerBehavior>
<interactions:EventTriggerBehavior EventName="Click">
<behaviors:StartAnimationAction Animation="{Binding ElementName=RotateAnimation}"/>
</interactions:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</Page>

0
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Saturation/SaturationBehavior.png → Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/SaturationBehavior.png
Просмотреть файл

Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 2.6 KiB

После

Ширина:  |  Высота:  |  Размер: 2.6 KiB

14
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/SaturationBehaviorCode.bind Normal file
Просмотреть файл

@ -0,0 +1,14 @@
// XAML UIElement
<Image x:Name="ToolkitLogo" Source="ms-appx:///Assets/Square150x150Logo.png" Height="100" Width="100" >
// C# - Saturation can be applied to any UIElement. In this case it is an image called ToolkitLogo.
using Microsoft.Toolkit.Uwp.UI.Animations;
// Create and attacha a sprite visual with an animatable blur effect
var sprite = await PipelineBuilder
.FromBackdrop()
.Saturation(0, out EffectAnimation<float> saturationAnimation)
.AttachAsync(ToolkitLogo, ToolkitLogo);
// Start the animation on the applied brush
saturationAnimation(sprite.Brush, 1, TimeSpan.FromSeconds(3));

42
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/SaturationBehaviorXaml.bind Normal file
Просмотреть файл

@ -0,0 +1,42 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:interactions="using:Microsoft.Xaml.Interactions.Core"
xmlns:ani="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Button Padding="0" Background="Gray" Width="200" Height="200" HorizontalAlignment="Center" VerticalAlignment="Center">
<media:UIElementExtensions.VisualFactory>
<media:PipelineVisualFactory>
<media:SaturationEffect x:Name="ImageSaturationEffect" Value="1" IsAnimatable="True"/>
</media:PipelineVisualFactory>
</media:UIElementExtensions.VisualFactory>
<ani:Explicit.Animations>
<ani:AnimationSet x:Name="SaturationAnimation">
<ani:SaturationEffectAnimation From="0"
To="1"
Duration="0:0:3"
EasingType="Linear"
EasingMode="EaseOut"
Target="{Binding ElementName=ImageSaturationEffect}"/>
</ani:AnimationSet>
</ani:Explicit.Animations>
<Image Source="ms-appx:///Assets/Photos/BigFourSummerHeat.jpg" />
<interactivity:Interaction.Behaviors>
<interactions:EventTriggerBehavior EventName="Loaded">
<behaviors:StartAnimationAction Animation="{Binding ElementName=SaturationAnimation}"/>
</interactions:EventTriggerBehavior>
<interactions:EventTriggerBehavior EventName="Click">
<behaviors:StartAnimationAction Animation="{Binding ElementName=SaturationAnimation}"/>
</interactions:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</Page>

0
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Scale/ScaleBehavior.png → Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/ScaleBehavior.png
Просмотреть файл

Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 1.2 KiB

После

Ширина:  |  Высота:  |  Размер: 1.2 KiB

6
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Scale/ScaleBehaviorCode.bind → Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/ScaleBehaviorCode.bind
Просмотреть файл

@ -4,8 +4,4 @@
// C# - Scale can be applied to any UIElement. In this case it is an image called ToolkitLogo.
using Microsoft.Toolkit.Uwp.UI.Animations;
await ToolkitLogo.Scale(centerX: 0.5f,
centerY: 0.0f,
scaleX: 2.0f,
scaleY: 0.1f,
duration: 10, delay: 0).StartAsync();
await AnimationBuilder.Create().Scale(to: new Vector2(1.4f), duration: TimeSpan.FromSeconds(3)).StartAsync(ToolkitLogo);

41
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Behaviors/ScaleBehaviorXaml.bind Normal file
Просмотреть файл

@ -0,0 +1,41 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:interactions="using:Microsoft.Xaml.Interactions.Core"
xmlns:ani="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:ex="using:Microsoft.Toolkit.Uwp.UI.Extensions"
mc:Ignorable="d">
<Button Background="Gray"
Width="200"
Height="200"
HorizontalAlignment="Center"
VerticalAlignment="Center"
ex:VisualExtensions.NormalizedCenterPoint="0.5">
<ani:Explicit.Animations>
<ani:AnimationSet x:Name="ScaleAnimation">
<ani:ScaleAnimation From="1"
To="1.4"
Duration="0:0:3"
EasingType="Linear"
EasingMode="EaseOut"/>
</ani:AnimationSet>
</ani:Explicit.Animations>
<Image Source="ms-appx:///Assets/ToolkitLogo.png" Height="100" Width="100"/>
<interactivity:Interaction.Behaviors>
<interactions:EventTriggerBehavior EventName="Loaded">
<behaviors:StartAnimationAction Animation="{Binding ElementName=ScaleAnimation}"/>
</interactions:EventTriggerBehavior>
<interactions:EventTriggerBehavior EventName="Click">
<behaviors:StartAnimationAction Animation="{Binding ElementName=ScaleAnimation}"/>
</interactions:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</Page>

60
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Effects/EffectAnimations.bind Normal file
Просмотреть файл

@ -0,0 +1,60 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:extensions="using:Microsoft.Toolkit.Uwp.UI.Extensions"
xmlns:animations="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
xmlns:Interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:Interactions="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid>
<Image Source="/Assets/Photos/SpeedTripleAtristsPoint.jpg" Stretch="UniformToFill"/>
<TextBlock
Text="THIS IS SAMPLE TEXT"
FontSize="52"
FontWeight="Bold"
TextWrapping="Wrap"
VerticalAlignment="Center"
HorizontalAlignment="Center"/>
<media:UIElementExtensions.VisualFactory>
<media:PipelineVisualFactory>
<media:LuminanceToAlphaEffect/>
<media:OpacityEffect Value="0.4"/>
<media:BlendEffect Mode="Multiply" Source="{media:BackdropSource}"/>
<media:BlurEffect x:Name="ImageBlurEffect" Amount="32" IsAnimatable="True"/>
<media:SaturationEffect x:Name="ImageSaturationEffect" Value="0" IsAnimatable="True"/>
<media:ExposureEffect x:Name="ImageExposureEffect" Amount="1" IsAnimatable="True"/>
</media:PipelineVisualFactory>
</media:UIElementExtensions.VisualFactory>
<animations:Explicit.Animations>
<animations:AnimationSet x:Name="ClipAnimation">
<animations:AnimationScope Duration="0:0:3" EasingMode="EaseOut">
<animations:ClipAnimation From="0,0,1280,0" To="0"/>
<animations:TranslationAnimation From="32,0,0" To="0"/>
<animations:ScaleAnimation From="1.1" To="1"/>
<animations:BlurEffectAnimation From="32" To="0" Target="{Binding ElementName=ImageBlurEffect}"/>
<animations:SaturationEffectAnimation From="0" To="1.2" Target="{Binding ElementName=ImageSaturationEffect}"/>
<animations:ExposureEffectAnimation From="1" To="0" Target="{Binding ElementName=ImageExposureEffect}"/>
</animations:AnimationScope>
</animations:AnimationSet>
</animations:Explicit.Animations>
</Grid>
<Button Content="Start animation" Grid.Row="1">
<Interactivity:Interaction.Behaviors>
<Interactions:EventTriggerBehavior EventName="Click">
<behaviors:StartAnimationAction Animation="{Binding ElementName=ClipAnimation}" />
</Interactions:EventTriggerBehavior>
</Interactivity:Interaction.Behaviors>
</Button>
</Grid>
</Page>

0
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Fade/FadeBehavior.png → Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Effects/FadeBehavior.png
Просмотреть файл

Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 4.4 KiB

После

Ширина:  |  Высота:  |  Размер: 4.4 KiB

3
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Fade/FadeBehaviorCode.bind → Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Effects/FadeBehaviorCode.bind
Просмотреть файл

@ -4,5 +4,6 @@
// C# - Fade can be applied to any UIElement. In this case it is an image called ToolkitLogo.
using Microsoft.Toolkit.Uwp.UI.Animations;
await ToolkitLogo.Fade(value: 0.5f, duration: 10, delay: 0).StartAsync();
// Create and start the animation
await AnimationBuilder.Create().Opacity(to: 0.5, duration: TimeSpan.FromSeconds(3)).StartAsync(ToolkitLogo);

36
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Effects/FadeBehaviorXaml.bind Normal file
Просмотреть файл

@ -0,0 +1,36 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:interactions="using:Microsoft.Xaml.Interactions.Core"
xmlns:ani="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Button Background="Gray" Width="200" Height="200" HorizontalAlignment="Center" VerticalAlignment="Center">
<Image Source="ms-appx:///Assets/ToolkitLogo.png" Height="100" Width="100">
<ani:Explicit.Animations>
<ani:AnimationSet x:Name="FadeAnimation">
<ani:OpacityAnimation From="1"
To="0"
Duration="0:0:3"
Delay="0"
EasingType="Linear"
EasingMode="EaseOut"/>
</ani:AnimationSet>
</ani:Explicit.Animations>
</Image>
<interactivity:Interaction.Behaviors>
<interactions:EventTriggerBehavior EventName="Loaded">
<behaviors:StartAnimationAction Animation="{Binding ElementName=FadeAnimation}"/>
</interactions:EventTriggerBehavior>
<interactions:EventTriggerBehavior EventName="Click">
<behaviors:StartAnimationAction Animation="{Binding ElementName=FadeAnimation}"/>
</interactions:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</Page>

8
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Blur/BlurBehaviorCode.bind
Просмотреть файл

@ -1,8 +0,0 @@
// XAML UIElement
<Image x:Name="ToolkitLogo" Source="ms-appx:///Assets/Square150x150Logo.png" Height="100" Width="100" >
// C# - Blur can be applied to any UIElement. In this case it is an image called ToolkitLogo.
using Microsoft.Toolkit.Uwp.UI.Animations;
await ToolkitLogo.Blur(value: 10, duration: 10, delay: 0).StartAsync();

57
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Blur/BlurBehaviorPage.xaml
Просмотреть файл

@ -1,57 +0,0 @@
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.BlurBehaviorPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:media="using:Microsoft.Xaml.Interactions.Media"
mc:Ignorable="d">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition />
</Grid.RowDefinitions>
<Grid x:Name="XamlRoot" Grid.Row="1" />
<!-- Shadow Copy for Access -->
<Grid Visibility="Collapsed">
<Image>
<interactivity:Interaction.Behaviors>
<behaviors:Blur />
</interactivity:Interaction.Behaviors>
</Image>
<StackPanel>
<Button>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:CallMethodAction />
</core:EventTriggerBehavior>
<core:EventTriggerBehavior EventName="">
<core:ChangePropertyAction />
</core:EventTriggerBehavior>
<core:EventTriggerBehavior EventName="">
<core:GoToStateAction />
</core:EventTriggerBehavior>
<core:EventTriggerBehavior EventName="">
<core:InvokeCommandAction />
</core:EventTriggerBehavior>
<core:EventTriggerBehavior EventName="">
<core:NavigateToPageAction />
</core:EventTriggerBehavior>
<core:EventTriggerBehavior EventName="">
<media:ControlStoryboardAction />
</core:EventTriggerBehavior>
<core:EventTriggerBehavior EventName="">
<media:PlaySoundAction />
</core:EventTriggerBehavior>
<core:DataTriggerBehavior />
</interactivity:Interaction.Behaviors>
</Button>
</StackPanel>
</Grid>
</Grid>
</Page>

43
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Blur/BlurBehaviorPage.xaml.cs
Просмотреть файл

@ -1,43 +0,0 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System.Linq;
using Microsoft.Toolkit.Uwp.UI.Animations;
using Microsoft.Toolkit.Uwp.UI.Animations.Behaviors;
using Microsoft.Toolkit.Uwp.UI.Extensions;
using Microsoft.Xaml.Interactivity;
using Windows.UI.Xaml;
namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
{
/// <summary>
/// A page that shows how to use the blur behavior.
/// </summary>
public sealed partial class BlurBehaviorPage : IXamlRenderListener
{
private Blur _blurBehavior;
/// <summary>
/// Initializes a new instance of the <see cref="BlurBehaviorPage"/> class.
/// </summary>
public BlurBehaviorPage()
{
InitializeComponent();
SampleController.Current.RegisterNewCommand("Apply", (s, e) =>
{
_blurBehavior?.StartAnimation();
});
}
public void OnXamlRendered(FrameworkElement control)
{
if (control.FindChildByName("EffectElement") is FrameworkElement element)
{
var behaviors = Interaction.GetBehaviors(element);
_blurBehavior = behaviors.FirstOrDefault(item => item is Blur) as Blur;
}
}
}
}

26
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Blur/BlurBehaviorXaml.bind
Просмотреть файл

@ -1,26 +0,0 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Microsoft.Toolkit.Uwp.SampleApp.SamplePages.OffsetBehavior"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Grid>
<Border Background="Gray" Width="200" Height="200" x:Name="EffectElement">
<Image x:Name="ToolkitLogo" Source="ms-appx:///Assets/ToolkitLogo.png" Height="100" Width="100" />
<interactivity:Interaction.Behaviors>
<behaviors:Blur x:Name="BlurBehavior"
Value="@[Value:DoubleSlider:1.0:0.0-10.0]"
Duration="@[Duration:DoubleSlider:3000.0:0.0-10000.0]"
Delay="@[Delay:DoubleSlider:0.0:0.0-5000.0]"
EasingType="@[EasingType:Enum:EasingType.Linear]"
EasingMode="@[EasingMode:Enum:EasingMode.EaseOut]"
AutomaticallyStart="@[AutomaticallyStart:Bool:True]"/>
</interactivity:Interaction.Behaviors>
</Border>
</Grid>
</Page>

29
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Fade/FadeBehaviorPage.xaml
Просмотреть файл

@ -1,29 +0,0 @@
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.FadeBehaviorPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<!-- Shallow Copy -->
<Grid>
<Image>
<interactivity:Interaction.Behaviors>
<behaviors:Fade />
</interactivity:Interaction.Behaviors>
</Image>
<StackPanel>
<Button>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:CallMethodAction />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</StackPanel>
</Grid>
</Page>

43
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Fade/FadeBehaviorPage.xaml.cs
Просмотреть файл

@ -1,43 +0,0 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System.Linq;
using Microsoft.Toolkit.Uwp.UI.Animations.Behaviors;
using Microsoft.Toolkit.Uwp.UI.Extensions;
using Microsoft.Xaml.Interactivity;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
{
/// <summary>
/// A page that shows how to use the opacity behavior.
/// </summary>
public sealed partial class FadeBehaviorPage : Page, IXamlRenderListener
{
private Fade _fadeBehavior;
/// <summary>
/// Initializes a new instance of the <see cref="FadeBehaviorPage"/> class.
/// </summary>
public FadeBehaviorPage()
{
InitializeComponent();
SampleController.Current.RegisterNewCommand("Apply", (s, e) =>
{
_fadeBehavior?.StartAnimation();
});
}
public void OnXamlRendered(FrameworkElement control)
{
if (control.FindChildByName("EffectElement") is FrameworkElement element)
{
var behaviors = Interaction.GetBehaviors(element);
_fadeBehavior = behaviors.FirstOrDefault(item => item is Fade) as Fade;
}
}
}
}

25
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Fade/FadeBehaviorXaml.bind
Просмотреть файл

@ -1,25 +0,0 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Grid>
<Border Background="Gray" Width="200" Height="200">
<Image x:Name="EffectElement" Source="ms-appx:///Assets/ToolkitLogo.png" Height="100" Width="100">
<interactivity:Interaction.Behaviors>
<behaviors:Fade x:Name="Fade"
Value="@[Value:DoubleSlider:0.0:0.0-1.0]"
Duration="@[Duration:DoubleSlider:1000.0:0.0-5000.0]"
Delay="@[Delay:DoubleSlider:0.0:0.0-5000.0]"
EasingType="@[EasingType:Enum:EasingType.Linear]"
EasingMode="@[EasingMode:Enum:EasingMode.EaseOut]"
AutomaticallyStart="@[AutomaticallyStart:Bool:True]"/>
</interactivity:Interaction.Behaviors>
</Image>
</Border>
</Grid>
</Page>

10
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/FadeHeader/FadeHeaderBehaviorPage.xaml
Просмотреть файл

@ -7,12 +7,6 @@
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<!-- Shallow Copy -->
<Grid>
<ListView>
<interactivity:Interaction.Behaviors>
<behaviors:FadeHeaderBehavior />
</interactivity:Interaction.Behaviors>
</ListView>
</Grid>
<!-- Shallow Copy -->
<Grid />
</Page>

4
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/FadeHeader/FadeHeaderBehaviorXaml.bind
Просмотреть файл

@ -3,7 +3,7 @@
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
mc:Ignorable="d">
<Grid>
<ListView x:Name="MyListView">
@ -24,7 +24,7 @@
Margin="12" />
<TextBlock Text="It starts with 100% opacity but will fade to 0% as you scroll up."
Foreground="White"
Margin="12,0,12,12"
Margin="12,0,12,12"
VerticalAlignment="Center"
TextAlignment="Center" />
</StackPanel>

4
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/IconExtensions/IconExtensionsPage.xaml.cs
Просмотреть файл

@ -2,10 +2,6 @@
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System.Linq;
using Microsoft.Toolkit.Uwp.UI.Animations.Behaviors;
using Microsoft.Toolkit.Uwp.UI.Extensions;
using Microsoft.Xaml.Interactivity;
using Windows.UI.Xaml;
namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages

20
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Implicit Animations/ImplicitAnimationsCode.bind
Просмотреть файл

@ -19,24 +19,24 @@
extensions:VisualExtensions.CenterPoint="50,50,0">
<animations:Implicit.ShowAnimations>
<animations:TranslationAnimation Duration="0:0:1" From="0, -200, 0" To="0" ></animations:TranslationAnimation>
<animations:OpacityAnimation Duration="0:0:1" From="0" To="1.0"></animations:OpacityAnimation>
<animations:TranslationAnimation Duration="0:0:1" From="0, -200, 0" To="0"/>
<animations:OpacityAnimation Duration="0:0:1" From="0" To="1.0"/>
</animations:Implicit.ShowAnimations>
<animations:Implicit.HideAnimations>
<animations:ScalarAnimation Target="Opacity" Duration="0:0:1" To="0.0"></animations:ScalarAnimation>
<animations:OpacityAnimation Duration="0:0:1" To="0.0"/>
<animations:ScalarAnimation Target="Translation.Y" Duration="0:0:1" To="-200">
<animations:ScalarKeyFrame Key="0.1" Value="30"></animations:ScalarKeyFrame>
<animations:ScalarKeyFrame Key="0.5" Value="0.0"></animations:ScalarKeyFrame>
<animations:ScalarKeyFrame Key="0.1" Value="30"/>
<animations:ScalarKeyFrame Key="0.5" Value="0.0"/>
</animations:ScalarAnimation>
</animations:Implicit.HideAnimations>
<animations:Implicit.Animations>
<animations:Vector3Animation Target="Offset" Duration="0:0:1"></animations:Vector3Animation>
<animations:ScalarAnimation Target="RotationAngleInDegrees" ImplicitTarget="Offset" Duration="0:0:1.2" From="0" To="0">
<animations:ScalarKeyFrame Key="0.9" Value="80"></animations:ScalarKeyFrame>
</animations:ScalarAnimation>
<animations:Vector3Animation Target="Scale" Duration="0:0:1"></animations:Vector3Animation>
<animations:OffsetAnimation Duration="0:0:1"/>
<animations:RotationInDegreesAnimation ImplicitTarget="Offset" Duration="0:0:1.2" From="0" To="0">
<animations:ScalarKeyFrame Key="0.9" Value="80"/>
</animations:RotationInDegreesAnimation>
<animations:ScaleAnimation Duration="0:0:1"/>
</animations:Implicit.Animations>
</Border>

43
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Implicit Animations/ImplicitAnimationsPage.xaml
Просмотреть файл

@ -7,29 +7,36 @@
xmlns:extensions="using:Microsoft.Toolkit.Uwp.UI.Extensions"
xmlns:animations="using:Microsoft.Toolkit.Uwp.UI.Animations"
mc:Ignorable="d">
<Page.Resources>
<animations:ImplicitAnimationSet x:Name="TestAnimations">
<animations:OpacityAnimation/>
<animations:RotationAnimation/>
<animations:RotationInDegreesAnimation/>
<animations:OffsetAnimation/>
<animations:ScaleAnimation/>
<animations:ScalarAnimation>
<animations:ScalarKeyFrame/>
</animations:ScalarAnimation>
<animations:Vector2Animation>
<animations:Vector2KeyFrame/>
</animations:Vector2Animation>
<animations:Vector3Animation>
<animations:Vector3KeyFrame/>
</animations:Vector3Animation>
<animations:Vector4Animation>
<animations:Vector4KeyFrame/>
</animations:Vector4Animation>
<animations:QuaternionAnimation>
<animations:QuaternionKeyFrame/>
</animations:QuaternionAnimation>
</animations:ImplicitAnimationSet>
</Page.Resources>
<!-- Need to have an placeholder of each element so they can be used in the XAML editor -->
<Grid extensions:VisualExtensions.CenterPoint="50,50,0">
<animations:Implicit.ShowAnimations>
<animations:TranslationAnimation></animations:TranslationAnimation>
<animations:OpacityAnimation></animations:OpacityAnimation>
<animations:RotationAnimation></animations:RotationAnimation>
<animations:RotationInDegreesAnimation></animations:RotationInDegreesAnimation>
<animations:OffsetAnimation></animations:OffsetAnimation>
<animations:ScalarAnimation></animations:ScalarAnimation>
<animations:ScaleAnimation></animations:ScaleAnimation>
<animations:Vector2Animation>
<animations:KeyFrameCollection>
<animations:Vector2KeyFrame></animations:Vector2KeyFrame>
<animations:Vector3KeyFrame></animations:Vector3KeyFrame>
<animations:Vector4KeyFrame></animations:Vector4KeyFrame>
<animations:ExpressionKeyFrame></animations:ExpressionKeyFrame>
<animations:ScalarKeyFrame></animations:ScalarKeyFrame>
</animations:KeyFrameCollection>
</animations:Vector2Animation>
<animations:Vector3Animation></animations:Vector3Animation>
<animations:Vector4Animation></animations:Vector4Animation>
<animations:OpacityAnimation From="0" To="1"/>
</animations:Implicit.ShowAnimations>
</Grid>
</Page>

2
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ReorderGridAnimation/ReorderGrid.bind → Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ItemsReorderAnimation/ItemsReorderAnimation.bind
Просмотреть файл

@ -9,7 +9,7 @@
<Grid>
<GridView x:Name="ImageView"
animations:ReorderGridAnimation.Duration="@[Duration:Slider:300:100-1000]">
animations:ItemsReorderAnimation.Duration="@[Duration:TimeSpan:400:0-800]">
<GridView.ItemTemplate>
<DataTemplate>
<Image Width="200"

0
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ReorderGridAnimation/ReorderGrid.png → Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ItemsReorderAnimation/ItemsReorderAnimation.png
Просмотреть файл

Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 3.3 KiB

После

Ширина:  |  Высота:  |  Размер: 3.3 KiB

4
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ReorderGridAnimation/ReorderGridPage.xaml → Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ItemsReorderAnimation/ItemsReorderAnimationPage.xaml
Просмотреть файл

@ -1,4 +1,4 @@
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.ReorderGridPage"
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.ItemsReorderAnimationPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:animations="using:Microsoft.Toolkit.Uwp.UI.Animations"
@ -8,7 +8,7 @@
<!-- Shallow Copy -->
<Grid>
<GridView animations:ReorderGridAnimation.Duration="{Binding Duration.Value}">
<GridView animations:ItemsReorderAnimation.Duration="{Binding Duration.Value}">
</GridView>
</Grid>
</Page>

4
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ReorderGridAnimation/ReorderGridPage.xaml.cs → Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ItemsReorderAnimation/ItemsReorderAnimationPage.xaml.cs
Просмотреть файл

@ -8,11 +8,11 @@ using Windows.UI.Xaml.Controls;
namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
{
public sealed partial class ReorderGridPage : Page, IXamlRenderListener
public sealed partial class ItemsReorderAnimationPage : Page, IXamlRenderListener
{
private GridView imageView;
public ReorderGridPage()
public ItemsReorderAnimationPage()
{
InitializeComponent();
}

Двоичные данные
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Light/LightBehavior.png
Просмотреть файл

Двоичный файл не отображается.
Режим "рядом"

До

Ширина:  |  Высота:  |  Размер: 6.0 KiB

8
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Light/LightBehaviorCode.bind
Просмотреть файл

@ -1,8 +0,0 @@
// XAML UIElement
<Image x:Name="ToolkitLogo" Source="ms-appx:///Assets/Square150x150Logo.png" Height="100" Width="100" >
// C# - Light can be applied to any UIElement. In this case it is an image called ToolkitLogo.
using Microsoft.Toolkit.Uwp.UI.Animations;
var lightAnimationSet = ToolkitLogo.Light(distance: 10, duration: 500, delay: 0, color: Colors.Red);
await lightAnimationSet.StartAsync();

31
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Light/LightBehaviorPage.xaml
Просмотреть файл

@ -1,31 +0,0 @@
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.LightBehaviorPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid>
<Grid x:Name="XamlRoot"/>
<!-- Shallow Copy -->
<Image>
<interactivity:Interaction.Behaviors>
<behaviors:Light Color="Red" />
</interactivity:Interaction.Behaviors>
</Image>
<StackPanel Visibility="Collapsed">
<Button>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:CallMethodAction />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</StackPanel>
</Grid>
</Page>

47
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Light/LightBehaviorPage.xaml.cs
Просмотреть файл

@ -1,47 +0,0 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System.Linq;
using Microsoft.Toolkit.Uwp.UI.Animations;
using Microsoft.Toolkit.Uwp.UI.Animations.Behaviors;
using Microsoft.Toolkit.Uwp.UI.Extensions;
using Microsoft.Xaml.Interactivity;
using Windows.UI.Xaml;
namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
{
/// <summary>
/// A page that shows how to use the light behavior.
/// </summary>
public sealed partial class LightBehaviorPage : IXamlRenderListener
{
#pragma warning disable CS0618 // Type or member is obsolete
private Light _lightBehavior;
#pragma warning restore CS0618 // Type or member is obsolete
/// <summary>
/// Initializes a new instance of the <see cref="LightBehaviorPage"/> class.
/// </summary>
public LightBehaviorPage()
{
this.InitializeComponent();
SampleController.Current.RegisterNewCommand("Apply", (s, e) =>
{
_lightBehavior?.StartAnimation();
});
}
public void OnXamlRendered(FrameworkElement control)
{
if (control.FindChildByName("EffectElement") is FrameworkElement element)
{
var behaviors = Interaction.GetBehaviors(element);
#pragma warning disable CS0618 // Type or member is obsolete
_lightBehavior = behaviors.FirstOrDefault(item => item is Light) as Light;
#pragma warning restore CS0618 // Type or member is obsolete
}
}
}
}

25
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Light/LightBehaviorXaml.bind
Просмотреть файл

@ -1,25 +0,0 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Grid>
<Image x:Name="EffectElement" Source="ms-appx:///Assets/ToolkitLogo.png" Height="100" Width="100">
<interactivity:Interaction.Behaviors>
<behaviors:Light x:Name="LightBehavior"
Distance="@[Distance:DoubleSlider:10.0:0.1-50.0]"
Duration="@[Duration:DoubleSlider:500.0:0.0-10000.0]"
Delay="@[Delay:DoubleSlider:0.0:0.0-5000.0]"
AutomaticallyStart="@[AutomaticallyStart:Bool:True]"
EasingType="@[EasingType:Enum:EasingType.Linear]"
EasingMode="@[EasingMode:Enum:EasingMode.EaseOut]"
Color="@[Color:Brush:Red]" />
</interactivity:Interaction.Behaviors>
</Image>
</Grid>
</Page>

12
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/LoginButton/LoginButtonPage.xaml
Просмотреть файл

@ -1,19 +1,19 @@
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.LoginButtonPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:Interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:Interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:wgt="using:Microsoft.Toolkit.Graph.Controls"
xmlns:providers="using:Microsoft.Toolkit.Graph.Providers"
xmlns:wgt="using:Microsoft.Toolkit.Graph.Controls"
mc:Ignorable="d">
<Interactivity:Interaction.Behaviors>
<providers:MockProviderBehavior SignedIn="False"/>
<!--<providers:MockProviderBehavior SignedIn="False"/>-->
</Interactivity:Interaction.Behaviors>
<!-- Shallow Copy -->
<!-- Shallow Copy -->
<Grid>
<wgt:LoginButton/>
<!--<wgt:LoginButton />-->
</Grid>
</Page>

10
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Offset/OffsetBehaviorCode.bind
Просмотреть файл

@ -1,10 +0,0 @@
// XAML UIElement
<Image x:Name="ToolkitLogo" Source="ms-appx:///Assets/Square150x150Logo.png" Height="100" Width="100" >
// C# - Offset can be applied to any UIElement. In this case it is an image called ToolkitLogo.
using Microsoft.Toolkit.Uwp.UI.Animations;
await ToolkitLogo.Offset(offsetX: 1.0f,
offsetY: 1.1f,
duration: 10, delay: 0).StartAsync();

28
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Offset/OffsetBehaviorPage.xaml
Просмотреть файл

@ -1,28 +0,0 @@
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.OffsetBehaviorPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<!-- Shallow Copy -->
<Grid Visibility="Collapsed">
<Image>
<interactivity:Interaction.Behaviors>
<behaviors:Offset />
</interactivity:Interaction.Behaviors>
</Image>
<StackPanel>
<Button>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:CallMethodAction />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</StackPanel>
</Grid>
</Page>

42
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Offset/OffsetBehaviorPage.xaml.cs
Просмотреть файл

@ -1,42 +0,0 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System.Linq;
using Microsoft.Toolkit.Uwp.UI.Animations.Behaviors;
using Microsoft.Toolkit.Uwp.UI.Extensions;
using Microsoft.Xaml.Interactivity;
using Windows.UI.Xaml;
namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
{
/// <summary>
/// A page that shows how to use the offset behavior.
/// </summary>
public sealed partial class OffsetBehaviorPage : IXamlRenderListener
{
private Offset _offsetBehavior;
/// <summary>
/// Initializes a new instance of the <see cref="OffsetBehaviorPage"/> class.
/// </summary>
public OffsetBehaviorPage()
{
InitializeComponent();
SampleController.Current.RegisterNewCommand("Apply", (s, e) =>
{
_offsetBehavior?.StartAnimation();
});
}
public void OnXamlRendered(FrameworkElement control)
{
if (control.FindChildByName("EffectElement") is FrameworkElement element)
{
var behaviors = Interaction.GetBehaviors(element);
_offsetBehavior = behaviors.FirstOrDefault(item => item is Offset) as Offset;
}
}
}
}

28
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Offset/OffsetBehaviorXaml.bind
Просмотреть файл

@ -1,28 +0,0 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Microsoft.Toolkit.Uwp.SampleApp.SamplePages.OffsetBehavior"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Grid>
<Border Background="Gray" Width="200" Height="200">
<Image x:Name="EffectElement" Source="ms-appx:///Assets/ToolkitLogo.png" Height="100" Width="100">
<interactivity:Interaction.Behaviors>
<behaviors:Offset x:Name="Offset"
OffsetX="@[OffsetX:DoubleSlider:0.0:0.0-500.0]"
OffsetY="@[OffsetY:DoubleSlider:0.0:0.0-500.0]"
Duration="@[Duration:DoubleSlider:1000:0-5000]"
Delay="@[Delay:DoubleSlider:0:0-5000]"
EasingType="@[EasingType:Enum:EasingType.Linear]"
EasingMode="@[EasingMode:Enum:EasingMode.EaseOut]"
AutomaticallyStart="@[AutomaticallyStart:Bool:True]"/>
</interactivity:Interaction.Behaviors>
</Image>
</Border>
</Grid>
</Page>

4
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/OnDevice/OnDevicePage.xaml.cs
Просмотреть файл

@ -2,10 +2,6 @@
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System.Linq;
using Microsoft.Toolkit.Uwp.UI.Animations.Behaviors;
using Microsoft.Toolkit.Uwp.UI.Extensions;
using Microsoft.Xaml.Interactivity;
using Windows.UI.Xaml;
namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages

8
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/PeoplePicker/PeoplePickerPage.xaml
Просмотреть файл

@ -7,10 +7,12 @@
xmlns:wgt="using:Microsoft.Toolkit.Graph.Controls"
mc:Ignorable="d">
<Page.Resources>
<converters:EmptyObjectToObjectConverter x:Key="NullToVisibilityConverter" EmptyValue="Collapsed" NotEmptyValue="Visible"/>
<converters:EmptyObjectToObjectConverter x:Key="NullToVisibilityConverter"
EmptyValue="Collapsed"
NotEmptyValue="Visible" />
</Page.Resources>
<!-- Shallow Copy -->
<!-- Shallow Copy -->
<Grid>
<wgt:PeoplePicker/>
<!--<wgt:PeoplePicker/>-->
</Grid>
</Page>

4
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/PersonView/PersonViewPage.xaml
Просмотреть файл

@ -5,8 +5,8 @@
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:wgt="using:Microsoft.Toolkit.Graph.Controls"
mc:Ignorable="d">
<!-- Shallow Copy -->
<!-- Shallow Copy -->
<Grid>
<wgt:PersonView/>
<!--<wgt:PersonView/>-->
</Grid>
</Page>

73
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/PipelineBrush/PipelineBrushPage.xaml
Просмотреть файл

@ -1,57 +1,60 @@
<Page
x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.PipelineBrushPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
xmlns:effects="using:Microsoft.Toolkit.Uwp.UI.Media.Effects"
mc:Ignorable="d">
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.PipelineBrushPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
mc:Ignorable="d">
<!--Shallow copy-->
<!-- Shallow copy -->
<Grid>
<Image Source="ms-appx:///Assets/Photos/BigFourSummerHeat.jpg"/>
<Image Source="ms-appx:///Assets/Photos/BigFourSummerHeat.jpg" />
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<ProgressRing IsActive="True" Grid.ColumnSpan="2"
VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="Red" Width="200" Height="200"/>
<ProgressRing Grid.ColumnSpan="2"
Width="200"
Height="200"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Foreground="Red"
IsActive="True" />
<Border>
<Border.Background>
<media:PipelineBrush Source="{effects:AcrylicSource}">
<effects:BlendEffect Source="{effects:BackdropSource BackgroundSource=Backdrop}"/>
<effects:BlurEffect/>
<effects:ExposureEffect/>
<effects:GrayscaleEffect/>
<effects:HueRotationEffect/>
<effects:CrossFadeEffect/>
<media:PipelineBrush Source="{media:AcrylicSource}">
<media:BlendEffect Source="{media:BackdropSource BackgroundSource=Backdrop}" />
<media:BlurEffect />
<media:ExposureEffect />
<media:GrayscaleEffect />
<media:HueRotationEffect />
<media:CrossFadeEffect />
</media:PipelineBrush>
</Border.Background>
</Border>
<Border>
<Border.Background>
<media:PipelineBrush Source="{effects:AcrylicSource}">
<effects:HueRotationEffect/>
<effects:BlendEffect Source="{effects:ImageSource Uri=ms-appx:///Assets/BrushAssets/NoiseTexture.png}"/>
<effects:InvertEffect/>
<effects:LuminanceToAlphaEffect/>
<effects:OpacityEffect/>
<effects:SaturationEffect/>
<effects:SepiaEffect/>
<media:PipelineBrush Source="{media:AcrylicSource}">
<media:HueRotationEffect />
<media:BlendEffect Source="{media:ImageSource Uri=ms-appx:///Assets/BrushAssets/NoiseTexture.png}" />
<media:InvertEffect />
<media:LuminanceToAlphaEffect />
<media:OpacityEffect />
<media:SaturationEffect />
<media:SepiaEffect />
</media:PipelineBrush>
</Border.Background>
</Border>
<Border>
<Border.Background>
<media:PipelineBrush Source="{effects:AcrylicSource}">
<effects:SepiaEffect/>
<effects:ShadeEffect/>
<effects:BlendEffect Source="{effects:SolidColorSource}"/>
<effects:TemperatureAndTintEffect/>
<effects:BlendEffect Source="{effects:TileSource Uri=ms-appx:///Assets/BrushAssets/NoiseTexture.png}"/>
<effects:TintEffect/>
<media:PipelineBrush Source="{media:AcrylicSource}">
<media:SepiaEffect />
<media:ShadeEffect />
<media:BlendEffect Source="{media:SolidColorSource}" />
<media:TemperatureAndTintEffect />
<media:BlendEffect Source="{media:TileSource Uri=ms-appx:///Assets/BrushAssets/NoiseTexture.png}" />
<media:TintEffect />
</media:PipelineBrush>
</Border.Background>
</Border>

21
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/PipelineBrush/PipelineBrushXaml.bind
Просмотреть файл

@ -3,8 +3,7 @@
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:brushes="using:Microsoft.Toolkit.Uwp.UI.Media"
xmlns:effects="using:Microsoft.Toolkit.Uwp.UI.Media.Effects"
xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
mc:Ignorable="d">
<Grid>
@ -20,15 +19,15 @@
Grid.Column="2"
Height="400">
<Border.Background>
<brushes:PipelineBrush Source="{effects:BackdropSource}">
<effects:LuminanceToAlphaEffect/>
<effects:OpacityEffect Value="0.4"/>
<effects:BlendEffect Mode="Multiply" Source="{effects:BackdropSource}"/>
<effects:BlurEffect Amount="16"/>
<effects:ShadeEffect Color="#FF222222" Intensity="0.2"/>
<effects:BlendEffect Mode="Overlay" Source="{effects:TileSource Uri=ms-appx:///Assets/BrushAssets/NoiseTexture.png}"/>
<effects:BlendEffect Mode="Overlay" Source="{effects:ImageSource Uri=ms-appx:///SamplePages/DropShadowPanel/Unicorn.png}"/>
</brushes:PipelineBrush>
<media:PipelineBrush Source="{media:BackdropSource}">
<media:LuminanceToAlphaEffect/>
<media:OpacityEffect Value="0.4"/>
<media:BlendEffect Mode="Multiply" Source="{media:BackdropSource}"/>
<media:BlurEffect Amount="16"/>
<media:ShadeEffect Color="#FF222222" Intensity="0.2"/>
<media:BlendEffect Mode="Overlay" Source="{media:TileSource Uri=ms-appx:///Assets/BrushAssets/NoiseTexture.png}"/>
<media:BlendEffect Mode="Overlay" Source="{media:ImageSource Uri=ms-appx:///SamplePages/DropShadowPanel/Unicorn.png}"/>
</media:PipelineBrush>
</Border.Background>
</Border>
</Grid>

28
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Rotate/RotateBehaviorPage.xaml
Просмотреть файл

@ -1,28 +0,0 @@
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.RotateBehaviorPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<!-- Shallow Copy -->
<Grid Visibility="Collapsed">
<Image>
<interactivity:Interaction.Behaviors>
<behaviors:Rotate />
</interactivity:Interaction.Behaviors>
</Image>
<StackPanel>
<Button>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:CallMethodAction />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</StackPanel>
</Grid>
</Page>

42
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Rotate/RotateBehaviorPage.xaml.cs
Просмотреть файл

@ -1,42 +0,0 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System.Linq;
using Microsoft.Toolkit.Uwp.UI.Animations.Behaviors;
using Microsoft.Toolkit.Uwp.UI.Extensions;
using Microsoft.Xaml.Interactivity;
using Windows.UI.Xaml;
namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
{
/// <summary>
/// A page that shows how to use the Rotation behavior.
/// </summary>
public sealed partial class RotateBehaviorPage : IXamlRenderListener
{
private Rotate _rotateBehavior;
/// <summary>
/// Initializes a new instance of the <see cref="RotateBehaviorPage"/> class.
/// </summary>
public RotateBehaviorPage()
{
InitializeComponent();
SampleController.Current.RegisterNewCommand("Apply", (s, e) =>
{
_rotateBehavior?.StartAnimation();
});
}
public void OnXamlRendered(FrameworkElement control)
{
if (control.FindChildByName("EffectElement") is FrameworkElement element)
{
var behaviors = Interaction.GetBehaviors(element);
_rotateBehavior = behaviors.FirstOrDefault(item => item is Rotate) as Rotate;
}
}
}
}

28
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Rotate/RotateBehaviorXaml.bind
Просмотреть файл

@ -1,28 +0,0 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid>
<Border Background="Gray" Width="200" Height="200">
<Image x:Name="EffectElement" Source="ms-appx:///Assets/ToolkitLogo.png" Height="100" Width="100">
<interactivity:Interaction.Behaviors>
<behaviors:Rotate x:Name="Rotate"
Value="@[Value:DoubleSlider:0.0:0.0-360.0]"
CenterX="@[CenterX:DoubleSlider:50.0:0.0-100.0]"
CenterY="@[CenterY:DoubleSlider:50.0:0.0-100.0]"
Duration="@[Duration:DoubleSlider:1000.0:0.0-5000.0]"
Delay="@[Delay:DoubleSlider:0.0:0.0-5000.0]"
EasingType="@[EasingType:Enum:EasingType.Linear]"
EasingMode="@[EasingMode:Enum:EasingMode.EaseOut]"
AutomaticallyStart="@[AutomaticallyStart:Bool:True]"/>
</interactivity:Interaction.Behaviors>
</Image>
</Border>
</Grid>
</Page>

8
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Saturation/SaturationBehaviorCode.bind
Просмотреть файл

@ -1,8 +0,0 @@
// XAML UIElement
<Image x:Name="MyImage" Source="ms-appx:///Assets/Photos/BigFourSummerHeat.jpg">
// C# - Saturation can be applied to any UIElement. In this case it is an image called ToolkitLogo.
using Microsoft.Toolkit.Uwp.UI.Animations;
await MyImage.Saturation(value: 10, duration: 10, delay: 0).StartAsync();

31
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Saturation/SaturationBehaviorPage.xaml
Просмотреть файл

@ -1,31 +0,0 @@
<Page
x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.SaturationBehaviorPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Grid>
<Grid x:Name="XamlRoot" />
<!-- Shallow Copy -->
<Image>
<interactivity:Interaction.Behaviors>
<behaviors:Saturation />
</interactivity:Interaction.Behaviors>
</Image>
<StackPanel Visibility="Collapsed">
<Button>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:CallMethodAction />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</StackPanel>
</Grid>
</Page>

43
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Saturation/SaturationBehaviorPage.xaml.cs
Просмотреть файл

@ -1,43 +0,0 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System.Linq;
using Microsoft.Toolkit.Uwp.UI.Animations;
using Microsoft.Toolkit.Uwp.UI.Animations.Behaviors;
using Microsoft.Toolkit.Uwp.UI.Extensions;
using Microsoft.Xaml.Interactivity;
using Windows.UI.Xaml;
namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
{
/// <summary>
/// A demonstration page of how you can use the Saturation effect using behaviors.
/// </summary>
public sealed partial class SaturationBehaviorPage : IXamlRenderListener
{
private Saturation _saturationBehavior;
/// <summary>
/// Initializes a new instance of the <see cref="SaturationBehaviorPage"/> class.
/// </summary>
public SaturationBehaviorPage()
{
InitializeComponent();
SampleController.Current.RegisterNewCommand("Apply", (s, e) =>
{
_saturationBehavior?.StartAnimation();
});
}
public void OnXamlRendered(FrameworkElement control)
{
if (control.FindChildByName("EffectElement") is FrameworkElement element)
{
var behaviors = Interaction.GetBehaviors(element);
_saturationBehavior = behaviors.FirstOrDefault(item => item is Saturation) as Saturation;
}
}
}
}

26
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Saturation/SaturationBehaviorXaml.bind
Просмотреть файл

@ -1,26 +0,0 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Microsoft.Toolkit.Uwp.SampleApp.SamplePages.OffsetBehavior"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Grid>
<Image x:Name="EffectElement"
Source="ms-appx:///Assets/Photos/BigFourSummerHeat.jpg">
<interactivity:Interaction.Behaviors>
<behaviors:Saturation x:Name="SaturationBehavior"
Value="@[Value:DoubleSlider:1.0:0.0-1.0]"
Duration="@[Duration:DoubleSlider:3000.0:0.0-10000.0]"
Delay="@[Delay:DoubleSlider:0.0:0.0-5000.0]"
EasingType="@[EasingType:Enum:EasingType.Linear]"
EasingMode="@[EasingMode:Enum:EasingMode.EaseOut]"
AutomaticallyStart="@[AutomaticallyStart:Bool:True]"/>
</interactivity:Interaction.Behaviors>
</Image>
</Grid>
</Page>

31
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Scale/ScaleBehaviorPage.xaml
Просмотреть файл

@ -1,31 +0,0 @@
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.ScaleBehaviorPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<!-- Shallow Copy -->
<Grid Visibility="Collapsed">
<Image>
<interactivity:Interaction.Behaviors>
<behaviors:Scale />
</interactivity:Interaction.Behaviors>
<Image.RenderTransform>
<TranslateTransform />
</Image.RenderTransform>
</Image>
<StackPanel>
<Button>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:CallMethodAction />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
</StackPanel>
</Grid>
</Page>

42
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Scale/ScaleBehaviorPage.xaml.cs
Просмотреть файл

@ -1,42 +0,0 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System.Linq;
using Microsoft.Toolkit.Uwp.UI.Animations.Behaviors;
using Microsoft.Toolkit.Uwp.UI.Extensions;
using Microsoft.Xaml.Interactivity;
using Windows.UI.Xaml;
namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
{
/// <summary>
/// A page that shows how to use the scale behavior.
/// </summary>
public sealed partial class ScaleBehaviorPage : IXamlRenderListener
{
private Scale _scaleBehavior;
/// <summary>
/// Initializes a new instance of the <see cref="ScaleBehaviorPage"/> class.
/// </summary>
public ScaleBehaviorPage()
{
InitializeComponent();
SampleController.Current.RegisterNewCommand("Apply", (s, e) =>
{
_scaleBehavior?.StartAnimation();
});
}
public void OnXamlRendered(FrameworkElement control)
{
if (control.FindChildByName("EffectElement") is FrameworkElement element)
{
var behaviors = Interaction.GetBehaviors(element);
_scaleBehavior = behaviors.FirstOrDefault(item => item is Scale) as Scale;
}
}
}
}

30
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Scale/ScaleBehaviorXaml.bind
Просмотреть файл

@ -1,30 +0,0 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Microsoft.Toolkit.Uwp.SampleApp.SamplePages.ScaleBehavior"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
mc:Ignorable="d">
<Grid>
<Border Background="Gray" Width="200" Height="200">
<Image x:Name="EffectElement" Source="ms-appx:///Assets/ToolkitLogo.png" Height="100" Width="100">
<interactivity:Interaction.Behaviors>
<behaviors:Scale x:Name="Scale"
ScaleX="@[ScaleX:DoubleSlider:1.0:0.5-5.0]"
ScaleY="@[ScaleY:DoubleSlider:1.0:0.5-5.0]"
CenterX="@[CenterX:DoubleSlider:50.0:0.0-100.0]"
CenterY="@[CenterY:DoubleSlider:50.0:0.0-100.0]"
Duration="@[Duration:DoubleSlider:1000.0:0.0-5000.0]"
Delay="@[Delay:DoubleSlider:0.0:0.0-5000.0]"
EasingType="@[EasingType:Enum:EasingType.Linear]"
EasingMode="@[EasingMode:Enum:EasingMode.EaseOut]"
AutomaticallyStart="@[AutomaticallyStart:Bool:True]"/>
</interactivity:Interaction.Behaviors>
</Image>
</Border>
</Grid>
</Page>

45
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ScrollHeader/ScrollHeaderCode.bind
Просмотреть файл

@ -2,34 +2,37 @@
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
xmlns:models="using:Microsoft.Toolkit.Uwp.SampleApp.Models"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid>
<ListView Name="listView">
<interactivity:Interaction.Behaviors>
<behaviors:QuickReturnHeaderBehavior />
</interactivity:Interaction.Behaviors>
<ListView.Header>
<controls:ScrollHeader Mode="@[Mode:Enum:ScrollHeaderMode.QuickReturn]">
<Grid x:Name="MyHeaderGrid"
MinHeight="250"
Background="{ThemeResource Brush-Blue-01}">
<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
<TextBlock Margin="12"
FontSize="48"
FontWeight="Bold"
Foreground="White"
Text="Scroll Header"
TextAlignment="Center"
TextWrapping="WrapWholeWords" />
<TextBlock Margin="12,0,12,12"
VerticalAlignment="Center"
Foreground="White"
Text="The scroll header supports quick return, sticky and fade behavior. If fade is enabled the header fades out while scrolling down. If quick return is enabled the header hides when the ListView is scrolled down and reappears immediately as soon as the ListView is scrolled up again. If sticky is enabled the header is displayed regardless of scrolling."
TextAlignment="Center"
TextWrapping="WrapWholeWords" />
</StackPanel>
</Grid>
</controls:ScrollHeader>
<Grid x:Name="MyHeaderGrid"
MinHeight="250"
Background="{ThemeResource Brush-Blue-01}">
<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
<TextBlock Margin="12"
FontSize="48"
FontWeight="Bold"
Foreground="White"
Text="Scroll Header"
TextAlignment="Center"
TextWrapping="WrapWholeWords" />
<TextBlock Margin="12,0,12,12"
VerticalAlignment="Center"
Foreground="White"
Text="The scroll header supports quick return, sticky and fade behavior. If fade is enabled the header fades out while scrolling down. If quick return is enabled the header hides when the ListView is scrolled down and reappears immediately as soon as the ListView is scrolled up again. If sticky is enabled the header is displayed regardless of scrolling."
TextAlignment="Center"
TextWrapping="WrapWholeWords" />
</StackPanel>
</Grid>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>

18
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ScrollHeader/ScrollHeaderPage.xaml
Просмотреть файл

@ -1,19 +1,15 @@
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.ScrollHeaderPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<!-- Shallow Copy -->
<Grid Visibility="Collapsed">
<ListView>
<ListView.Header>
<controls:ScrollHeader>
<Grid/>
</controls:ScrollHeader>
</ListView.Header>
</ListView>
</Grid>
<!-- Shallow Copy -->
<Page.Resources>
<behaviors:QuickReturnHeaderBehavior x:Key="QuickReturnHeaderBehavior" />
<behaviors:StickyHeaderBehavior x:Key="StickyHeaderBehavior" />
<behaviors:FadeHeaderBehavior x:Key="FadeHeaderBehavior" />
</Page.Resources>
</Page>

131
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ScrollViewerExtensions/ScrollViewerExtensionsPage.xaml
Просмотреть файл

@ -1,10 +1,12 @@
<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.ScrollViewerExtensionsPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
xmlns:common="using:Microsoft.Toolkit.Uwp.SampleApp.Common"
xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.ScrollViewerExtensionsPage"
xmlns:extensions="using:Microsoft.Toolkit.Uwp.UI.Extensions"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
@ -14,47 +16,49 @@
<Grid>
<ListView Name="listView"
extensions:ScrollViewerExtensions.VerticalScrollBarMargin="{Binding MinHeight, ElementName=MyHeaderGrid, Converter={StaticResource DoubleTopThicknessConverter}}">
extensions:ScrollViewerExtensions.VerticalScrollBarMargin="{Binding MinHeight, ElementName=MyHeaderGrid, Converter={StaticResource DoubleTopThicknessConverter}}">
<interactivity:Interaction.Behaviors>
<behaviors:StickyHeaderBehavior />
</interactivity:Interaction.Behaviors>
<ListView.Header>
<controls:ScrollHeader Mode="Sticky">
<Grid x:Name="MyHeaderGrid"
Background="{ThemeResource Brush-Sample-TransparentHeader}">
<StackPanel HorizontalAlignment="Center"
VerticalAlignment="Center">
<TextBlock Margin="12"
FontSize="48"
FontWeight="Bold"
Foreground="{ThemeResource Brush-Main}"
Text="Scroll Header"
TextAlignment="Center"
TextWrapping="WrapWholeWords" />
<TextBlock Margin="12,0,12,12"
VerticalAlignment="Center"
Foreground="{ThemeResource Brush-Main}"
Text="The attached property allows you to assign a Thickness to both vertical and horizontal ScrollBar inside any container. In this example, VerticalScrollBarMargin is bound to StickyHeader's MinHeight. Moving MinHeight's Slider will move the vertical ScrollBar accordingly."
TextAlignment="Center"
TextWrapping="WrapWholeWords" />
</StackPanel>
</Grid>
</controls:ScrollHeader>
<Grid x:Name="MyHeaderGrid"
Background="{ThemeResource Brush-Sample-TransparentHeader}">
<StackPanel HorizontalAlignment="Center"
VerticalAlignment="Center">
<TextBlock Margin="12"
FontSize="48"
FontWeight="Bold"
Foreground="{ThemeResource Brush-Main}"
Text="Scroll Header"
TextAlignment="Center"
TextWrapping="WrapWholeWords" />
<TextBlock Margin="12,0,12,12"
VerticalAlignment="Center"
Foreground="{ThemeResource Brush-Main}"
Text="The attached property allows you to assign a Thickness to both vertical and horizontal ScrollBar inside any container. In this example, VerticalScrollBarMargin is bound to StickyHeader's MinHeight. Moving MinHeight's Slider will move the vertical ScrollBar accordingly."
TextAlignment="Center"
TextWrapping="WrapWholeWords" />
</StackPanel>
</Grid>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<Grid MinHeight="100" Background="Blue">
<Grid MinHeight="100"
Background="Blue">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image x:Name="ToolkitLogo"
Grid.Column="0"
Width="100"
Height="100"
Margin="0,0,24,0"
Source="ms-appx:///Assets/ToolkitLogo.png" />
Grid.Column="0"
Width="100"
Height="100"
Margin="0,0,24,0"
Source="ms-appx:///Assets/ToolkitLogo.png" />
<TextBlock Grid.Column="1"
VerticalAlignment="Center"
Text="{Binding Title}"
TextTrimming="CharacterEllipsis" />
VerticalAlignment="Center"
Text="{Binding Title}"
TextTrimming="CharacterEllipsis" />
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
@ -66,45 +70,44 @@
</ListView.ItemContainerStyle>
</ListView>
<StackPanel x:Name="shapesPanel"
HorizontalAlignment="Center"
Margin="{Binding MinHeight, ElementName=MyHeaderGrid, Converter={StaticResource DoubleTopThicknessConverter}}"
Padding="88"
HorizontalAlignment="Center"
Spacing="32">
<Polygon Height="100"
Width="100"
Points="0,0 0,72 44,36"
Stroke="DarkGreen"
<Polygon Width="100"
Height="100"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Fill="Green"
VerticalAlignment="Center"
HorizontalAlignment="Center"/>
<StackPanel Orientation="Horizontal"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Spacing="4"
Points="0,0 0,72 44,36"
Stroke="DarkGreen" />
<StackPanel Width="100"
Height="84"
Width="100">
<Polygon Points="0,0 0,56 32,28"
Stroke="Blue"
Fill="DodgerBlue"/>
<Polygon Points="0,0 0,56 32,28"
Stroke="Blue"
Fill="DodgerBlue"/>
HorizontalAlignment="Center"
VerticalAlignment="Center"
Orientation="Horizontal"
Spacing="4">
<Polygon Fill="DodgerBlue"
Points="0,0 0,56 32,28"
Stroke="Blue" />
<Polygon Fill="DodgerBlue"
Points="0,0 0,56 32,28"
Stroke="Blue" />
</StackPanel>
<TextBlock
Height="100"
FontSize="24"
TextAlignment="Center">
<Run Text="Look at me, I'm floating between"/>
<LineBreak/>
<Run Text="two different ListView items!"/>
<TextBlock Height="100"
FontSize="24"
TextAlignment="Center">
<Run Text="Look at me, I'm floating between" />
<LineBreak />
<Run Text="two different ListView items!" />
</TextBlock>
<Polygon Height="100"
Width="100"
Points="0,0 0,60 60,60 60,0"
Stroke="DarkRed"
Fill="Crimson"
<Polygon Width="100"
Height="100"
HorizontalAlignment="Center"
VerticalAlignment="Center"
HorizontalAlignment="Center"/>
Fill="Crimson"
Points="0,0 0,60 60,60 60,0"
Stroke="DarkRed" />
</StackPanel>
</Grid>
</Page>

1
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ScrollViewerExtensions/ScrollViewerExtensionsPage.xaml.cs
Просмотреть файл

@ -4,6 +4,7 @@
using System.Collections.ObjectModel;
using Microsoft.Toolkit.Uwp.SampleApp.Models;
using Microsoft.Toolkit.Uwp.UI.Animations;
using Microsoft.Toolkit.Uwp.UI.Extensions;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

47
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ScrollViewerExtensions/ScrollViewerExtensionsXaml.bind
Просмотреть файл

@ -5,6 +5,8 @@
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:extensions="using:Microsoft.Toolkit.Uwp.UI.Extensions"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
mc:Ignorable="d">
<Page.Resources>
@ -15,29 +17,30 @@
<ListView Name="listView"
extensions:ScrollViewerExtensions.VerticalScrollBarMargin="{Binding MinHeight, ElementName=MyHeaderGrid, Converter={StaticResource DoubleTopThicknessConverter}}"
extensions:ScrollViewerExtensions.EnableMiddleClickScrolling="@[EnableMiddleClickScrolling:Bool:True]">
<interactivity:Interaction.Behaviors>
<behaviors:StickyHeaderBehavior />
</interactivity:Interaction.Behaviors>
<ListView.Header>
<controls:ScrollHeader Mode="Sticky">
<Grid x:Name="MyHeaderGrid"
MinHeight="@[Header MinHeight:DoubleSlider:250:150-500]"
Background="{ThemeResource Brush-Sample-TransparentHeader}">
<StackPanel HorizontalAlignment="Center"
VerticalAlignment="Center">
<TextBlock Margin="12"
FontSize="48"
FontWeight="Bold"
Foreground="{ThemeResource Brush-Main}"
Text="Scroll Header"
TextAlignment="Center"
TextWrapping="WrapWholeWords" />
<TextBlock Margin="12,0,12,12"
VerticalAlignment="Center"
Foreground="{ThemeResource Brush-Main}"
Text="The attached property allows you to assign a Thickness to both vertical and horizontal ScrollBar inside any container. In this example, VerticalScrollBarMargin is bound to StickyHeader's MinHeight. Moving MinHeight's Slider will move the vertical ScrollBar accordingly."
TextAlignment="Center"
TextWrapping="WrapWholeWords" />
</StackPanel>
</Grid>
</controls:ScrollHeader>
<Grid x:Name="MyHeaderGrid"
MinHeight="@[Header MinHeight:DoubleSlider:250:150-500]"
Background="{ThemeResource Brush-Sample-TransparentHeader}">
<StackPanel HorizontalAlignment="Center"
VerticalAlignment="Center">
<TextBlock Margin="12"
FontSize="48"
FontWeight="Bold"
Foreground="{ThemeResource Brush-Main}"
Text="Scroll Header"
TextAlignment="Center"
TextWrapping="WrapWholeWords" />
<TextBlock Margin="12,0,12,12"
VerticalAlignment="Center"
Foreground="{ThemeResource Brush-Main}"
Text="The attached property allows you to assign a Thickness to both vertical and horizontal ScrollBar inside any container. In this example, VerticalScrollBarMargin is bound to StickyHeader's MinHeight. Moving MinHeight's Slider will move the vertical ScrollBar accordingly."
TextAlignment="Center"
TextWrapping="WrapWholeWords" />
</StackPanel>
</Grid>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>

7
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/ViewportBehavior/ViewportBehaviorPage.xaml.cs
Просмотреть файл

@ -6,7 +6,6 @@ using System;
using System.Collections.ObjectModel;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.Toolkit.Uwp.UI.Animations;
using Microsoft.Toolkit.Uwp.UI.Behaviors;
using Microsoft.Toolkit.Uwp.UI.Extensions;
using Microsoft.Xaml.Interactivity;
@ -39,7 +38,7 @@ namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
if (control.FindChildByName("EffectElement") is Image effectElement)
{
_effectElement = effectElement;
_effectElement.Blur(value: 10, duration: 0).Start();
////TODO: _effectElement.Blur(value: 10, duration: 0).Start();
}
if (control.FindChildByName("EffectElementHost") is FrameworkElement effectElementHost)
@ -72,7 +71,7 @@ namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
{
AddLog("Entered viewport");
await _effectElement.Blur(value: 0, duration: 1500).StartAsync();
////TODO: await _effectElement.Blur(value: 0, duration: 1500).StartAsync();
}
private void EffectElementHost_EnteringViewport(object sender, EventArgs e)
@ -87,7 +86,7 @@ namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
AddLog("Exited viewport");
_effectElement.Source = null;
await _effectElement.Blur(value: 8, duration: 0).StartAsync();
////TODO: await _effectElement.Blur(value: 8, duration: 0).StartAsync();
}
private void EffectElementHost_ExitingViewport(object sender, EventArgs e)

34
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/VisualEffectFactory/VisualEffectFactory.bind Normal file
Просмотреть файл

@ -0,0 +1,34 @@
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
mc:Ignorable="d">
<Grid>
<Image Source="ms-appx:///Assets/Photos/BigFourSummerHeat.jpg"/>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<ProgressRing IsActive="True" Grid.ColumnSpan="2"
VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="Red" Width="200" Height="200"/>
<Border Grid.Column="2"
Height="400">
<media:UIElementExtensions.VisualFactory>
<media:PipelineVisualFactory>
<media:LuminanceToAlphaEffect/>
<media:OpacityEffect Value="0.4"/>
<media:BlendEffect Mode="Multiply" Source="{media:BackdropSource}"/>
<media:BlurEffect Amount="16"/>
<media:ShadeEffect Color="#FF222222" Intensity="0.2"/>
<media:BlendEffect Mode="Overlay" Source="{media:TileSource Uri=ms-appx:///Assets/BrushAssets/NoiseTexture.png}"/>
<media:BlendEffect Mode="Overlay" Source="{media:ImageSource Uri=ms-appx:///SamplePages/DropShadowPanel/Unicorn.png}"/>
</media:PipelineVisualFactory>
</media:UIElementExtensions.VisualFactory>
</Border>
</Grid>
</Grid>
</Page>

38
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/XamlOnlyPage.xaml
Просмотреть файл

@ -1,9 +1,14 @@
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.XamlOnlyPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:ani="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="using:Microsoft.Toolkit.Uwp.SampleApp.SamplePages"
xmlns:interactions="using:Microsoft.Xaml.Interactions.Core"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
xmlns:mediaactions="using:Microsoft.Xaml.Interactions.Media"
xmlns:triggers="using:Microsoft.Toolkit.Uwp.UI.Triggers"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
mc:Ignorable="d">
@ -19,7 +24,36 @@
<triggers:RegexStateTrigger x:Key="RegexStateTrigger" />
<triggers:UserHandPreferenceStateTrigger x:Key="UserHandPreferenceStateTrigger" />
<triggers:UserInteractionModeStateTrigger x:Key="UserInteractionModeStateTrigger" />
<behaviors:StartAnimationAction x:Key="StartAnimationAction" />
</Page.Resources>
<Grid />
<Grid>
<ani:Explicit.Animations>
<ani:AnimationSet x:Name="AnimationSet">
<ani:BlurEffectAnimation />
<ani:OpacityAnimation />
<ani:StartAnimationActivity />
<ani:InvokeActionsActivity />
<ani:ClipAnimation/>
<ani:BlurEffectAnimation/>
<ani:SaturationEffectAnimation/>
<ani:AnimationScope/>
<ani:ExposureEffectAnimation/>
</ani:AnimationSet>
</ani:Explicit.Animations>
<media:UIElementExtensions.VisualFactory>
<media:PipelineVisualFactory>
<media:OpacityEffect />
<media:ExposureEffect/>
</media:PipelineVisualFactory>
</media:UIElementExtensions.VisualFactory>
<!-- External -->
<interactivity:Interaction.Behaviors>
<interactions:EventTriggerBehavior EventName="Loaded">
<interactions:ChangePropertyAction />
<mediaactions:PlaySoundAction />
</interactions:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Grid>
</Page>

102
Microsoft.Toolkit.Uwp.SampleApp/SamplePages/samples.json
Просмотреть файл

@ -462,87 +462,84 @@
"Name": "Animations",
"Icon": "Icons/Animations.png",
"Samples": [
{
"Name": "StartAnimationActivity",
"Subcategory": "Activities",
"About": "Activity for Animations to Start another Animation",
"CodeUrl": "https://github.com/windows-toolkit/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Animations/Xaml/Activities",
"XamlCodeFile": "/SamplePages/Animations/Activities/StartAnimationActivity.bind",
"DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/animations/Fade.md"
},
{
"Name": "InvokeActionsActivity",
"Subcategory": "Activities",
"About": "Activity chaining Actions from the Behaviors package into an Animation schedule.",
"CodeUrl": "https://github.com/windows-toolkit/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Behaviors/Animations",
"XamlCodeFile": "/SamplePages/Animations/Activities/InvokeActionsActivity.bind",
"DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/animations/Fade.md"
},
{
"Name": "Fade",
"Type": "FadeBehaviorPage",
"Subcategory": "Behavior",
"About": "Opacity of XAML elements using composition",
"Subcategory": "Effect",
"About": "Opacity of XAML elements using composition animations",
"CodeUrl": "https://github.com/windows-toolkit/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Animations/Behaviors",
"CodeFile": "FadeBehaviorCode.bind",
"XamlCodeFile": "FadeBehaviorXaml.bind",
"Icon": "/SamplePages/Fade/FadeBehavior.png",
"CodeFile": "/SamplePages/Animations/Effects/FadeBehaviorCode.bind",
"XamlCodeFile": "/SamplePages/Animations/Effects/FadeBehaviorXaml.bind",
"Icon": "/SamplePages/Animations/Effects/FadeBehavior.png",
"DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/animations/Fade.md"
},
{
"Name": "Scale",
"Type": "ScaleBehaviorPage",
"Subcategory": "Behavior",
"About": "Scale of XAML elements using composition",
"CodeUrl": "https://github.com/windows-toolkit/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Animations/Behaviors",
"CodeFile": "ScaleBehaviorCode.bind",
"XamlCodeFile": "ScaleBehaviorXaml.bind",
"Icon": "/SamplePages/Scale/scaleBehavior.png",
"CodeFile": "/SamplePages/Animations/Behaviors/ScaleBehaviorCode.bind",
"XamlCodeFile": "/SamplePages/Animations/Behaviors/ScaleBehaviorXaml.bind",
"Icon": "/SamplePages/Animations/Behaviors/ScaleBehavior.png",
"DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/animations/Scale.md"
},
{
"Name": "Offset",
"Type": "OffsetBehaviorPage",
"Subcategory": "Behavior",
"About": "Offset of XAML elements using composition",
"CodeUrl": "https://github.com/windows-toolkit/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Animations/Behaviors",
"CodeFile": "OffsetBehaviorCode.bind",
"XamlCodeFile": "OffsetBehaviorXaml.bind",
"Icon": "/SamplePages/Offset/offsetBehavior.png",
"CodeFile": "/SamplePages/Animations/Behaviors/OffsetBehaviorCode.bind",
"XamlCodeFile": "/SamplePages/Animations/Behaviors/OffsetBehaviorXaml.bind",
"Icon": "/SamplePages/Animations/Behaviors/OffsetBehavior.png",
"DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/animations/Offset.md"
},
{
"Name": "Rotate",
"Type": "RotateBehaviorPage",
"Subcategory": "Behavior",
"About": "Rotation on XAML elements using composition",
"CodeUrl": "https://github.com/windows-toolkit/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Animations/Behaviors",
"CodeFile": "RotateBehaviorCode.bind",
"XamlCodeFile": "RotateBehaviorXaml.bind",
"Icon": "/SamplePages/Rotate/rotateBehavior.png",
"CodeFile": "/SamplePages/Animations/Behaviors/RotateBehaviorCode.bind",
"XamlCodeFile": "/SamplePages/Animations/Behaviors/RotateBehaviorXaml.bind",
"Icon": "/SamplePages/Animations/Behaviors/RotateBehavior.png",
"DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/animations/Rotate.md"
},
{
"Name": "Blur",
"Type": "BlurBehaviorPage",
"Subcategory": "Behavior",
"About": "Blur XAML elements using composition",
"CodeUrl": "https://github.com/windows-toolkit/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Animations/Behaviors",
"CodeFile": "BlurBehaviorCode.bind",
"XamlCodeFile": "BlurBehaviorXaml.bind",
"Icon": "/SamplePages/Blur/blurBehavior.png",
"CodeFile": "/SamplePages/Animations/Behaviors/BlurBehaviorCode.bind",
"XamlCodeFile": "/SamplePages/Animations/Behaviors/BlurBehaviorXaml.bind",
"Icon": "/SamplePages/Animations/Behaviors/BlurBehavior.png",
"BadgeUpdateVersionRequired": "Anniversary Update required",
"DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/animations/Blur.md"
},
{
"Name": "Saturation",
"Type": "SaturationBehaviorPage",
"Subcategory": "Behavior",
"About": "Saturate XAML elements using composition",
"CodeUrl": "https://github.com/windows-toolkit/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Animations/Behaviors",
"CodeFile": "SaturationBehaviorCode.bind",
"XamlCodeFile": "SaturationBehaviorXaml.bind",
"Icon": "/SamplePages/Saturation/saturationBehavior.png",
"CodeFile": "/SamplePages/Animations/Behaviors/SaturationBehaviorCode.bind",
"XamlCodeFile": "/SamplePages/Animations/Behaviors/SaturationBehaviorXaml.bind",
"Icon": "/SamplePages/Animations/Behaviors/SaturationBehavior.png",
"BadgeUpdateVersionRequired": "Anniversary Update required",
"DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/animations/Saturation.md"
},
{
"Name": "Light",
"Type": "LightBehaviorPage",
"Subcategory": "Behavior",
"About": "The Light effect will be removed in a future major release",
"BadgeUpdateVersionRequired": "DEPRECATED",
"DeprecatedWarning": "The Light effect will be removed in a future major release",
"CodeUrl": "https://github.com/windows-toolkit/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Animations/Behaviors",
"CodeFile": "LightBehaviorCode.bind",
"XamlCodeFile": "LightBehaviorXaml.bind",
"Icon": "/SamplePages/Light/LightBehavior.png",
"DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/animations/Light.md"
},
{
"Name": "FadeHeader",
"Type": "FadeHeaderBehaviorPage",
@ -563,16 +560,24 @@
"CodeUrl": "https://github.com/windows-toolkit/Lottie-Windows"
},
{
"Name": "ReorderGridAnimation",
"Type": "ReorderGridPage",
"Name": "ItemsReorderAnimation",
"Type": "ItemsReorderAnimationPage",
"Subcategory": "Effect",
"About": "Animates items of a grid when the size changes",
"About": "Animates items of a grid or list control when the size changes",
"CodeUrl": "https://github.com/windows-toolkit/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Animations",
"XamlCodeFile": "ReorderGrid.bind",
"Icon": "/SamplePages/ReorderGridAnimation/ReorderGrid.png",
"XamlCodeFile": "ItemsReorderAnimation.bind",
"Icon": "/SamplePages/ItemsReorderAnimation/ItemsReorderAnimation.png",
"BadgeUpdateVersionRequired": "Anniversary Update required",
"DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/animations/ReorderGrid.md"
},
{
"Name": "EffectAnimations",
"Subcategory": "Effect",
"About": "Effects from the Media package that can be animated from an AnimationSet schedule.",
"CodeUrl": "https://github.com/windows-toolkit/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Media/Animations",
"XamlCodeFile": "/SamplePages/Animations/Effects/EffectAnimations.bind",
"DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/animations/Fade.md"
},
{
"Name": "Implicit Animations",
"Type": "ImplicitAnimationsPage",
@ -1113,6 +1118,15 @@
"ApiCheck": "Windows.UI.Xaml.Media.XamlCompositionBrushBase",
"DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/brushes/PipelineBrush.md"
},
{
"Name": "VisualEffectFactory",
"About": "A composition pipeline which can render any custom Win2D/Composition effects chain directly on a Composition visual.",
"CodeUrl": "https://github.com/windows-toolkit/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Media/Brushes/PipelineBrush.cs",
"XamlCodeFile": "VisualEffectFactory.bind",
"Icon": "/SamplePages/PipelineBrush/PipelineBrush.png",
"ApiCheck": "Windows.UI.Xaml.Media.XamlCompositionBrushBase",
"DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/brushes/PipelineBrush.md"
},
{
"Name": "AcrylicBrush",
"Type": "AcrylicBrushPage",

24
Microsoft.Toolkit.Uwp.SampleApp/Shell.SamplePicker.cs
Просмотреть файл

@ -221,15 +221,12 @@ namespace Microsoft.Toolkit.Uwp.SampleApp
{
var staggerDelay = TimeSpan.FromMilliseconds(relativeIndex * 30);
var animationCollection = new AnimationCollection()
{
new OpacityAnimation() { From = 0, To = 1, Duration = TimeSpan.FromMilliseconds(400), Delay = staggerDelay, SetInitialValueBeforeDelay = true },
new ScaleAnimation() { From = "0.9", To = "1", Duration = TimeSpan.FromMilliseconds(400), Delay = staggerDelay }
};
VisualExtensions.SetNormalizedCenterPoint(itemContainer, "0.5");
animationCollection.StartAnimation(itemContainer);
AnimationBuilder.Create()
.Opacity(from: 0, to: 1, delay: staggerDelay)
.Scale(from: 0.9, to: 1, delay: staggerDelay)
.Start(itemContainer);
}
}
@ -238,11 +235,8 @@ namespace Microsoft.Toolkit.Uwp.SampleApp
var panel = (sender as FrameworkElement).FindDescendant<DropShadowPanel>();
if (panel != null)
{
var animation = new OpacityAnimation() { To = 0, Duration = TimeSpan.FromMilliseconds(1200) };
animation.StartAnimation(panel);
var parentAnimation = new ScaleAnimation() { To = "1", Duration = TimeSpan.FromMilliseconds(1200) };
parentAnimation.StartAnimation(panel.Parent as UIElement);
AnimationBuilder.Create().Opacity(0, duration: TimeSpan.FromMilliseconds(1200)).Start(panel);
AnimationBuilder.Create().Scale(1, duration: TimeSpan.FromMilliseconds(1200)).Start((UIElement)panel.Parent);
}
}
@ -254,11 +248,9 @@ namespace Microsoft.Toolkit.Uwp.SampleApp
if (panel != null)
{
panel.Visibility = Visibility.Visible;
var animation = new OpacityAnimation() { To = 1, Duration = TimeSpan.FromMilliseconds(600) };
animation.StartAnimation(panel);
var parentAnimation = new ScaleAnimation() { To = "1.1", Duration = TimeSpan.FromMilliseconds(600) };
parentAnimation.StartAnimation(panel.Parent as UIElement);
AnimationBuilder.Create().Opacity(1, duration: TimeSpan.FromMilliseconds(600)).Start(panel);
AnimationBuilder.Create().Scale(1.1, duration: TimeSpan.FromMilliseconds(600)).Start((UIElement)panel.Parent);
}
}
}

172
Microsoft.Toolkit.Uwp.SampleApp/Shell.xaml
Просмотреть файл

@ -1,15 +1,14 @@
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.Shell"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:animations="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:extensions="using:Microsoft.Toolkit.Uwp.UI.Extensions"
xmlns:local="using:Microsoft.Toolkit.Uwp.SampleApp"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
xmlns:winui="using:Microsoft.UI.Xaml.Controls"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
xmlns:animations="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
extensions:TitleBarExtensions.BackgroundColor="{StaticResource Brand-Color}"
extensions:TitleBarExtensions.ButtonBackgroundColor="{StaticResource Brand-Color}"
extensions:TitleBarExtensions.ButtonForegroundColor="{StaticResource Titlebar-Foreground}"
@ -30,94 +29,107 @@
</Page.Resources>
<Grid>
<winui:NavigationView x:Name="NavView"
Style="{StaticResource ToolkitNavViewStyle}"
PaneDisplayMode="Top"
MenuItemTemplate="{StaticResource CategoryTemplate}"
IsSettingsVisible="True"
ItemInvoked="NavView_ItemInvoked"
MenuItemTemplate="{StaticResource CategoryTemplate}"
PaneDisplayMode="Top"
SelectionFollowsFocus="Disabled"
IsSettingsVisible="True">
Style="{StaticResource ToolkitNavViewStyle}">
<winui:NavigationView.PaneFooter>
<AutoSuggestBox x:Name="SearchBox"
VerticalAlignment="Center"
MinWidth="150"
QueryIcon="Find"
TextChanged="SearchBox_TextChanged"
VerticalAlignment="Center"
KeyDown="SearchBox_KeyDown"
QuerySubmitted="SearchBox_QuerySubmitted" />
QueryIcon="Find"
QuerySubmitted="SearchBox_QuerySubmitted"
TextChanged="SearchBox_TextChanged" />
</winui:NavigationView.PaneFooter>
<Grid>
<winui:ParallaxView x:Name="Parallax"
VerticalShift="50">
<Image Stretch="UniformToFill"
Source="Assets/Photos/Backgrounds/hero.jpg"/>
<Image Source="Assets/Photos/Backgrounds/hero.jpg"
Stretch="UniformToFill" />
</winui:ParallaxView>
<Frame x:Name="NavigationFrame" />
<Grid>
<Border x:Name="ContentShadow"
Tapped="ContentShadow_Tapped"
Background="{ThemeResource BackingTint}"
Tapped="ContentShadow_Tapped"
Visibility="{Binding Visibility, ElementName=SamplePickerGrid}">
<interactivity:Interaction.Behaviors>
<behaviors:Blur AutomaticallyStart="True"
Delay="0"
Value="2"
Duration="0" />
</interactivity:Interaction.Behaviors>
<media:UIElementExtensions.VisualFactory>
<media:PipelineVisualFactory Source="{media:BackdropSource}">
<media:BlurEffect Amount="8" />
</media:PipelineVisualFactory>
</media:UIElementExtensions.VisualFactory>
<animations:Implicit.ShowAnimations>
<animations:OpacityAnimation From="0" To="1" Duration="0:0:0.3"></animations:OpacityAnimation>
<animations:OpacityAnimation From="0"
To="1"
Duration="0:0:0.3" />
</animations:Implicit.ShowAnimations>
<animations:Implicit.HideAnimations>
<animations:OpacityAnimation From="1" To="0" Duration="0:0:0.2"></animations:OpacityAnimation>
<animations:OpacityAnimation From="1"
To="0"
Duration="0:0:0.2" />
</animations:Implicit.HideAnimations>
</Border>
<Grid x:Name="SamplePickerGrid"
VerticalAlignment="Top"
x:DeferLoadStrategy="Lazy"
Visibility="Collapsed"
VerticalAlignment="Top">
<controls:DropShadowPanel VerticalContentAlignment="Stretch"
HorizontalContentAlignment="Stretch"
ShadowOpacity="0.7"
Color="Black"
BlurRadius="10"
Visibility="Collapsed">
<controls:DropShadowPanel Margin="0,0,0,-3"
VerticalAlignment="Bottom"
Margin="0,0,0,-3">
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
BlurRadius="10"
ShadowOpacity="0.7"
Color="Black">
<Border Height="1" />
</controls:DropShadowPanel>
<Border Background="{ThemeResource Menu-DropDown-Background}" />
<GridView x:Name="SamplePickerGridView"
animations:ReorderGridAnimation.Duration="200"
animations:ItemsReorderAnimation.Duration="0:0:0.200"
ChoosingItemContainer="SamplePickerGridView_ChoosingItemContainer"
IsItemClickEnabled="True"
ItemClick="SamplePickerGridView_ItemClick"
ItemContainerStyle="{StaticResource SamplePickerItemStyle}"
ItemContainerTransitions="{x:Null}"
ItemTemplate="{StaticResource SampleTemplate}"
SelectionMode="Single"
ItemClick="SamplePickerGridView_ItemClick"
ChoosingItemContainer="SamplePickerGridView_ChoosingItemContainer"
Transitions="{x:Null}">
<GridView.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<TextBlock Text="{Binding Key}"/>
<TextBlock Text="{Binding Key}" />
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
</GridView.GroupStyle>
<animations:Implicit.ShowAnimations>
<animations:OpacityAnimation From="0" To="1" Duration="0:0:0.3" Delay="0:0:0.2" SetInitialValueBeforeDelay="True"></animations:OpacityAnimation>
<animations:OpacityAnimation Delay="0:0:0.2"
From="0"
To="1"
Duration="0:0:0.3" />
</animations:Implicit.ShowAnimations>
</GridView>
<animations:Implicit.ShowAnimations>
<animations:OpacityAnimation From="0" To="1" Duration="0:0:0.3"></animations:OpacityAnimation>
<animations:TranslationAnimation From="0, -1000, 0" To="0" Duration="0:0:0.3"></animations:TranslationAnimation>
<animations:OpacityAnimation From="0"
To="1"
Duration="0:0:0.3" />
<animations:TranslationAnimation From="0, -1000, 0"
To="0"
Duration="0:0:0.3" />
</animations:Implicit.ShowAnimations>
<animations:Implicit.HideAnimations>
<animations:OpacityAnimation From="1" To="0" Duration="0:0:0.5"></animations:OpacityAnimation>
<animations:TranslationAnimation To="0, -1000, 0" From="0" Duration="0:0:0.5"></animations:TranslationAnimation>
<animations:OpacityAnimation From="1"
To="0"
Duration="0:0:0.5" />
<animations:TranslationAnimation From="0"
To="0, -1000, 0"
Duration="0:0:0.5" />
</animations:Implicit.HideAnimations>
</Grid>
@ -125,30 +137,29 @@
</Grid>
</winui:NavigationView>
<Canvas x:Name="MoreInfoCanvas"
Grid.RowSpan="2"
Background="Transparent"
Tapped="MoreInfoCanvas_Tapped"
Visibility="Collapsed"
Grid.RowSpan="2">
Visibility="Collapsed">
<Grid x:Name="MoreInfoContent"
Width="260"
Height="320"
extensions:VisualExtensions.NormalizedCenterPoint="0.5">
<Grid VerticalAlignment="Top">
<controls:DropShadowPanel VerticalContentAlignment="Stretch"
HorizontalContentAlignment="Stretch"
ShadowOpacity="0.6"
Color="Black"
<controls:DropShadowPanel HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
BlurRadius="60"
OffsetY="6"
BlurRadius="60">
ShadowOpacity="0.6"
Color="Black">
<Border Background="{ThemeResource Menu-DropDown-Background}"
Opacity="0.96">
<interactivity:Interaction.Behaviors>
<behaviors:Blur AutomaticallyStart="True"
Delay="0"
Value="3"
Duration="0" />
</interactivity:Interaction.Behaviors>
<media:UIElementExtensions.VisualFactory>
<media:PipelineVisualFactory Source="{media:BackdropSource}">
<media:BlurEffect Amount="8" />
</media:PipelineVisualFactory>
</media:UIElementExtensions.VisualFactory>
</Border>
</controls:DropShadowPanel>
@ -160,58 +171,79 @@
<Grid Grid.Row="0"
Background="{ThemeResource SampleIconBacking}">
<Image Width="240"
x:Name="MoreInfoImage"
<Image x:Name="MoreInfoImage"
Width="240"
Height="160"
Source="{Binding Icon}" />
</Grid>
<StackPanel Grid.Row="1">
<TextBlock Margin="0, 10"
<TextBlock Margin="0,10"
FontSize="14"
FontWeight="SemiBold"
Text="{Binding Name}"
TextTrimming="CharacterEllipsis" />
<TextBlock FontSize="12"
Text="{Binding About}"
TextWrapping="Wrap" />
Text="{Binding About}"
TextWrapping="Wrap" />
<Border Margin="0,10,0,0"
Opacity="1"
HorizontalAlignment="Left"
Background="{StaticResource Brush-Blue-01}"
Opacity="1"
Visibility="{Binding BadgeUpdateVersionRequired, Converter={StaticResource EmptyStringToObject}}">
<TextBlock Margin="2"
FontSize="10"
HorizontalAlignment="Center"
VerticalAlignment="Bottom"
FontSize="10"
Foreground="{ThemeResource Brush-Main}"
Text="{Binding BadgeUpdateVersionRequired}" />
<animations:Implicit.HideAnimations>
<animations:OpacityAnimation To="0" Duration="0:0:0.01"></animations:OpacityAnimation>
<animations:OpacityAnimation To="0"
Duration="0:0:0.01" />
</animations:Implicit.HideAnimations>
<animations:Implicit.ShowAnimations>
<animations:OpacityAnimation From="0" To="1" Duration="0:0:0.4" Delay="0:0:0.2" SetInitialValueBeforeDelay="True"></animations:OpacityAnimation>
<animations:TranslationAnimation From="0, 20, 0" To="0" Duration="0:0:0.3" Delay="0:0:0.2"></animations:TranslationAnimation>
<animations:OpacityAnimation Delay="0:0:0.2"
From="0"
To="1"
Duration="0:0:0.4" />
<animations:TranslationAnimation Delay="0:0:0.2"
From="0, 20, 0"
To="0"
Duration="0:0:0.3" />
</animations:Implicit.ShowAnimations>
</Border>
<animations:Implicit.ShowAnimations>
<animations:OpacityAnimation From="0" To="1" Duration="0:0:0.4" Delay="0:0:0.2" SetInitialValueBeforeDelay="True"></animations:OpacityAnimation>
<animations:TranslationAnimation From="0, 20, 0" To="0" Duration="0:0:0.3" Delay="0:0:0.2"></animations:TranslationAnimation>
<animations:OpacityAnimation Delay="0:0:0.2"
From="0"
To="1"
Duration="0:0:0.4" />
<animations:TranslationAnimation Delay="0:0:0.2"
From="0, 20, 0"
To="0"
Duration="0:0:0.3" />
</animations:Implicit.ShowAnimations>
</StackPanel>
</Grid>
</Grid>
<animations:Implicit.ShowAnimations>
<animations:OpacityAnimation From="0" To="1" Duration="0:0:0.3"></animations:OpacityAnimation>
<animations:ScaleAnimation From="0.5" To="1" Duration="0:0:0.3"></animations:ScaleAnimation>
<animations:OpacityAnimation From="0"
To="1"
Duration="0:0:0.3" />
<animations:ScaleAnimation From="0.5"
To="1"
Duration="0:0:0.3" />
</animations:Implicit.ShowAnimations>
<animations:Implicit.HideAnimations>
<animations:OpacityAnimation To="0" From="1" Duration="0:0:0.2"></animations:OpacityAnimation>
<animations:ScaleAnimation To="0.5" From="1" Duration="0:0:0.2"></animations:ScaleAnimation>
<animations:OpacityAnimation From="1"
To="0"
Duration="0:0:0.2" />
<animations:ScaleAnimation From="1"
To="0.5"
Duration="0:0:0.2" />
</animations:Implicit.HideAnimations>
</Grid>
</Canvas>

173
Microsoft.Toolkit.Uwp.SampleApp/Styles/Custom/PivotHeaderItemUnderlineStyle.xaml
Просмотреть файл

@ -1,14 +1,17 @@
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:CustomPivotHeaderItem">
<Style x:Name="PivotHeaderItemUnderlineStyle" TargetType="PivotHeaderItem">
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:CustomPivotHeaderItem">
<Style x:Name="PivotHeaderItemUnderlineStyle"
TargetType="PivotHeaderItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="PivotHeaderItem">
<Grid x:Name="Grid" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}">
<Grid x:Name="Grid"
Padding="{TemplateBinding Padding}"
Background="{TemplateBinding Background}">
<Grid.Resources>
<Style x:Key="BaseContentPresenterStyle" TargetType="ContentPresenter">
<Style x:Key="BaseContentPresenterStyle"
TargetType="ContentPresenter">
<Setter Property="FontFamily" Value="XamlAutoFontFamily" />
<Setter Property="FontWeight" Value="SemiBold" />
<Setter Property="FontSize" Value="15" />
@ -17,25 +20,58 @@
<Setter Property="TextLineBounds" Value="Full" />
<Setter Property="OpticalMarginAlignment" Value="TrimSideBearings" />
</Style>
<Style x:Key="BodyContentPresenterStyle" TargetType="ContentPresenter" BasedOn="{StaticResource BaseContentPresenterStyle}">
<Style x:Key="BodyContentPresenterStyle"
BasedOn="{StaticResource BaseContentPresenterStyle}"
TargetType="ContentPresenter">
<Setter Property="FontFamily" Value="{ThemeResource PivotHeaderItemFontFamily}" />
<Setter Property="FontWeight" Value="{ThemeResource PivotHeaderItemThemeFontWeight}" />
<Setter Property="FontSize" Value="{ThemeResource PivotHeaderItemFontSize}" />
</Style>
</Grid.Resources>
<Grid.RenderTransform>
<TranslateTransform x:Name="ContentPresenterTranslateTransform" />
</Grid.RenderTransform>
<ContentPresenter x:Name="ContentPresenter"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
FontFamily="{TemplateBinding FontFamily}"
FontSize="{TemplateBinding FontSize}"
FontWeight="{TemplateBinding FontWeight}" />
<Rectangle x:Name="FocusPipe"
Height="2"
HorizontalAlignment="Stretch"
VerticalAlignment="Bottom"
Fill="{ThemeResource PivotHeaderItemFocusPipeFill}"
Visibility="Collapsed" />
<Rectangle x:Name="UnderScore"
Height="2"
HorizontalAlignment="Stretch"
VerticalAlignment="Bottom"
Fill="{ThemeResource SystemControlForegroundBaseHighBrush}"
Visibility="Collapsed" />
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="SelectionStates">
<VisualStateGroup.Transitions>
<VisualTransition From="Unselected" To="UnselectedLocked" GeneratedDuration="0:0:0.33" />
<VisualTransition From="UnselectedLocked" To="Unselected" GeneratedDuration="0:0:0.33" />
<VisualTransition GeneratedDuration="0:0:0.33"
From="Unselected"
To="UnselectedLocked" />
<VisualTransition GeneratedDuration="0:0:0.33"
From="UnselectedLocked"
To="Unselected" />
</VisualStateGroup.Transitions>
<VisualState x:Name="Disabled">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotHeaderItemForegroundDisabled}" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource PivotHeaderItemForegroundDisabled}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotHeaderItemBackgroundDisabled}" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid"
Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource PivotHeaderItemBackgroundDisabled}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
@ -43,71 +79,97 @@
<VisualState x:Name="UnselectedLocked">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="ContentPresenterTranslateTransform"
Storyboard.TargetProperty="X"
Duration="0"
To="{ThemeResource PivotHeaderItemLockedTranslation}" />
Storyboard.TargetProperty="X"
To="{ThemeResource PivotHeaderItemLockedTranslation}"
Duration="0" />
<DoubleAnimation Storyboard.TargetName="ContentPresenter"
Storyboard.TargetProperty="(UIElement.Opacity)"
Duration="0"
To="0" />
Storyboard.TargetProperty="(UIElement.Opacity)"
To="0"
Duration="0" />
</Storyboard>
</VisualState>
<VisualState x:Name="Selected">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemBaseHighColor}" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource SystemBaseHighColor}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="UnderScore" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="UnderScore"
Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0"
Value="Visible" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotHeaderItemBackgroundSelected}" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid"
Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource PivotHeaderItemBackgroundSelected}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="UnselectedPointerOver">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotHeaderItemForegroundUnselectedPointerOver}" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource PivotHeaderItemForegroundUnselectedPointerOver}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotHeaderItemBackgroundUnselectedPointerOver}" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid"
Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource PivotHeaderItemBackgroundUnselectedPointerOver}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="SelectedPointerOver">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemBaseMediumColor}" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource SystemBaseMediumColor}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="UnderScore" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="UnderScore"
Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0"
Value="Visible" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotHeaderItemBackgroundSelectedPointerOver}" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid"
Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource PivotHeaderItemBackgroundSelectedPointerOver}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="UnselectedPressed">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotHeaderItemForegroundUnselectedPressed}" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource PivotHeaderItemForegroundUnselectedPressed}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotHeaderItemBackgroundUnselectedPressed}" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid"
Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource PivotHeaderItemBackgroundUnselectedPressed}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="SelectedPressed">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemBaseMediumHighColor}" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource SystemBaseMediumHighColor}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotHeaderItemBackgroundSelectedPressed}" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid"
Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource PivotHeaderItemBackgroundSelectedPressed}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="UnderScore" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="UnderScore"
Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0"
Value="Visible" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
@ -121,25 +183,6 @@
<VisualState x:Name="Unfocused" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid.RenderTransform>
<TranslateTransform x:Name="ContentPresenterTranslateTransform" />
</Grid.RenderTransform>
<ContentPresenter x:Name="ContentPresenter"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
FontSize="{TemplateBinding FontSize}"
FontFamily="{TemplateBinding FontFamily}"
FontWeight="{TemplateBinding FontWeight}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
<Rectangle x:Name="FocusPipe"
Fill="{ThemeResource PivotHeaderItemFocusPipeFill}"
Height="2"
VerticalAlignment="Bottom"
HorizontalAlignment="Stretch"
Visibility="Collapsed" />
<Rectangle x:Name="UnderScore" HorizontalAlignment="Stretch"
VerticalAlignment="Bottom" Height="2" Visibility="Collapsed" Fill="{ThemeResource SystemControlForegroundBaseHighBrush}" />
</Grid>
</ControlTemplate>
</Setter.Value>

11
Microsoft.Toolkit.Uwp.SampleApp/Styles/Generic.xaml
Просмотреть файл

@ -1,7 +1,6 @@
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:controls="using:Microsoft.Toolkit.Uwp.SampleApp.Controls"
xmlns:toolkitControls="using:Microsoft.Toolkit.Uwp.UI.Controls"
xmlns:animations="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:extensions="using:Microsoft.Toolkit.Uwp.UI.Extensions"
@ -135,13 +134,9 @@
<Setter Property="Transitions" Value="{x:Null}"></Setter>
<Setter Property="animations:Implicit.ShowAnimations">
<Setter.Value>
<animations:AnimationCollection>
<animations:OpacityAnimation Duration="0:0:0.2"
Delay="0:0:0.2"
SetInitialValueBeforeDelay="True"
From="0"
To="1"></animations:OpacityAnimation>
</animations:AnimationCollection>
<animations:ImplicitAnimationSet>
<animations:OpacityAnimation Duration="0:0:0.2" Delay="0:0:0.2" From="0" To="1"/>
</animations:ImplicitAnimationSet>
</Setter.Value>
</Setter>
<Setter Property="Template">

634
Microsoft.Toolkit.Uwp.UI.Animations/AnimationSet.cs
Просмотреть файл

@ -1,634 +0,0 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
using System.Collections.Generic;
using System.Reflection;
using System.Threading.Tasks;
using Windows.UI.Composition;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Hosting;
using Windows.UI.Xaml.Media.Animation;
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <summary>
/// Defines an object for storing and managing CompositionAnimations for an element
/// </summary>
public class AnimationSet : IDisposable
{
private List<AnimationSet> _animationSets;
private Compositor _compositor;
private CompositionScopedBatch _batch;
private Dictionary<string, CompositionAnimation> _compositionAnimations;
private List<EffectAnimationDefinition> _compositionEffectAnimations;
private Dictionary<string, object> _directCompositionPropertyChanges;
private List<EffectDirectPropertyChangeDefinition> _directCompositionEffectPropertyChanges;
private Storyboard _storyboard;
private Dictionary<string, Timeline> _storyboardAnimations;
private List<AnimationTask> _animationTasks;
private TaskCompletionSource<bool> _animationTCS;
private bool _storyboardCompleted;
private bool _compositionCompleted;
/// <summary>
/// Gets or sets a value indicating whether composition must be use even on SDK > 10586
/// </summary>
public static bool UseComposition { get; set; }
/// <summary>
/// Gets the <see cref="Visual"/> object that backs the XAML element
/// </summary>
public Visual Visual { get; private set; }
/// <summary>
/// Gets the <see cref="UIElement"/>
/// </summary>
public UIElement Element { get; private set; }
/// <summary>
/// Gets the current state of the AnimationSet
/// </summary>
public AnimationSetState State { get; private set; }
/// <summary>
/// Initializes a new instance of the <see cref="AnimationSet"/> class.
/// </summary>
/// <param name="element">The associated element</param>
public AnimationSet(UIElement element)
{
if (element == null)
{
throw new NullReferenceException("Element must not be null");
}
var visual = ElementCompositionPreview.GetElementVisual(element);
if (visual == null)
{
throw new NullReferenceException("Visual must not be null");
}
Visual = visual;
if (Visual.Compositor == null)
{
throw new NullReferenceException("Visual must have a compositor");
}
Element = element;
State = AnimationSetState.NotStarted;
_compositor = Visual.Compositor;
_compositionAnimations = new Dictionary<string, CompositionAnimation>();
_compositionEffectAnimations = new List<EffectAnimationDefinition>();
_directCompositionPropertyChanges = new Dictionary<string, object>();
_directCompositionEffectPropertyChanges = new List<EffectDirectPropertyChangeDefinition>();
_animationSets = new List<AnimationSet>();
_storyboard = new Storyboard();
_storyboardAnimations = new Dictionary<string, Timeline>();
_animationTasks = new List<AnimationTask>();
}
/// <summary>
/// Occurs when all animations have completed
/// </summary>
public event EventHandler<AnimationSetCompletedEventArgs> Completed;
/// <summary>
/// Stats all animations. This method is not awaitable.
/// </summary>
public async void Start()
{
await StartAsync();
}
/// <summary>
/// Starts all animations and returns an awaitable task.
/// </summary>
/// <returns>A <see cref="Task"/> that can be awaited until all animations have completed</returns>
public async Task<bool> StartAsync()
{
if (_animationTCS == null || _animationTCS.Task.IsCompleted)
{
if (_animationTCS != null && _animationTCS.Task.IsCompleted)
{
foreach (var set in _animationSets)
{
set.State = AnimationSetState.NotStarted;
set._animationTCS = null;
}
}
State = AnimationSetState.Running;
_animationTCS = new TaskCompletionSource<bool>();
}
else
{
return await _animationTCS.Task;
}
foreach (var set in _animationSets)
{
if (set.State != AnimationSetState.Completed)
{
var completed = await set.StartAsync();
if (!completed)
{
// the animation was stopped
return await _animationTCS.Task;
}
}
}
foreach (var task in _animationTasks)
{
if (task.Task != null && !task.Task.IsCompleted)
{
await task.Task;
}
// if _animationSet is stopped while task was running
if (State == AnimationSetState.Stopped)
{
return await _animationTCS.Task;
}
}
_animationTasks.Clear();
foreach (var property in _directCompositionPropertyChanges)
{
typeof(Visual).GetProperty(property.Key).SetValue(Visual, property.Value);
}
foreach (var definition in _directCompositionEffectPropertyChanges)
{
definition.EffectBrush.Properties.InsertScalar(definition.PropertyName, definition.Value);
}
if (_compositionAnimations.Count > 0 || _compositionEffectAnimations.Count > 0)
{
if (_batch != null)
{
if (!_batch.IsEnded)
{
_batch.End();
}
_batch.Completed -= Batch_Completed;
}
_batch = _compositor.CreateScopedBatch(CompositionBatchTypes.Animation);
_batch.Completed += Batch_Completed;
foreach (var anim in _compositionAnimations)
{
Visual.StartAnimation(anim.Key, anim.Value);
}
foreach (var effect in _compositionEffectAnimations)
{
effect.EffectBrush.StartAnimation(effect.PropertyName, effect.Animation);
}
_compositionCompleted = false;
_batch.End();
}
else
{
_compositionCompleted = true;
}
if (_storyboardAnimations.Count > 0)
{
_storyboardCompleted = false;
_storyboard.Completed -= Storyboard_Completed;
_storyboard.Completed += Storyboard_Completed;
_storyboard.Begin();
}
else
{
_storyboardCompleted = true;
}
HandleCompleted();
return await _animationTCS.Task;
}
/// <summary>
/// Stops all animations.
/// </summary>
public void Stop()
{
foreach (var set in _animationSets)
{
if (set.State != AnimationSetState.Completed)
{
set.Stop();
}
}
if (_batch != null)
{
if (!_batch.IsEnded)
{
_batch.End();
}
_batch.Completed -= Batch_Completed;
}
foreach (var anim in _compositionAnimations)
{
Visual.StopAnimation(anim.Key);
}
foreach (var effect in _compositionEffectAnimations)
{
effect.EffectBrush.StopAnimation(effect.PropertyName);
}
_storyboard.Pause();
HandleCompleted(true);
_animationTCS = null;
}
/// <summary>
/// Wait for existing animations to complete before running new animations
/// </summary>
/// <returns>AnimationSet to allow chaining</returns>
public AnimationSet Then()
{
var savedAnimationSet = new AnimationSet(Element);
savedAnimationSet._compositionAnimations = _compositionAnimations;
savedAnimationSet._compositionEffectAnimations = _compositionEffectAnimations;
savedAnimationSet._directCompositionPropertyChanges = _directCompositionPropertyChanges;
savedAnimationSet._directCompositionEffectPropertyChanges = _directCompositionEffectPropertyChanges;
savedAnimationSet._storyboard = _storyboard;
savedAnimationSet._storyboardAnimations = _storyboardAnimations;
_animationTasks.ForEach(t => t.AnimationSet = savedAnimationSet);
savedAnimationSet._animationTasks = _animationTasks;
_animationSets.Add(savedAnimationSet);
_compositionAnimations = new Dictionary<string, CompositionAnimation>();
_compositionEffectAnimations = new List<EffectAnimationDefinition>();
_directCompositionPropertyChanges = new Dictionary<string, object>();
_directCompositionEffectPropertyChanges = new List<EffectDirectPropertyChangeDefinition>();
_storyboard = new Storyboard();
_storyboardAnimations = new Dictionary<string, Timeline>();
_animationTasks = new List<AnimationTask>();
return this;
}
/// <summary>
/// Overwrites the duration on all animations after last Then()
/// to the specified value
/// </summary>
/// <param name="duration">The duration in milliseconds</param>
/// <returns>AnimationSet to allow chaining</returns>
public AnimationSet SetDuration(double duration)
{
if (duration <= 0)
{
duration = 1;
}
return SetDuration(TimeSpan.FromMilliseconds(duration));
}
/// <summary>
/// Overwrites the duration on all animations after last Then()
/// to the specified value
/// </summary>
/// <param name="duration"><see cref="TimeSpan"/> for the duration</param>
/// <returns>AnimationSet to allow chaining</returns>
public AnimationSet SetDuration(TimeSpan duration)
{
foreach (var task in _animationTasks)
{
task.Duration = duration;
}
foreach (var anim in _compositionAnimations)
{
var animation = anim.Value as KeyFrameAnimation;
if (animation != null)
{
animation.Duration = duration;
}
}
foreach (var effect in _compositionEffectAnimations)
{
var animation = effect.Animation as KeyFrameAnimation;
if (animation != null)
{
animation.Duration = duration;
}
}
foreach (var timeline in _storyboardAnimations)
{
var animation = timeline.Value as DoubleAnimation;
if (animation != null)
{
animation.Duration = duration;
}
}
return this;
}
/// <summary>
/// Overwrites the duration on all animations to the specified value
/// </summary>
/// <param name="duration">The duration in milliseconds</param>
/// <returns>AnimationSet to allow chaining</returns>
public AnimationSet SetDurationForAll(double duration)
{
foreach (var set in _animationSets)
{
set.SetDuration(duration);
}
return SetDuration(duration);
}
/// <summary>
/// Overwrites the duration on all animations to the specified value
/// </summary>
/// <param name="duration"><see cref="TimeSpan"/> for the duration</param>
/// <returns>AnimationSet to allow chaining</returns>
public AnimationSet SetDurationForAll(TimeSpan duration)
{
foreach (var set in _animationSets)
{
set.SetDuration(duration);
}
return SetDuration(duration);
}
/// <summary>
/// Overwrites the delay time on all animations after last Then()
/// to the specified value
/// </summary>
/// <param name="delayTime">The delay time in milliseconds</param>
/// <returns>AnimationSet to allow chaining</returns>
public AnimationSet SetDelay(double delayTime)
{
if (delayTime < 0)
{
delayTime = 0;
}
return SetDelay(TimeSpan.FromMilliseconds(delayTime));
}
/// <summary>
/// Overwrites the delay time on all animations after last Then()
/// to the specified value
/// </summary>
/// <param name="delayTime"><see cref="TimeSpan"/> for how much to delay</param>
/// <returns>AnimationSet to allow chaining</returns>
public AnimationSet SetDelay(TimeSpan delayTime)
{
foreach (var task in _animationTasks)
{
task.Delay = delayTime;
}
foreach (var anim in _compositionAnimations)
{
var animation = anim.Value as KeyFrameAnimation;
if (animation != null)
{
animation.DelayTime = delayTime;
}
}
foreach (var effect in _compositionEffectAnimations)
{
var animation = effect.Animation as KeyFrameAnimation;
if (animation != null)
{
animation.DelayTime = delayTime;
}
}
foreach (var timeline in _storyboardAnimations)
{
var animation = timeline.Value as DoubleAnimation;
if (animation != null)
{
animation.BeginTime = delayTime;
}
}
return this;
}
/// <summary>
/// Overwrites the delay time on all animations to the specified value
/// </summary>
/// <param name="delayTime">The delay time in milliseconds</param>
/// <returns>AnimationSet to allow chaining</returns>
public AnimationSet SetDelayForAll(double delayTime)
{
foreach (var set in _animationSets)
{
set.SetDelay(delayTime);
}
return SetDelay(delayTime);
}
/// <summary>
/// Overwrites the delay time on all animations to the specified value
/// </summary>
/// <param name="delayTime"><see cref="TimeSpan"/> for how much to delay</param>
/// <returns>AnimationSet to allow chaining</returns>
public AnimationSet SetDelayForAll(TimeSpan delayTime)
{
foreach (var set in _animationSets)
{
set.SetDelay(delayTime);
}
return SetDelay(delayTime);
}
/// <summary>
/// Adds a composition animation to be run on <see cref="StartAsync"/>
/// </summary>
/// <param name="propertyName">The property to be animated on the backing Visual</param>
/// <param name="animation">The <see cref="CompositionAnimation"/> to be applied</param>
public void AddCompositionAnimation(string propertyName, CompositionAnimation animation)
{
_compositionAnimations[propertyName] = animation;
}
/// <summary>
/// Removes a composition animation from being run on <see cref="Visual"/> property
/// </summary>
/// <param name="propertyName">The property that no longer needs to be animated</param>
public void RemoveCompositionAnimation(string propertyName)
{
if (_compositionAnimations.ContainsKey(propertyName))
{
_compositionAnimations.Remove(propertyName);
}
}
/// <summary>
/// Adds a composition effect animation to be run on backing <see cref="Visual"/>
/// </summary>
/// <param name="effectBrush">The <see cref="CompositionEffectBrush"/> that will have a property animated</param>
/// <param name="animation">The animation to be applied</param>
/// <param name="propertyName">The property of the effect to be animated</param>
public void AddCompositionEffectAnimation(CompositionObject effectBrush, CompositionAnimation animation, string propertyName)
{
var effect = new EffectAnimationDefinition()
{
EffectBrush = effectBrush,
Animation = animation,
PropertyName = propertyName
};
_compositionEffectAnimations.Add(effect);
}
/// <summary>
/// Adds a composition property that will change instantaneously
/// </summary>
/// <param name="propertyName">The property to be animated on the backing Visual</param>
/// <param name="value">The value to be applied</param>
public void AddCompositionDirectPropertyChange(string propertyName, object value)
{
_directCompositionPropertyChanges[propertyName] = value;
}
/// <summary>
/// Removes a composition property change
/// </summary>
/// <param name="propertyName">The property that no longer needs to be changed</param>
public void RemoveCompositionDirectPropertyChange(string propertyName)
{
if (_directCompositionPropertyChanges.ContainsKey(propertyName))
{
_directCompositionPropertyChanges.Remove(propertyName);
}
}
/// <summary>
/// Adds a storyboard animation to be run
/// </summary>
/// <param name="propertyPath">The property to be animated with Storyboards</param>
/// <param name="timeline">The timeline object to be added to storyboard</param>
public void AddStoryboardAnimation(string propertyPath, Timeline timeline)
{
if (_storyboardAnimations.ContainsKey(propertyPath))
{
var previousAnimation = _storyboardAnimations[propertyPath];
_storyboard.Children.Remove(previousAnimation);
_storyboardAnimations.Remove(propertyPath);
}
_storyboardAnimations.Add(propertyPath, timeline);
_storyboard.Children.Add(timeline);
Storyboard.SetTarget(timeline, Element);
Storyboard.SetTargetProperty(timeline, propertyPath);
}
/// <summary>
/// Dispose resources.
/// </summary>
public void Dispose()
{
_animationTCS = null;
}
/// <summary>
/// Adds a <see cref="AnimationTask"/> to the AnimationSet that
/// will run add an animation once completed. Useful when an animation
/// needs to do asynchronous initialization before running
/// </summary>
/// <param name="animationTask">The <see cref="AnimationTask"/> to be added</param>
internal void AddAnimationThroughTask(AnimationTask animationTask)
{
_animationTasks.Add(animationTask);
}
/// <summary>
/// Adds an effect property change to be run on <see cref="StartAsync"/>
/// </summary>
/// <param name="effectBrush">The <see cref="CompositionObject"/> that will have a property changed</param>
/// <param name="value">The value to be applied</param>
/// <param name="propertyName">The property of the effect to be animated</param>
internal void AddEffectDirectPropertyChange(CompositionObject effectBrush, float value, string propertyName)
{
var definition = new EffectDirectPropertyChangeDefinition()
{
EffectBrush = effectBrush,
Value = value,
PropertyName = propertyName
};
_directCompositionEffectPropertyChanges.Add(definition);
}
private void Storyboard_Completed(object sender, object e)
{
_storyboardCompleted = true;
_storyboard.Completed -= Storyboard_Completed;
HandleCompleted();
}
private void Batch_Completed(object sender, CompositionBatchCompletedEventArgs args)
{
_compositionCompleted = true;
_batch.Completed -= Batch_Completed;
HandleCompleted();
}
private void HandleCompleted(bool stopped = false)
{
var completed = _storyboardCompleted && _compositionCompleted;
if (!completed && !stopped)
{
return;
}
if (_storyboardCompleted && _compositionCompleted)
{
State = AnimationSetState.Completed;
}
else
{
State = AnimationSetState.Stopped;
}
if (_animationTCS != null && !_animationTCS.Task.IsCompleted)
{
_animationTCS.SetResult(State == AnimationSetState.Completed);
Completed?.Invoke(this, new AnimationSetCompletedEventArgs() { Completed = _storyboardCompleted && _compositionCompleted });
}
}
}
}

19
Microsoft.Toolkit.Uwp.UI.Animations/AnimationSetCompletedEventArgs.cs
Просмотреть файл

@ -1,19 +0,0 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <summary>
/// AnimationSet Completed EventArgs.
/// </summary>
public class AnimationSetCompletedEventArgs : EventArgs
{
/// <summary>
/// Gets a value indicating whether the animation completed
/// </summary>
public bool Completed { get; internal set; }
}
}

32
Microsoft.Toolkit.Uwp.UI.Animations/AnimationSetState.cs
Просмотреть файл

@ -1,32 +0,0 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <summary>
/// States of AnimationSet.
/// </summary>
public enum AnimationSetState
{
/// <summary>
/// The animation has not been started
/// </summary>
NotStarted,
/// <summary>
/// The animation has been started and is in progress
/// </summary>
Running,
/// <summary>
/// The animation has been started and is stopped
/// </summary>
Stopped,
/// <summary>
/// The animation had completed
/// </summary>
Completed
}
}

40
Microsoft.Toolkit.Uwp.UI.Animations/AnimationTask.cs
Просмотреть файл

@ -1,40 +0,0 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
using System.Threading.Tasks;
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <summary>
/// Defines <see cref="AnimationTask"/> which is used by
/// <see cref="AnimationSet"/> to run animations that require
/// asynchronous initialization
/// </summary>
internal class AnimationTask
{
/// <summary>
/// Gets or sets <see cref="Task"/> that will run before any animation
/// and it will add the animation to the AnimationSet once complete
/// </summary>
public Task Task { get; set; }
/// <summary>
/// Gets or sets <see cref="AnimationSet"/> that will run the animation
/// </summary>
public AnimationSet AnimationSet { get; set; }
/// <summary>
/// Gets or sets Duration to be applied to the animation once the task is completed
/// Used when Duration is changed before Task completes
/// </summary>
public TimeSpan? Duration { get; set; }
/// <summary>
/// Gets or sets Delay to be applied to the animation once the task is completed
/// Used when Duration is changed before Task completes
/// </summary>
public TimeSpan? Delay { get; set; }
}
}

794
Microsoft.Toolkit.Uwp.UI.Animations/Builders/AnimationBuilder.Default.cs Normal file
Просмотреть файл

@ -0,0 +1,794 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
#nullable enable
using System;
using System.Numerics;
using Microsoft.Toolkit.Diagnostics;
using Windows.UI.Composition;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Media.Animation;
using static Microsoft.Toolkit.Uwp.UI.Animations.AnimationExtensions;
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <inheritdoc cref="AnimationBuilder"/>
public sealed partial class AnimationBuilder
{
/// <summary>
/// Adds a new anchor point animation for a single axis to the current schedule.
/// </summary>
/// <param name="axis">The target anchor point axis to animate.</param>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public AnimationBuilder AnchorPoint(
Axis axis,
double to,
double? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode)
{
AddCompositionAnimationFactory(Properties.Composition.AnchorPoint(axis), (float)to, (float?)from, delay, duration, easingType, easingMode);
return this;
}
/// <summary>
/// Adds a new anchor point animation for the X and Y axes to the current schedule.
/// </summary>
/// <param name="to">The final point for the animation.</param>
/// <param name="from">The optional starting point for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public AnimationBuilder AnchorPoint(
Vector2 to,
Vector2? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode)
{
AddCompositionAnimationFactory(nameof(Visual.AnchorPoint), to, from, delay, duration, easingType, easingMode);
return this;
}
/// <summary>
/// Adds a new opacity animation to the current schedule.
/// </summary>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder Opacity(
double to,
double? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode,
FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
AddCompositionAnimationFactory(nameof(Visual.Opacity), (float)to, (float?)from, delay, duration, easingType, easingMode);
}
else
{
AddXamlAnimationFactory(nameof(UIElement.Opacity), to, from, delay, duration, easingType, easingMode);
}
return this;
}
/// <summary>
/// Adds a new translation animation for a single axis to the current schedule.
/// </summary>
/// <param name="axis">The target translation axis to animate.</param>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder Translation(
Axis axis,
double to,
double? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode,
FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
AddCompositionAnimationFactory(Properties.Composition.Translation(axis), (float)to, (float?)from, delay, duration, easingType, easingMode);
}
else
{
AddXamlAnimationFactory(Properties.Xaml.Translation(axis), to, from, delay, duration, easingType, easingMode);
}
return this;
}
/// <summary>
/// Adds a new translation animation for the X and Y axes to the current schedule.
/// </summary>
/// <param name="to">The final point for the animation.</param>
/// <param name="from">The optional starting point for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder Translation(
Vector2 to,
Vector2? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode,
FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
AddCompositionAnimationFactory(Properties.Composition.TranslationXY(), to, from, delay, duration, easingType, easingMode);
}
else
{
AddXamlTransformDoubleAnimationFactory(nameof(CompositeTransform.TranslateX), to.X, from?.X, delay, duration, easingType, easingMode);
AddXamlTransformDoubleAnimationFactory(nameof(CompositeTransform.TranslateY), to.Y, from?.Y, delay, duration, easingType, easingMode);
}
return this;
}
/// <summary>
/// Adds a new composition translation animation for all axes to the current schedule.
/// </summary>
/// <param name="to">The final point for the animation.</param>
/// <param name="from">The optional starting point for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public AnimationBuilder Translation(
Vector3 to,
Vector3? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode)
{
return AddCompositionAnimationFactory(Properties.Composition.Translation(), to, from, delay, duration, easingType, easingMode);
}
/// <summary>
/// Adds a new composition offset animation for a single axis to the current schedule.
/// </summary>
/// <param name="axis">The target translation axis to animate.</param>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public AnimationBuilder Offset(
Axis axis,
double to,
double? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode)
{
return AddCompositionAnimationFactory(Properties.Composition.Offset(axis), (float)to, (float?)from, delay, duration, easingType, easingMode);
}
/// <summary>
/// Adds a new composition offset animation for the X and Y axes to the current schedule.
/// </summary>
/// <param name="to">The final point for the animation.</param>
/// <param name="from">The optional starting point for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public AnimationBuilder Offset(
Vector2 to,
Vector2? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode)
{
AddCompositionAnimationFactory(Properties.Composition.OffsetXY(), to, from, delay, duration, easingType, easingMode);
return this;
}
/// <summary>
/// Adds a new composition offset translation animation for all axes to the current schedule.
/// </summary>
/// <param name="to">The final point for the animation.</param>
/// <param name="from">The optional starting point for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public AnimationBuilder Offset(
Vector3 to,
Vector3? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode)
{
return AddCompositionAnimationFactory(nameof(Visual.Offset), to, from, delay, duration, easingType, easingMode);
}
/// <summary>
/// Adds a new uniform scale animation for all axes to the current schedule.
/// </summary>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder Scale(
double to,
double? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode,
FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
Vector3? from3 = from is null ? null : new((float)(double)from);
Vector3 to3 = new((float)to);
AddCompositionAnimationFactory(nameof(Visual.Scale), to3, from3, delay, duration, easingType, easingMode);
}
else
{
AddXamlTransformDoubleAnimationFactory(nameof(CompositeTransform.ScaleX), to, from, delay, duration, easingType, easingMode);
AddXamlTransformDoubleAnimationFactory(nameof(CompositeTransform.ScaleY), to, from, delay, duration, easingType, easingMode);
}
return this;
}
/// <summary>
/// Adds a new scale animation on a specified axis to the current schedule.
/// </summary>
/// <param name="axis">The target scale axis to animate.</param>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder Scale(
Axis axis,
double to,
double? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode,
FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
AddCompositionAnimationFactory(Properties.Composition.Scale(axis), (float)to, (float?)from, delay, duration, easingType, easingMode);
}
else
{
AddXamlTransformDoubleAnimationFactory(Properties.Xaml.Scale(axis), to, from, delay, duration, easingType, easingMode);
}
return this;
}
/// <summary>
/// Adds a new scale animation for the X and Y axes to the current schedule.
/// </summary>
/// <param name="to">The final point for the animation.</param>
/// <param name="from">The optional starting point for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder Scale(
Vector2 to,
Vector2? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode,
FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
AddCompositionAnimationFactory(Properties.Composition.ScaleXY(), to, from, delay, duration, easingType, easingMode);
}
else
{
AddXamlTransformDoubleAnimationFactory(nameof(CompositeTransform.ScaleX), to.X, from?.X, delay, duration, easingType, easingMode);
AddXamlTransformDoubleAnimationFactory(nameof(CompositeTransform.ScaleY), to.Y, from?.Y, delay, duration, easingType, easingMode);
}
return this;
}
/// <summary>
/// Adds a new scale animation for all axes to the current schedule.
/// </summary>
/// <param name="to">The final point for the animation.</param>
/// <param name="from">The optional starting point for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public AnimationBuilder Scale(
Vector3 to,
Vector3? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode)
{
return AddCompositionAnimationFactory(nameof(Visual.Scale), to, from, delay, duration, easingType, easingMode);
}
/// <summary>
/// Adds a new center point animation on a specified axis to the current schedule.
/// </summary>
/// <param name="axis">The target scale axis to animate.</param>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder CenterPoint(
Axis axis,
double to,
double? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode,
FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
AddCompositionAnimationFactory(Properties.Composition.CenterPoint(axis), (float)to, (float?)from, delay, duration, easingType, easingMode);
}
else
{
AddXamlTransformDoubleAnimationFactory(Properties.Xaml.CenterPoint(axis), to, from, delay, duration, easingType, easingMode);
}
return this;
}
/// <summary>
/// Adds a new center point animation for the X and Y axes to the current schedule.
/// </summary>
/// <param name="to">The final point for the animation.</param>
/// <param name="from">The optional starting point for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder CenterPoint(
Vector2 to,
Vector2? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode,
FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
AddCompositionAnimationFactory(Properties.Composition.CenterPointXY(), to, from, delay, duration, easingType, easingMode);
}
else
{
AddXamlTransformDoubleAnimationFactory(nameof(CompositeTransform.CenterX), to.X, from?.X, delay, duration, easingType, easingMode);
AddXamlTransformDoubleAnimationFactory(nameof(CompositeTransform.CenterY), to.Y, from?.Y, delay, duration, easingType, easingMode);
}
return this;
}
/// <summary>
/// Adds a new center point animation for all axes to the current schedule.
/// </summary>
/// <param name="to">The final point for the animation.</param>
/// <param name="from">The optional starting point for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public AnimationBuilder CenterPoint(
Vector3 to,
Vector3? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode)
{
return AddCompositionAnimationFactory(nameof(Visual.CenterPoint), to, from, delay, duration, easingType, easingMode);
}
/// <summary>
/// Adds a new rotation animation to the current schedule.
/// </summary>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder Rotation(
double to,
double? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode,
FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
AddCompositionAnimationFactory(nameof(Visual.RotationAngle), (float)to, (float?)from, delay, duration, easingType, easingMode);
}
else
{
double? fromDegrees = from * Math.PI / 180;
double toDegrees = to * Math.PI / 180;
AddXamlTransformDoubleAnimationFactory(nameof(CompositeTransform.Rotation), toDegrees, fromDegrees, delay, duration, easingType, easingMode);
}
return this;
}
/// <summary>
/// Adds a new rotation animation in degrees to the current schedule.
/// </summary>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder RotationInDegrees(
double to,
double? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode,
FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
AddCompositionAnimationFactory(nameof(Visual.RotationAngleInDegrees), (float)to, (float?)from, delay, duration, easingType, easingMode);
}
else
{
AddXamlTransformDoubleAnimationFactory(nameof(CompositeTransform.Rotation), to, from, delay, duration, easingType, easingMode);
}
return this;
}
/// <summary>
/// Adds a new rotation axis animation to the current schedule.
/// </summary>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public AnimationBuilder RotationAxis(
Vector3 to,
Vector3? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode)
{
return AddCompositionAnimationFactory(nameof(Visual.RotationAxis), to, from, delay, duration, easingType, easingMode);
}
/// <summary>
/// Adds a new orientation animation to the current schedule.
/// </summary>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public AnimationBuilder Orientation(
Quaternion to,
Quaternion? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode)
{
return AddCompositionAnimationFactory(nameof(Visual.Orientation), to, from, delay, duration, easingType, easingMode);
}
/// <summary>
/// Adds a new transform animation to the current schedule.
/// </summary>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public AnimationBuilder Transform(
Matrix4x4 to,
Matrix4x4? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode)
{
if (!Matrix4x4.Decompose(to, out Vector3 toScale, out Quaternion toRotation, out Vector3 toTranslation))
{
ThrowHelper.ThrowArgumentException("The destination matrix could not be decomposed");
}
Vector3? fromScale = null;
Quaternion? fromRotation = null;
Vector3? fromTranslation = null;
if (from.HasValue)
{
if (!Matrix4x4.Decompose(from.GetValueOrDefault(), out Vector3 scale3, out Quaternion rotation4, out Vector3 translation3))
{
ThrowHelper.ThrowArgumentException("The initial matrix could not be decomposed");
}
fromScale = scale3;
fromRotation = rotation4;
fromTranslation = translation3;
}
Scale(toScale, fromScale, delay, duration, easingType, easingMode);
Orientation(toRotation, fromRotation, delay, duration, easingType, easingMode);
Translation(toTranslation, fromTranslation, delay, duration, easingType, easingMode);
return this;
}
/// <summary>
/// Adds a new clip animation to the current schedule.
/// </summary>
/// <param name="side">The clip size to animate.</param>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public AnimationBuilder Clip(
Side side,
double to,
double? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode)
{
CompositionClipScalarAnimation animation = new(
Properties.Composition.Clip(side),
(float)to,
(float?)from,
delay ?? DefaultDelay,
duration ?? DefaultDuration,
easingType,
easingMode);
this.compositionAnimationFactories.Add(animation);
return this;
}
/// <summary>
/// Adds a new clip animation to the current schedule.
/// </summary>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public AnimationBuilder Clip(
Thickness to,
Thickness? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode)
{
this.compositionAnimationFactories.Add(new CompositionClipScalarAnimation(
nameof(InsetClip.LeftInset),
(float)to.Left,
(float?)from?.Left,
delay ?? DefaultDelay,
duration ?? DefaultDuration,
easingType,
easingMode));
this.compositionAnimationFactories.Add(new CompositionClipScalarAnimation(
nameof(InsetClip.TopInset),
(float)to.Top,
(float?)from?.Top,
delay ?? DefaultDelay,
duration ?? DefaultDuration,
easingType,
easingMode));
this.compositionAnimationFactories.Add(new CompositionClipScalarAnimation(
nameof(InsetClip.RightInset),
(float)to.Right,
(float?)from?.Right,
delay ?? DefaultDelay,
duration ?? DefaultDuration,
easingType,
easingMode));
this.compositionAnimationFactories.Add(new CompositionClipScalarAnimation(
nameof(InsetClip.BottomInset),
(float)to.Bottom,
(float?)from?.Bottom,
delay ?? DefaultDelay,
duration ?? DefaultDuration,
easingType,
easingMode));
return this;
}
/// <summary>
/// Adds a new size animation for a single axis to the current schedule.
/// </summary>
/// <param name="axis">The target size axis to animate.</param>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder Size(
Axis axis,
double to,
double? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode,
FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
AddCompositionAnimationFactory(Properties.Composition.Size(axis), (float)to, (float?)from, delay, duration, easingType, easingMode);
}
else
{
AddXamlAnimationFactory(Properties.Xaml.Size(axis), to, from, delay, duration, easingType, easingMode);
}
return this;
}
/// <summary>
/// Adds a new size animation for the X and Y axes to the current schedule.
/// </summary>
/// <param name="to">The final point for the animation.</param>
/// <param name="from">The optional starting point for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The optional animation duration.</param>
/// <param name="easingType">The optional easing function type for the animation.</param>
/// <param name="easingMode">The optional easing function mode for the animation.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder Size(
Vector2 to,
Vector2? from = null,
TimeSpan? delay = null,
TimeSpan? duration = null,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode,
FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
AddCompositionAnimationFactory(Properties.Composition.Size(), to, from, delay, duration, easingType, easingMode);
}
else
{
AddXamlAnimationFactory(nameof(FrameworkElement.Width), to.X, from?.X, delay, duration, easingType, easingMode);
AddXamlAnimationFactory(nameof(FrameworkElement.Height), to.Y, from?.Y, delay, duration, easingType, easingMode);
}
return this;
}
}
}

55
Microsoft.Toolkit.Uwp.UI.Animations/Builders/AnimationBuilder.External.cs Normal file
Просмотреть файл

@ -0,0 +1,55 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
#nullable enable
using Windows.UI.Composition;
using Windows.UI.Xaml.Media.Animation;
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <inheritdoc cref="AnimationBuilder"/>
public sealed partial class AnimationBuilder
{
/// <summary>
/// Adds a new external animation to the current schedule, which will be executed on the same
/// target object the current <see cref="AnimationBuilder"/> instance will be invoked upon.
/// </summary>
/// <param name="animation">The external <see cref="CompositionAnimation"/> instance to add to the schedule.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder ExternalAnimation(CompositionAnimation animation)
{
this.compositionAnimationFactories.Add(new ExternalCompositionAnimation(null, animation));
return this;
}
/// <summary>
/// Adds a new external animation to the current schedule, which will be executed on a given
/// <see cref="CompositionObject"/> when the current <see cref="AnimationBuilder"/> instance is invoked.
/// </summary>
/// <param name="target">The <see cref="CompositionObject"/> target to invoke the animation upon.</param>
/// <param name="animation">The external <see cref="CompositionAnimation"/> instance to add to the schedule.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder ExternalAnimation(CompositionObject target, CompositionAnimation animation)
{
this.compositionAnimationFactories.Add(new ExternalCompositionAnimation(target, animation));
return this;
}
/// <summary>
/// Adds a new external animation to the current schedule, which will be executed on the same
/// target object the current <see cref="AnimationBuilder"/> instance will be invoked upon.
/// </summary>
/// <param name="animation">The external <see cref="Timeline"/> instance to add to the schedule.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder ExternalAnimation(Timeline animation)
{
this.xamlAnimationFactories.Add(new ExternalXamlAnimation(animation));
return this;
}
}
}

338
Microsoft.Toolkit.Uwp.UI.Animations/Builders/AnimationBuilder.Factories.cs Normal file
Просмотреть файл

@ -0,0 +1,338 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
using System.Diagnostics.Contracts;
using System.Numerics;
using System.Runtime.CompilerServices;
using Microsoft.Toolkit.Diagnostics;
using Windows.Foundation;
using Windows.UI;
using Windows.UI.Composition;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Media.Animation;
#nullable enable
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <inheritdoc cref="AnimationBuilder"/>
public sealed partial class AnimationBuilder
{
/// <summary>
/// An interface for factories of XAML animations.
/// </summary>
internal interface IXamlAnimationFactory
{
/// <summary>
/// Gets a <see cref="Timeline"/> instance representing the animation to start.
/// </summary>
/// <param name="targetHint">The suggested target <see cref="DependencyObject"/> instance to animate.</param>
/// <returns>A <see cref="Timeline"/> instance with the specified animation.</returns>
Timeline GetAnimation(DependencyObject targetHint);
}
/// <summary>
/// An interface for factories of composition animations.
/// </summary>
internal interface ICompositionAnimationFactory
{
/// <summary>
/// Gets a <see cref="CompositionAnimation"/> instance representing the animation to start.
/// </summary>
/// <param name="targetHint">The suggested target <see cref="CompositionObject"/> instance to animate.</param>
/// <param name="target">An optional <see cref="CompositionObject"/> instance to animate instead of the suggested one.</param>
/// <returns>A <see cref="CompositionAnimation"/> instance with the specified animation.</returns>
/// <remarks>
/// The separate <paramref name="target"/> parameter is needed because unlike with XAML animations, composition animations
/// can't store the target instance internally, and need to be started on the target object directly. This means that custom
/// animation factories that want to target an external object need to return that object separately to inform the callers.
/// </remarks>
CompositionAnimation GetAnimation(CompositionObject targetHint, out CompositionObject? target);
}
/// <summary>
/// A model representing a generic animation for a target object.
/// </summary>
private sealed record AnimationFactory<T>(
string Property,
T To,
T? From,
TimeSpan Delay,
TimeSpan Duration,
EasingType EasingType,
EasingMode EasingMode)
: ICompositionAnimationFactory, IXamlAnimationFactory
where T : unmanaged
{
/// <inheritdoc/>
public CompositionAnimation GetAnimation(CompositionObject targetHint, out CompositionObject? target)
{
CompositionEasingFunction? easingFunction = targetHint.Compositor.TryCreateEasingFunction(EasingType, EasingMode);
target = null;
if (typeof(T) == typeof(bool))
{
return targetHint.Compositor.CreateBooleanKeyFrameAnimation(
Property,
GetToAs<bool>(),
GetFromAs<bool>(),
Delay,
Duration);
}
if (typeof(T) == typeof(float))
{
return targetHint.Compositor.CreateScalarKeyFrameAnimation(
Property,
GetToAs<float>(),
GetFromAs<float>(),
Delay,
Duration,
easingFunction);
}
if (typeof(T) == typeof(double))
{
return targetHint.Compositor.CreateScalarKeyFrameAnimation(
Property,
(float)GetToAs<double>(),
(float?)GetFromAs<double>(),
Delay,
Duration,
easingFunction);
}
if (typeof(T) == typeof(Vector2))
{
return targetHint.Compositor.CreateVector2KeyFrameAnimation(
Property,
GetToAs<Vector2>(),
GetFromAs<Vector2>(),
Delay,
Duration,
easingFunction);
}
if (typeof(T) == typeof(Vector3))
{
return targetHint.Compositor.CreateVector3KeyFrameAnimation(
Property,
GetToAs<Vector3>(),
GetFromAs<Vector3>(),
Delay,
Duration,
easingFunction);
}
if (typeof(T) == typeof(Vector4))
{
return targetHint.Compositor.CreateVector4KeyFrameAnimation(
Property,
GetToAs<Vector4>(),
GetFromAs<Vector4>(),
Delay,
Duration,
easingFunction);
}
if (typeof(T) == typeof(Color))
{
return targetHint.Compositor.CreateColorKeyFrameAnimation(
Property,
GetToAs<Color>(),
GetFromAs<Color>(),
Delay,
Duration,
easingFunction);
}
if (typeof(T) == typeof(Quaternion))
{
return targetHint.Compositor.CreateQuaternionKeyFrameAnimation(
Property,
GetToAs<Quaternion>(),
GetFromAs<Quaternion>(),
Delay,
Duration,
easingFunction);
}
return ThrowHelper.ThrowInvalidOperationException<CompositionAnimation>("Invalid animation type");
}
/// <inheritdoc/>
public Timeline GetAnimation(DependencyObject targetHint)
{
EasingFunctionBase? easingFunction = EasingType.ToEasingFunction(EasingMode);
if (typeof(T) == typeof(float))
{
return targetHint.CreateDoubleAnimation(
Property,
GetToAs<float>(),
GetFromAs<float>(),
Delay,
Duration,
easingFunction,
enableDependecyAnimations: true);
}
if (typeof(T) == typeof(double))
{
return targetHint.CreateDoubleAnimation(
Property,
GetToAs<double>(),
GetFromAs<double>(),
Delay,
Duration,
easingFunction,
enableDependecyAnimations: true);
}
if (typeof(T) == typeof(Point))
{
return targetHint.CreatePointAnimation(
Property,
GetToAs<Point>(),
GetFromAs<Point>(),
Delay,
Duration,
easingFunction,
enableDependecyAnimations: true);
}
if (typeof(T) == typeof(Color))
{
return targetHint.CreateColorAnimation(
Property,
GetToAs<Color>(),
GetFromAs<Color>(),
Delay,
Duration,
easingFunction);
}
return ThrowHelper.ThrowInvalidOperationException<Timeline>("Invalid animation type");
}
/// <summary>
/// Gets the current target value as <typeparamref name="TValue"/>.
/// </summary>
/// <typeparam name="TValue">The target value type to use.</typeparam>
/// <returns>The target type cast to <typeparamref name="TValue"/>.</returns>
[Pure]
[MethodImpl(MethodImplOptions.AggressiveInlining)]
private TValue GetToAs<TValue>()
where TValue : unmanaged
{
T to = To;
return Unsafe.As<T, TValue>(ref to);
}
/// <summary>
/// Gets the current starting value as <typeparamref name="TValue"/>.
/// </summary>
/// <typeparam name="TValue">The starting value type to use.</typeparam>
/// <returns>The starting type cast to nullable <typeparamref name="TValue"/>.</returns>
[Pure]
[MethodImpl(MethodImplOptions.AggressiveInlining)]
private TValue? GetFromAs<TValue>()
where TValue : unmanaged
{
if (From is null)
{
return null;
}
T from = From.GetValueOrDefault();
return Unsafe.As<T, TValue>(ref from);
}
}
/// <summary>
/// A model representing a specified composition scalar animation factory targeting a clip.
/// </summary>
private sealed record CompositionClipScalarAnimation(
string Property,
float To,
float? From,
TimeSpan Delay,
TimeSpan Duration,
EasingType EasingType,
EasingMode EasingMode)
: ICompositionAnimationFactory
{
/// <inheritdoc/>
public CompositionAnimation GetAnimation(CompositionObject targetHint, out CompositionObject? target)
{
Visual visual = (Visual)targetHint;
InsetClip clip = visual.Clip as InsetClip ?? (InsetClip)(visual.Clip = visual.Compositor.CreateInsetClip());
CompositionEasingFunction? easingFunction = clip.Compositor.TryCreateEasingFunction(EasingType, EasingMode);
ScalarKeyFrameAnimation animation = clip.Compositor.CreateScalarKeyFrameAnimation(Property, To, From, Delay, Duration, easingFunction);
target = clip;
return animation;
}
}
/// <summary>
/// A model representing a specified XAML <see cref="double"/> animation factory targeting a transform.
/// </summary>
private sealed record XamlTransformDoubleAnimationFactory(
string Property,
double To,
double? From,
TimeSpan Delay,
TimeSpan Duration,
EasingType EasingType,
EasingMode EasingMode)
: IXamlAnimationFactory
{
/// <inheritdoc/>
public Timeline GetAnimation(DependencyObject targetHint)
{
UIElement element = (UIElement)targetHint;
if (element.RenderTransform is not CompositeTransform transform)
{
element.RenderTransform = transform = new CompositeTransform();
}
return transform.CreateDoubleAnimation(Property, To, From, Duration, Delay, EasingType.ToEasingFunction(EasingMode));
}
}
/// <summary>
/// A model representing an external composition animation with an optional target <see cref="CompositionObject"/>.
/// </summary>
private sealed record ExternalCompositionAnimation(CompositionObject? Target, CompositionAnimation Animation) : ICompositionAnimationFactory
{
/// <inheritdoc/>
public CompositionAnimation GetAnimation(CompositionObject targetHint, out CompositionObject? target)
{
target = Target;
return Animation;
}
}
/// <summary>
/// A model representing an external composition animation with an optional target <see cref="CompositionObject"/>.
/// </summary>
private sealed record ExternalXamlAnimation(Timeline Animation) : IXamlAnimationFactory
{
/// <inheritdoc/>
public Timeline GetAnimation(DependencyObject targetHint)
{
return Animation;
}
}
}
}

408
Microsoft.Toolkit.Uwp.UI.Animations/Builders/AnimationBuilder.KeyFrames.cs Normal file
Просмотреть файл

@ -0,0 +1,408 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
#nullable enable
using System;
using System.Numerics;
using Windows.UI.Composition;
using Windows.UI.Xaml.Media;
using static Microsoft.Toolkit.Uwp.UI.Animations.AnimationExtensions;
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <inheritdoc cref="AnimationBuilder"/>
public sealed partial class AnimationBuilder
{
/// <summary>
/// Adds a new anchor point animation for a single axis to the current schedule.
/// </summary>
/// <param name="axis">The target anchor point axis to animate.</param>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public IPropertyAnimationBuilder<double> AnchorPoint(Axis axis)
{
return new PropertyAnimationBuilder<double>(this, Properties.Composition.AnchorPoint(axis), FrameworkLayer.Composition);
}
/// <summary>
/// Adds a new anchor point animation for the X and Y axes to the current schedule.
/// </summary>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public IPropertyAnimationBuilder<Vector2> AnchorPoint()
{
return new PropertyAnimationBuilder<Vector2>(this, nameof(Visual.AnchorPoint), FrameworkLayer.Composition);
}
/// <summary>
/// Adds a new opacity animation to the current schedule.
/// </summary>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
public IPropertyAnimationBuilder<double> Opacity(FrameworkLayer layer = FrameworkLayer.Composition)
{
return new PropertyAnimationBuilder<double>(this, nameof(Visual.Opacity), layer);
}
/// <summary>
/// Adds a new translation animation for a single axis to the current schedule.
/// </summary>
/// <param name="axis">The target translation axis to animate.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
public IPropertyAnimationBuilder<double> Translation(Axis axis, FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
return new PropertyAnimationBuilder<double>(this, Properties.Composition.Translation(axis), layer);
}
return new XamlTransformPropertyAnimationBuilder(this, Properties.Xaml.Translation(axis));
}
/// <summary>
/// Adds a new composition translation animation for all axes to the current schedule.
/// </summary>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public IPropertyAnimationBuilder<Vector3> Translation()
{
return new PropertyAnimationBuilder<Vector3>(this, Properties.Composition.Translation(), FrameworkLayer.Composition);
}
/// <summary>
/// Adds a new composition offset animation for a single axis to the current schedule.
/// </summary>
/// <param name="axis">The target translation axis to animate.</param>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public IPropertyAnimationBuilder<double> Offset(Axis axis)
{
return new PropertyAnimationBuilder<double>(this, Properties.Composition.Offset(axis), FrameworkLayer.Composition);
}
/// <summary>
/// Adds a new composition offset translation animation for all axes to the current schedule.
/// </summary>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public IPropertyAnimationBuilder<Vector3> Offset()
{
return new PropertyAnimationBuilder<Vector3>(this, nameof(Visual.Offset), FrameworkLayer.Composition);
}
/// <summary>
/// Adds a new scale animation on a specified axis to the current schedule.
/// </summary>
/// <param name="axis">The target scale axis to animate.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
public IPropertyAnimationBuilder<double> Scale(Axis axis, FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
return new PropertyAnimationBuilder<double>(this, Properties.Composition.Scale(axis), layer);
}
return new XamlTransformPropertyAnimationBuilder(this, Properties.Xaml.Scale(axis));
}
/// <summary>
/// Adds a new scale animation for all axes to the current schedule.
/// </summary>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public IPropertyAnimationBuilder<Vector3> Scale()
{
return new PropertyAnimationBuilder<Vector3>(this, nameof(Visual.Scale), FrameworkLayer.Composition);
}
/// <summary>
/// Adds a new center point animation on a specified axis to the current schedule.
/// </summary>
/// <param name="axis">The target scale axis to animate.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
public IPropertyAnimationBuilder<double> CenterPoint(Axis axis, FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
return new PropertyAnimationBuilder<double>(this, Properties.Composition.CenterPoint(axis), layer);
}
return new XamlTransformPropertyAnimationBuilder(this, Properties.Xaml.CenterPoint(axis));
}
/// <summary>
/// Adds a new center point animation for all axes to the current schedule.
/// </summary>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public IPropertyAnimationBuilder<Vector3> CenterPoint()
{
return new PropertyAnimationBuilder<Vector3>(this, nameof(Visual.CenterPoint), FrameworkLayer.Composition);
}
/// <summary>
/// Adds a new rotation animation to the current schedule.
/// </summary>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public IPropertyAnimationBuilder<double> Rotation()
{
return new PropertyAnimationBuilder<double>(this, nameof(Visual.RotationAngle), FrameworkLayer.Composition);
}
/// <summary>
/// Adds a new rotation animation in degrees to the current schedule.
/// </summary>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
public IPropertyAnimationBuilder<double> RotationInDegrees(FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
return new PropertyAnimationBuilder<double>(this, nameof(Visual.RotationAngleInDegrees), layer);
}
return new XamlTransformPropertyAnimationBuilder(this, nameof(CompositeTransform.Rotation));
}
/// <summary>
/// Adds a new rotation axis animation to the current schedule.
/// </summary>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public IPropertyAnimationBuilder<Vector3> RotationAxis()
{
return new PropertyAnimationBuilder<Vector3>(this, nameof(Visual.RotationAxis), FrameworkLayer.Composition);
}
/// <summary>
/// Adds a new orientation animation to the current schedule.
/// </summary>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public IPropertyAnimationBuilder<Quaternion> Orientation()
{
return new PropertyAnimationBuilder<Quaternion>(this, nameof(Visual.Orientation), FrameworkLayer.Composition);
}
/// <summary>
/// Adds a new clip animation to the current schedule.
/// </summary>
/// <param name="side">The clip size to animate.</param>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public IPropertyAnimationBuilder<double> Clip(Side side)
{
return new CompositionClipAnimationBuilder(this, Properties.Composition.Clip(side));
}
/// <summary>
/// Adds a new size animation for a single axis to the current schedule.
/// </summary>
/// <param name="axis">The target size axis to animate.</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
public IPropertyAnimationBuilder<double> Size(Axis axis, FrameworkLayer layer = FrameworkLayer.Composition)
{
if (layer == FrameworkLayer.Composition)
{
return new PropertyAnimationBuilder<double>(this, Properties.Composition.Size(axis), layer);
}
return new PropertyAnimationBuilder<double>(this, Properties.Xaml.Size(axis), layer);
}
/// <summary>
/// Adds a new composition size translation animation for all axes to the current schedule.
/// </summary>
/// <returns>An <see cref="IPropertyAnimationBuilder{T}"/> instance to configure the animation.</returns>
/// <remarks>This animation is only available on the composition layer.</remarks>
public IPropertyAnimationBuilder<Vector2> Size()
{
return new PropertyAnimationBuilder<Vector2>(this, nameof(Visual.Size), FrameworkLayer.Composition);
}
/// <summary>
/// Adds a custom animation based on normalized keyframes to the current schedule.
/// </summary>
/// <typeparam name="T">The type of values to animate.</typeparam>
/// <param name="property">The target property to animate.</param>
/// <param name="build">The callback to use to construct the custom animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The animation duration.</param>
/// <param name="repeatOption">The repeat option for the animation (defaults to one iteration).</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder NormalizedKeyFrames<T>(
string property,
Action<INormalizedKeyFrameAnimationBuilder<T>> build,
TimeSpan? delay = null,
TimeSpan? duration = null,
RepeatOption? repeatOption = null,
FrameworkLayer layer = FrameworkLayer.Composition)
where T : unmanaged
{
if (layer == FrameworkLayer.Composition)
{
NormalizedKeyFrameAnimationBuilder<T>.Composition builder = new(
property,
delay,
duration ?? DefaultDuration,
repeatOption ?? RepeatOption.Once);
build(builder);
this.compositionAnimationFactories.Add(builder);
}
else
{
NormalizedKeyFrameAnimationBuilder<T>.Xaml builder = new(
property,
delay,
duration ?? DefaultDuration,
repeatOption ?? RepeatOption.Once);
build(builder);
this.xamlAnimationFactories.Add(builder);
}
return this;
}
/// <summary>
/// Adds a custom animation based on normalized keyframes to the current schedule.
/// </summary>
/// <typeparam name="T">The type of values to animate.</typeparam>
/// <typeparam name="TState">The type of state to pass to the builder.</typeparam>
/// <param name="property">The target property to animate.</param>
/// <param name="state">The state to pass to the builder.</param>
/// <param name="build">The callback to use to construct the custom animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The animation duration.</param>
/// <param name="repeatOption">The repeat option for the animation (defaults to one iteration).</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder NormalizedKeyFrames<T, TState>(
string property,
TState state,
Action<INormalizedKeyFrameAnimationBuilder<T>, TState> build,
TimeSpan? delay = null,
TimeSpan? duration = null,
RepeatOption? repeatOption = null,
FrameworkLayer layer = FrameworkLayer.Composition)
where T : unmanaged
{
if (layer == FrameworkLayer.Composition)
{
NormalizedKeyFrameAnimationBuilder<T>.Composition builder = new(
property,
delay,
duration ?? DefaultDuration,
repeatOption ?? RepeatOption.Once);
build(builder, state);
this.compositionAnimationFactories.Add(builder);
}
else
{
NormalizedKeyFrameAnimationBuilder<T>.Xaml builder = new(
property,
delay,
duration ?? DefaultDuration,
repeatOption ?? RepeatOption.Once);
build(builder, state);
this.xamlAnimationFactories.Add(builder);
}
return this;
}
/// <summary>
/// Adds a custom animation based on timed keyframes to the current schedule.
/// </summary>
/// <typeparam name="T">The type of values to animate.</typeparam>
/// <param name="property">The target property to animate.</param>
/// <param name="build">The callback to use to construct the custom animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="repeat">The repeat option for the animation (defaults to one iteration).</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder TimedKeyFrames<T>(
string property,
Action<ITimedKeyFrameAnimationBuilder<T>> build,
TimeSpan? delay = null,
RepeatOption? repeat = null,
FrameworkLayer layer = FrameworkLayer.Composition)
where T : unmanaged
{
if (layer == FrameworkLayer.Composition)
{
TimedKeyFrameAnimationBuilder<T>.Composition builder = new(property, delay, repeat ?? RepeatOption.Once);
build(builder);
this.compositionAnimationFactories.Add(builder);
}
else
{
TimedKeyFrameAnimationBuilder<T>.Xaml builder = new(property, delay, repeat ?? RepeatOption.Once);
build(builder);
this.xamlAnimationFactories.Add(builder);
}
return this;
}
/// <summary>
/// Adds a custom animation based on timed keyframes to the current schedule.
/// </summary>
/// <typeparam name="T">The type of values to animate.</typeparam>
/// <typeparam name="TState">The type of state to pass to the builder.</typeparam>
/// <param name="property">The target property to animate.</param>
/// <param name="state">The state to pass to the builder.</param>
/// <param name="build">The callback to use to construct the custom animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="repeatOption">The repeat option for the animation (defaults to one iteration).</param>
/// <param name="layer">The target framework layer to animate.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
public AnimationBuilder TimedKeyFrames<T, TState>(
string property,
TState state,
Action<ITimedKeyFrameAnimationBuilder<T>, TState> build,
TimeSpan? delay = null,
RepeatOption? repeatOption = null,
FrameworkLayer layer = FrameworkLayer.Composition)
where T : unmanaged
{
if (layer == FrameworkLayer.Composition)
{
TimedKeyFrameAnimationBuilder<T>.Composition builder = new(property, delay, repeatOption ?? RepeatOption.Once);
build(builder, state);
this.compositionAnimationFactories.Add(builder);
}
else
{
TimedKeyFrameAnimationBuilder<T>.Xaml builder = new(property, delay, repeatOption ?? RepeatOption.Once);
build(builder, state);
this.xamlAnimationFactories.Add(builder);
}
return this;
}
}
}

270
Microsoft.Toolkit.Uwp.UI.Animations/Builders/AnimationBuilder.PropertyBuilders.cs Normal file
Просмотреть файл

@ -0,0 +1,270 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
using Windows.UI.Composition;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Media.Animation;
using static Microsoft.Toolkit.Uwp.UI.Animations.AnimationExtensions;
#nullable enable
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <inheritdoc cref="AnimationBuilder"/>
public sealed partial class AnimationBuilder
{
/// <summary>
/// A custom <see cref="IPropertyAnimationBuilder{T}"/> for a shared animation.
/// </summary>
/// <typeparam name="T">The type of property to animate.</typeparam>
private sealed record PropertyAnimationBuilder<T>(
AnimationBuilder Builder,
string Property,
FrameworkLayer Layer)
: IPropertyAnimationBuilder<T>
where T : unmanaged
{
/// <inheritdoc/>
public AnimationBuilder NormalizedKeyFrames(
Action<INormalizedKeyFrameAnimationBuilder<T>> build,
TimeSpan? delay,
TimeSpan? duration,
RepeatOption? repeatOption)
{
return Builder.NormalizedKeyFrames(Property, build, delay, duration, repeatOption, Layer);
}
/// <inheritdoc/>
public AnimationBuilder NormalizedKeyFrames<TState>(
TState state,
Action<INormalizedKeyFrameAnimationBuilder<T>, TState> build,
TimeSpan? delay,
TimeSpan? duration,
RepeatOption? repeatOption)
{
return Builder.NormalizedKeyFrames(Property, state, build, delay, duration, repeatOption, Layer);
}
/// <inheritdoc/>
public AnimationBuilder TimedKeyFrames(
Action<ITimedKeyFrameAnimationBuilder<T>> build,
TimeSpan? delay,
RepeatOption? repeatOption)
{
return Builder.TimedKeyFrames(Property, build, delay, repeatOption, Layer);
}
/// <inheritdoc/>
public AnimationBuilder TimedKeyFrames<TState>(
TState state,
Action<ITimedKeyFrameAnimationBuilder<T>, TState> build,
TimeSpan? delay,
RepeatOption? repeatOption)
{
return Builder.TimedKeyFrames(Property, state, build, delay, repeatOption, Layer);
}
}
/// <summary>
/// A custom <see cref="IPropertyAnimationBuilder{T}"/> for a composition clip animation.
/// </summary>
private sealed record CompositionClipAnimationBuilder(
AnimationBuilder Builder,
string Property)
: IPropertyAnimationBuilder<double>
{
/// <inheritdoc/>
public AnimationBuilder NormalizedKeyFrames(
Action<INormalizedKeyFrameAnimationBuilder<double>> build,
TimeSpan? delay,
TimeSpan? duration,
RepeatOption? repeatOption)
{
NormalizedKeyFrameAnimationBuilder<double>.Composition builder = new(
Property,
delay,
duration ?? DefaultDuration,
repeatOption ?? RepeatOption.Once);
build(builder);
Builder.compositionAnimationFactories.Add(new Factory(builder));
return Builder;
}
/// <inheritdoc/>
public AnimationBuilder NormalizedKeyFrames<TState>(
TState state,
Action<INormalizedKeyFrameAnimationBuilder<double>, TState> build,
TimeSpan? delay,
TimeSpan? duration,
RepeatOption? repeatOption)
{
NormalizedKeyFrameAnimationBuilder<double>.Composition builder = new(
Property,
delay,
duration ?? DefaultDuration,
repeatOption ?? RepeatOption.Once);
build(builder, state);
Builder.compositionAnimationFactories.Add(new Factory(builder));
return Builder;
}
/// <inheritdoc/>
public AnimationBuilder TimedKeyFrames(
Action<ITimedKeyFrameAnimationBuilder<double>> build,
TimeSpan? delay,
RepeatOption? repeatOption)
{
TimedKeyFrameAnimationBuilder<double>.Composition builder = new(Property, delay, repeatOption ?? RepeatOption.Once);
build(builder);
Builder.compositionAnimationFactories.Add(new Factory(builder));
return Builder;
}
/// <inheritdoc/>
public AnimationBuilder TimedKeyFrames<TState>(
TState state,
Action<ITimedKeyFrameAnimationBuilder<double>, TState> build,
TimeSpan? delay,
RepeatOption? repeatOption)
{
TimedKeyFrameAnimationBuilder<double>.Composition builder = new(Property, delay, repeatOption ?? RepeatOption.Once);
build(builder, state);
Builder.compositionAnimationFactories.Add(new Factory(builder));
return Builder;
}
/// <summary>
/// A private factory implementing <see cref="ICompositionAnimationFactory"/>.
/// </summary>
private sealed record Factory(ICompositionAnimationFactory Builder) : ICompositionAnimationFactory
{
/// <inheritdoc/>
public CompositionAnimation GetAnimation(CompositionObject targetHint, out CompositionObject? target)
{
Visual visual = (Visual)targetHint;
InsetClip clip = visual.Clip as InsetClip ?? (InsetClip)(visual.Clip = visual.Compositor.CreateInsetClip());
CompositionAnimation animation = Builder.GetAnimation(clip, out _);
target = clip;
return animation;
}
}
}
/// <summary>
/// A custom <see cref="IPropertyAnimationBuilder{T}"/> for a XAML transform animation.
/// </summary>
private sealed record XamlTransformPropertyAnimationBuilder(
AnimationBuilder Builder,
string Property)
: IPropertyAnimationBuilder<double>
{
/// <inheritdoc/>
public AnimationBuilder NormalizedKeyFrames(
Action<INormalizedKeyFrameAnimationBuilder<double>> build,
TimeSpan? delay,
TimeSpan? duration,
RepeatOption? repeatOption)
{
NormalizedKeyFrameAnimationBuilder<double>.Xaml builder = new(
Property,
delay,
duration ?? DefaultDuration,
repeatOption ?? RepeatOption.Once);
build(builder);
Builder.xamlAnimationFactories.Add(new Factory(builder));
return Builder;
}
/// <inheritdoc/>
public AnimationBuilder NormalizedKeyFrames<TState>(
TState state,
Action<INormalizedKeyFrameAnimationBuilder<double>, TState> build,
TimeSpan? delay,
TimeSpan? duration,
RepeatOption? repeatOption)
{
NormalizedKeyFrameAnimationBuilder<double>.Xaml builder = new(
Property,
delay,
duration ?? DefaultDuration,
repeatOption ?? RepeatOption.Once);
build(builder, state);
Builder.xamlAnimationFactories.Add(new Factory(builder));
return Builder;
}
/// <inheritdoc/>
public AnimationBuilder TimedKeyFrames(
Action<ITimedKeyFrameAnimationBuilder<double>> build,
TimeSpan? delay,
RepeatOption? repeatOption)
{
TimedKeyFrameAnimationBuilder<double>.Xaml builder = new(Property, delay, repeatOption ?? RepeatOption.Once);
build(builder);
Builder.xamlAnimationFactories.Add(new Factory(builder));
return Builder;
}
/// <inheritdoc/>
public AnimationBuilder TimedKeyFrames<TState>(
TState state,
Action<ITimedKeyFrameAnimationBuilder<double>, TState> build,
TimeSpan? delay,
RepeatOption? repeatOption)
{
TimedKeyFrameAnimationBuilder<double>.Xaml builder = new(Property, delay, repeatOption ?? RepeatOption.Once);
build(builder, state);
Builder.xamlAnimationFactories.Add(new Factory(builder));
return Builder;
}
/// <summary>
/// A private factory implementing <see cref="IXamlAnimationFactory"/>.
/// </summary>
private sealed record Factory(IXamlAnimationFactory Builder) : IXamlAnimationFactory
{
/// <inheritdoc/>
public Timeline GetAnimation(DependencyObject targetHint)
{
UIElement element = (UIElement)targetHint;
if (element.RenderTransform is not CompositeTransform transform)
{
element.RenderTransform = transform = new CompositeTransform();
}
return Builder.GetAnimation(transform);
}
}
}
}
}

133
Microsoft.Toolkit.Uwp.UI.Animations/Builders/AnimationBuilder.Setup.cs Normal file
Просмотреть файл

@ -0,0 +1,133 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
using System.Collections.Generic;
using Windows.UI.Xaml.Media.Animation;
using static Microsoft.Toolkit.Uwp.UI.Animations.AnimationExtensions;
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <summary>
/// A <see langword="class"/> that allows to build custom animations targeting both the XAML and composition layers.
/// </summary>
public sealed partial class AnimationBuilder
{
/// <summary>
/// The list of <see cref="ICompositionAnimationFactory"/> instances representing factories for composition animations to run.
/// </summary>
private readonly List<ICompositionAnimationFactory> compositionAnimationFactories = new();
/// <summary>
/// The list of <see cref="IXamlAnimationFactory"/> instances representing factories for XAML animations to run.
/// </summary>
private readonly List<IXamlAnimationFactory> xamlAnimationFactories = new();
/// <summary>
/// Adds a new composition <typeparamref name="T"/> animation to the current schedule.
/// </summary>
/// <typeparam name="T">The type of values to animate.</typeparam>
/// <param name="property">The target property to animate.</param>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The animation duration.</param>
/// <param name="easingType">The easing function for the animation.</param>
/// <param name="easingMode">The easing mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
private AnimationBuilder AddCompositionAnimationFactory<T>(
string property,
T to,
T? from,
TimeSpan? delay,
TimeSpan? duration,
EasingType easingType,
EasingMode easingMode)
where T : unmanaged
{
AnimationFactory<T> animation = new(
property,
to,
from,
delay ?? DefaultDelay,
duration ?? DefaultDuration,
easingType,
easingMode);
this.compositionAnimationFactories.Add(animation);
return this;
}
/// <summary>
/// Adds a new XAML <typeparamref name="T"/> animation to the current schedule.
/// </summary>
/// <typeparam name="T">The type of values to animate.</typeparam>
/// <param name="property">The target property to animate.</param>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The animation duration.</param>
/// <param name="easingType">The easing function for the animation.</param>
/// <param name="easingMode">The easing mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
private AnimationBuilder AddXamlAnimationFactory<T>(
string property,
T to,
T? from,
TimeSpan? delay,
TimeSpan? duration,
EasingType easingType,
EasingMode easingMode)
where T : unmanaged
{
AnimationFactory<T> animation = new(
property,
to,
from,
delay ?? DefaultDelay,
duration ?? DefaultDuration,
easingType,
easingMode);
this.xamlAnimationFactories.Add(animation);
return this;
}
/// <summary>
/// Adds a new XAML transform <see cref="double"/> animation to the current schedule.
/// </summary>
/// <param name="property">The target property to animate.</param>
/// <param name="to">The final value for the animation.</param>
/// <param name="from">The optional starting value for the animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The animation duration.</param>
/// <param name="easingType">The easing function for the animation.</param>
/// <param name="easingMode">The easing mode for the animation.</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
private AnimationBuilder AddXamlTransformDoubleAnimationFactory(
string property,
double to,
double? from,
TimeSpan? delay,
TimeSpan? duration,
EasingType easingType,
EasingMode easingMode)
{
XamlTransformDoubleAnimationFactory animation = new(
property,
to,
from,
delay ?? DefaultDelay,
duration ?? DefaultDuration,
easingType,
easingMode);
this.xamlAnimationFactories.Add(animation);
return this;
}
}
}

313
Microsoft.Toolkit.Uwp.UI.Animations/Builders/AnimationBuilder.cs Normal file
Просмотреть файл

@ -0,0 +1,313 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
#nullable enable
using System.Collections.Generic;
using System.Diagnostics.Contracts;
using System.Threading;
using System.Threading.Tasks;
using Windows.UI.Composition;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Hosting;
using Windows.UI.Xaml.Media.Animation;
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <summary>
/// A <see langword="class"/> that allows to build custom animations targeting both the XAML and composition layers.
/// </summary>
public sealed partial class AnimationBuilder
{
/// <summary>
/// Initializes a new instance of the <see cref="AnimationBuilder"/> class.
/// </summary>
/// <remarks>This is private as the public entry point is the <see cref="Create"/> method.</remarks>
private AnimationBuilder()
{
}
/// <summary>
/// <para>
/// Creates a new <see cref="AnimationBuilder"/> instance to setup an animation schedule.
/// This can be used as the entry point to construct a custom animation sequence.
/// </para>
/// For instance:
/// <code>
/// AnimationBuilder.Create()<br/>
/// .Opacity(from: 0, to: 1)<br/>
/// .Translation(Axis.X, from: -40, to: 0)<br/>
/// .Start(MyButton);
/// </code>
/// <para>
/// Configured <see cref="AnimationBuilder"/> instances are also reusable, meaning that the same
/// one can be used to start an animation sequence on multiple elements as well.
/// </para>
/// For instance:
/// <code>
/// var animation = AnimationBuilder.Create().Opacity(0, 1).Size(1.2, 1);<br/>
/// <br/>
/// animation.Start(MyButton);<br/>
/// animation.Start(MyGrid);
/// </code>
/// Alternatively, the <see cref="AnimationSet"/> type can be used to configure animations directly from XAML.
/// The same <see cref="AnimationBuilder"/> APIs will still be used behind the scenes to handle animations.
/// </summary>
/// <returns>An empty <see cref="AnimationBuilder"/> instance to use to construct an animation sequence.</returns>
[Pure]
public static AnimationBuilder Create() => new();
/// <summary>
/// Starts the animations present in the current <see cref="AnimationBuilder"/> instance.
/// </summary>
/// <param name="element">The target <see cref="UIElement"/> to animate.</param>
public void Start(UIElement element)
{
if (this.compositionAnimationFactories.Count > 0)
{
ElementCompositionPreview.SetIsTranslationEnabled(element, true);
Visual visual = ElementCompositionPreview.GetElementVisual(element);
foreach (var factory in this.compositionAnimationFactories)
{
var animation = factory.GetAnimation(visual, out var target);
if (target is null)
{
visual.StartAnimation(animation.Target, animation);
}
else
{
target.StartAnimation(animation.Target, animation);
}
}
}
if (this.xamlAnimationFactories.Count > 0)
{
Storyboard storyboard = new();
foreach (var factory in this.xamlAnimationFactories)
{
storyboard.Children.Add(factory.GetAnimation(element));
}
storyboard.Begin();
}
}
/// <summary>
/// Starts the animations present in the current <see cref="AnimationBuilder"/> instance, and
/// registers a given cancellation token to stop running animations before they complete.
/// </summary>
/// <param name="element">The target <see cref="UIElement"/> to animate.</param>
/// <param name="token">The cancellation token to stop animations while they're running.</param>
public void Start(UIElement element, CancellationToken token)
{
List<(CompositionObject Target, string Path)>? compositionAnimations = null;
if (this.compositionAnimationFactories.Count > 0)
{
compositionAnimations = new List<(CompositionObject Target, string Path)>(this.compositionAnimationFactories.Count);
ElementCompositionPreview.SetIsTranslationEnabled(element, true);
Visual visual = ElementCompositionPreview.GetElementVisual(element);
foreach (var factory in this.compositionAnimationFactories)
{
var animation = factory.GetAnimation(visual, out var target);
if (target is null)
{
visual.StartAnimation(animation.Target, animation);
}
else
{
target.StartAnimation(animation.Target, animation);
}
compositionAnimations.Add((target ?? visual, animation.Target));
}
}
Storyboard? storyboard = null;
if (this.xamlAnimationFactories.Count > 0)
{
storyboard = new Storyboard();
foreach (var factory in this.xamlAnimationFactories)
{
storyboard.Children.Add(factory.GetAnimation(element));
}
storyboard.Begin();
}
static void Stop(object state)
{
(List<(CompositionObject Target, string Path)>? animations, Storyboard? storyboard) = ((List<(CompositionObject, string)>?, Storyboard?))state;
if (animations is not null)
{
foreach (var (target, path) in animations)
{
target.StopAnimation(path);
}
}
storyboard?.Stop();
}
token.Register(static obj => Stop(obj), (compositionAnimations, storyboard));
}
/// <summary>
/// Starts the animations present in the current <see cref="AnimationBuilder"/> instance.
/// </summary>
/// <param name="element">The target <see cref="UIElement"/> to animate.</param>
/// <returns>A <see cref="Task"/> that completes when all animations have completed.</returns>
public Task StartAsync(UIElement element)
{
Task
compositionTask = Task.CompletedTask,
xamlTask = Task.CompletedTask;
if (this.compositionAnimationFactories.Count > 0)
{
ElementCompositionPreview.SetIsTranslationEnabled(element, true);
Visual visual = ElementCompositionPreview.GetElementVisual(element);
CompositionScopedBatch batch = visual.Compositor.CreateScopedBatch(CompositionBatchTypes.Animation);
TaskCompletionSource<object?> taskCompletionSource = new();
batch.Completed += (_, _) => taskCompletionSource.SetResult(null);
foreach (var factory in this.compositionAnimationFactories)
{
var animation = factory.GetAnimation(visual, out var target);
if (target is null)
{
visual.StartAnimation(animation.Target, animation);
}
else
{
target.StartAnimation(animation.Target, animation);
}
}
batch.End();
compositionTask = taskCompletionSource.Task;
}
if (this.xamlAnimationFactories.Count > 0)
{
Storyboard storyboard = new();
TaskCompletionSource<object?> taskCompletionSource = new();
foreach (var factory in this.xamlAnimationFactories)
{
storyboard.Children.Add(factory.GetAnimation(element));
}
storyboard.Completed += (_, _) => taskCompletionSource.SetResult(null);
storyboard.Begin();
xamlTask = taskCompletionSource.Task;
}
return Task.WhenAll(compositionTask, xamlTask);
}
/// <summary>
/// Starts the animations present in the current <see cref="AnimationBuilder"/> instance, and
/// registers a given cancellation token to stop running animations before they complete.
/// </summary>
/// <param name="element">The target <see cref="UIElement"/> to animate.</param>
/// <param name="token">The cancellation token to stop animations while they're running.</param>
/// <returns>A <see cref="Task"/> that completes when all animations have completed.</returns>
public Task StartAsync(UIElement element, CancellationToken token)
{
Task
compositionTask = Task.CompletedTask,
xamlTask = Task.CompletedTask;
List<(CompositionObject Target, string Path)>? compositionAnimations = null;
if (this.compositionAnimationFactories.Count > 0)
{
compositionAnimations = new List<(CompositionObject Target, string Path)>(this.compositionAnimationFactories.Count);
ElementCompositionPreview.SetIsTranslationEnabled(element, true);
Visual visual = ElementCompositionPreview.GetElementVisual(element);
CompositionScopedBatch batch = visual.Compositor.CreateScopedBatch(CompositionBatchTypes.Animation);
TaskCompletionSource<object?> taskCompletionSource = new();
batch.Completed += (_, _) => taskCompletionSource.SetResult(null);
foreach (var factory in this.compositionAnimationFactories)
{
var animation = factory.GetAnimation(visual, out var target);
if (target is null)
{
visual.StartAnimation(animation.Target, animation);
}
else
{
target.StartAnimation(animation.Target, animation);
}
compositionAnimations.Add((target ?? visual, animation.Target));
}
batch.End();
compositionTask = taskCompletionSource.Task;
}
Storyboard? storyboard = null;
if (this.xamlAnimationFactories.Count > 0)
{
storyboard = new Storyboard();
TaskCompletionSource<object?> taskCompletionSource = new();
foreach (var factory in this.xamlAnimationFactories)
{
storyboard.Children.Add(factory.GetAnimation(element));
}
storyboard.Completed += (_, _) => taskCompletionSource.SetResult(null);
storyboard.Begin();
xamlTask = taskCompletionSource.Task;
}
static void Stop(object state)
{
(List<(CompositionObject Target, string Path)>? animations, Storyboard? storyboard) = ((List<(CompositionObject, string)>?, Storyboard?))state;
if (animations is not null)
{
foreach (var (target, path) in animations)
{
target.StopAnimation(path);
}
}
storyboard?.Stop();
}
token.Register(static obj => Stop(obj), (compositionAnimations, storyboard));
return Task.WhenAll(compositionTask, xamlTask);
}
}
}

69
Microsoft.Toolkit.Uwp.UI.Animations/Builders/Helpers/ListBuilder{T}.cs Normal file
Просмотреть файл

@ -0,0 +1,69 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
using System.Diagnostics.Contracts;
using System.Runtime.CompilerServices;
namespace Microsoft.Toolkit.Uwp.UI.Animations.Builders.Helpers
{
/// <summary>
/// A small generic builder type that allows to create <see cref="ReadOnlySpan{T}"/> instances.
/// </summary>
/// <typeparam name="T">The type of items to create a sequence of.</typeparam>
internal struct ListBuilder<T>
{
/// <summary>
/// The <typeparamref name="T"/> array in use.
/// </summary>
private T[] array;
/// <summary>
/// The current index.
/// </summary>
private int index;
/// <summary>
/// Gets an emoty <see cref="ListBuilder{T}"/> instance.
/// </summary>
public static ListBuilder<T> Empty
{
[MethodImpl(MethodImplOptions.AggressiveInlining)]
get
{
ListBuilder<T> builder;
builder.array = new T[1];
builder.index = 0;
return builder;
}
}
/// <summary>
/// Appens an item to the current builder.
/// </summary>
/// <param name="item">The item to append.</param>
[MethodImpl(MethodImplOptions.AggressiveInlining)]
public void Append(T item)
{
if (this.index >= this.array.Length)
{
Array.Resize(ref this.array, this.array.Length * 2);
}
this.array[this.index++] = item;
}
/// <summary>
/// Gets a <see cref="ReadOnlySpan{T}"/> instance with the current items.
/// </summary>
/// <returns>A <see cref="ReadOnlySpan{T}"/> instance with the current items.</returns>
[Pure]
[MethodImpl(MethodImplOptions.AggressiveInlining)]
public ReadOnlySpan<T> AsSpan()
{
return this.array.AsSpan(0, this.index);
}
}
}

59
Microsoft.Toolkit.Uwp.UI.Animations/Builders/Interfaces/IKeyFrameInfo.cs Normal file
Просмотреть файл

@ -0,0 +1,59 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
using System.Diagnostics.Contracts;
using Windows.UI.Composition;
using Windows.UI.Xaml.Media.Animation;
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <summary>
/// An interface representing a generic model containing info for an abstract keyframe.
/// </summary>
internal interface IKeyFrameInfo
{
/// <summary>
/// Gets the easing type to use to reach the new keyframe.
/// </summary>
EasingType EasingType { get; }
/// <summary>
/// Gets the easing mode to use to reach the new keyframe.
/// </summary>
EasingMode EasingMode { get; }
/// <summary>
/// Gets the value for the new keyframe to add.
/// </summary>
/// <typeparam name="T">The type of values being set by the animation being constructed.</typeparam>
/// <returns>The value for the current keyframe.</returns>
[Pure]
T GetValueAs<T>();
/// <summary>
/// Tries to insert an expression keyframe into the target animation, if possible.
/// </summary>
/// <param name="animation">The target <see cref="KeyFrameAnimation"/> instance.</param>
/// <param name="duration">The total duration for the full animation.</param>
/// <returns>Whether or not the curreent <see cref="IKeyFrameInfo"/> instance contained an expression.</returns>
bool TryInsertExpressionKeyFrame(KeyFrameAnimation animation, TimeSpan duration);
/// <summary>
/// Gets the normalized progress for the current keyframe.
/// </summary>
/// <param name="duration">The total duration for the full animation.</param>
/// <returns>The normalized progress for the current keyframe.</returns>
[Pure]
float GetNormalizedProgress(TimeSpan duration);
/// <summary>
/// Gets the timed progress for the current keyframe.
/// </summary>
/// <param name="duration">The total duration for the full animation.</param>
/// <returns>The timed progress for the current keyframe.</returns>
[Pure]
TimeSpan GetTimedProgress(TimeSpan duration);
}
}

46
Microsoft.Toolkit.Uwp.UI.Animations/Builders/Interfaces/INormalizedKeyFrameAnimationBuilder{T}.cs Normal file
Просмотреть файл

@ -0,0 +1,46 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using Windows.UI.Xaml.Media.Animation;
using static Microsoft.Toolkit.Uwp.UI.Animations.AnimationExtensions;
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <summary>
/// An interface for an animation builder using normalized keyframes.
/// </summary>
/// <typeparam name="T">The type of values being set by the animation being constructed.</typeparam>
public interface INormalizedKeyFrameAnimationBuilder<in T>
{
/// <summary>
/// Adds a new normalized keyframe to the builder in use.
/// </summary>
/// <param name="progress">The normalized progress for the keyframe (must be in the [0, 1] range).</param>
/// <param name="value">The value for the new keyframe to add.</param>
/// <param name="easingType">The easing type to use to reach the new keyframe.</param>
/// <param name="easingMode">The easing mode to use to reach the new keyframe.</param>
/// <returns>The same <see cref="INormalizedKeyFrameAnimationBuilder{T}"/> instance that the method was invoked upon.</returns>
INormalizedKeyFrameAnimationBuilder<T> KeyFrame(
double progress,
T value,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode);
/// <summary>
/// Adds a new normalized expression keyframe to the builder in use.
/// This method can only be used when the animation being built targets the composition layer.
/// </summary>
/// <param name="progress">The normalized progress for the keyframe (must be in the [0, 1] range).</param>
/// <param name="expression">The expression for the new keyframe to add.</param>
/// <param name="easingType">The easing type to use to reach the new keyframe.</param>
/// <param name="easingMode">The easing mode to use to reach the new keyframe.</param>
/// <returns>The same <see cref="INormalizedKeyFrameAnimationBuilder{T}"/> instance that the method was invoked upon.</returns>
/// <exception cref="System.InvalidOperationException">Thrown when the animation being built targets the XAML layer.</exception>
INormalizedKeyFrameAnimationBuilder<T> ExpressionKeyFrame(
double progress,
string expression,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode);
}
}

73
Microsoft.Toolkit.Uwp.UI.Animations/Builders/Interfaces/IPropertyAnimationBuilder{T}.cs Normal file
Просмотреть файл

@ -0,0 +1,73 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <summary>
/// An animation for an animation builder using keyframes, targeting a specific property.
/// </summary>
/// <typeparam name="T">The type of values being set by the animation being constructed.</typeparam>
public interface IPropertyAnimationBuilder<in T>
{
/// <summary>
/// Adds a custom animation based on normalized keyframes ot the current schedule.
/// </summary>
/// <param name="build">The callback to use to construct the custom animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The animation duration.</param>
/// <param name="repeat">The repeat option for the animation (defaults to one iteration).</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
AnimationBuilder NormalizedKeyFrames(
Action<INormalizedKeyFrameAnimationBuilder<T>> build,
TimeSpan? delay = null,
TimeSpan? duration = null,
RepeatOption? repeat = null);
/// <summary>
/// Adds a custom animation based on normalized keyframes ot the current schedule.
/// </summary>
/// <typeparam name="TState">The type of state to pass to the builder.</typeparam>
/// <param name="state">The state to pass to the builder.</param>
/// <param name="build">The callback to use to construct the custom animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The animation duration.</param>
/// <param name="repeat">The repeat option for the animation (defaults to one iteration).</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
AnimationBuilder NormalizedKeyFrames<TState>(
TState state,
Action<INormalizedKeyFrameAnimationBuilder<T>, TState> build,
TimeSpan? delay = null,
TimeSpan? duration = null,
RepeatOption? repeat = null);
/// <summary>
/// Adds a custom animation based on timed keyframes to the current schedule.
/// </summary>
/// <param name="build">The callback to use to construct the custom animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="repeat">The repeat option for the animation (defaults to one iteration).</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
AnimationBuilder TimedKeyFrames(
Action<ITimedKeyFrameAnimationBuilder<T>> build,
TimeSpan? delay = null,
RepeatOption? repeat = null);
/// <summary>
/// Adds a custom animation based on timed keyframes to the current schedule.
/// </summary>
/// <typeparam name="TState">The type of state to pass to the builder.</typeparam>
/// <param name="state">The state to pass to the builder.</param>
/// <param name="build">The callback to use to construct the custom animation.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="repeat">The repeat option for the animation (defaults to one iteration).</param>
/// <returns>The current <see cref="AnimationBuilder"/> instance.</returns>
AnimationBuilder TimedKeyFrames<TState>(
TState state,
Action<ITimedKeyFrameAnimationBuilder<T>, TState> build,
TimeSpan? delay = null,
RepeatOption? repeat = null);
}
}

47
Microsoft.Toolkit.Uwp.UI.Animations/Builders/Interfaces/ITimedKeyFrameAnimationBuilder{T}.cs Normal file
Просмотреть файл

@ -0,0 +1,47 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
using Windows.UI.Xaml.Media.Animation;
using static Microsoft.Toolkit.Uwp.UI.Animations.AnimationExtensions;
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <summary>
/// An interface for an animation builder using timed keyframes.
/// </summary>
/// <typeparam name="T">The type of values being set by the animation being constructed.</typeparam>
public interface ITimedKeyFrameAnimationBuilder<in T>
{
/// <summary>
/// Adds a new timed keyframe to the builder in use.
/// </summary>
/// <param name="progress">The timed progress for the keyframe, relative to the start of the animation.</param>
/// <param name="value">The value for the new keyframe to add.</param>
/// <param name="easingType">The easing type to use to reach the new keyframe.</param>
/// <param name="easingMode">The easing mode to use to reach the new keyframe.</param>
/// <returns>The same <see cref="INormalizedKeyFrameAnimationBuilder{T}"/> instance that the method was invoked upon.</returns>
ITimedKeyFrameAnimationBuilder<T> KeyFrame(
TimeSpan progress,
T value,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode);
/// <summary>
/// Adds a new timed expressionkeyframe to the builder in use.
/// This method can only be used when the animation being built targets the composition layer.
/// </summary>
/// <param name="progress">The timed progress for the keyframe, relative to the start of the animation.</param>
/// <param name="expression">The expression for the new keyframe to add.</param>
/// <param name="easingType">The easing type to use to reach the new keyframe.</param>
/// <param name="easingMode">The easing mode to use to reach the new keyframe.</param>
/// <returns>The same <see cref="INormalizedKeyFrameAnimationBuilder{T}"/> instance that the method was invoked upon.</returns>
/// <exception cref="InvalidOperationException">Thrown when the animation being built targets the XAML layer.</exception>
ITimedKeyFrameAnimationBuilder<T> ExpressionKeyFrame(
TimeSpan progress,
string expression,
EasingType easingType = DefaultEasingType,
EasingMode easingMode = DefaultEasingMode);
}
}

291
Microsoft.Toolkit.Uwp.UI.Animations/Builders/NormalizedKeyFrameAnimationBuilder{T}.Composition.cs Normal file
Просмотреть файл

@ -0,0 +1,291 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
using System.Numerics;
using Microsoft.Toolkit.Diagnostics;
using Windows.UI;
using Windows.UI.Composition;
using Windows.UI.Xaml.Media.Animation;
#nullable enable
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <inheritdoc cref="NormalizedKeyFrameAnimationBuilder{T}"/>
internal abstract partial class NormalizedKeyFrameAnimationBuilder<T>
{
/// <summary>
/// Gets a <see cref="CompositionAnimation"/> instance representing the animation to start.
/// </summary>
/// <typeparam name="TKeyFrame">The type of keyframes being used to define the animation.</typeparam>
/// <param name="target">The target <see cref="CompositionObject"/> instance to animate.</param>
/// <param name="property">The target property to animate.</param>
/// <param name="delay">The optional initial delay for the animation.</param>
/// <param name="duration">The animation duration.</param>
/// <param name="repeat">The <see cref="RepeatOption"/> value for the animation</param>
/// <param name="keyFrames">The list of keyframes to use to build the animation.</param>
/// <returns>A <see cref="CompositionAnimation"/> instance with the specified animation.</returns>
public static CompositionAnimation GetAnimation<TKeyFrame>(
CompositionObject target,
string property,
TimeSpan? delay,
TimeSpan duration,
RepeatOption repeat,
ReadOnlySpan<TKeyFrame> keyFrames)
where TKeyFrame : struct, IKeyFrameInfo
{
KeyFrameAnimation animation;
if (typeof(T) == typeof(bool))
{
BooleanKeyFrameAnimation boolAnimation = target.Compositor.CreateBooleanKeyFrameAnimation();
foreach (ref readonly var keyFrame in keyFrames)
{
if (keyFrame.TryInsertExpressionKeyFrame(boolAnimation, duration))
{
continue;
}
boolAnimation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), keyFrame.GetValueAs<bool>());
}
animation = boolAnimation;
}
else if (typeof(T) == typeof(float))
{
ScalarKeyFrameAnimation scalarAnimation = target.Compositor.CreateScalarKeyFrameAnimation();
foreach (ref readonly var keyFrame in keyFrames)
{
if (keyFrame.TryInsertExpressionKeyFrame(scalarAnimation, duration))
{
continue;
}
CompositionEasingFunction? easingFunction = target.Compositor.TryCreateEasingFunction(keyFrame.EasingType, keyFrame.EasingMode);
if (easingFunction is null)
{
scalarAnimation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), keyFrame.GetValueAs<float>());
}
else
{
scalarAnimation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), keyFrame.GetValueAs<float>(), easingFunction);
}
}
animation = scalarAnimation;
}
else if (typeof(T) == typeof(double))
{
ScalarKeyFrameAnimation scalarAnimation = target.Compositor.CreateScalarKeyFrameAnimation();
foreach (ref readonly var keyFrame in keyFrames)
{
if (keyFrame.TryInsertExpressionKeyFrame(scalarAnimation, duration))
{
continue;
}
CompositionEasingFunction? easingFunction = target.Compositor.TryCreateEasingFunction(keyFrame.EasingType, keyFrame.EasingMode);
if (easingFunction is null)
{
scalarAnimation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), (float)keyFrame.GetValueAs<double>());
}
else
{
scalarAnimation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), (float)keyFrame.GetValueAs<double>(), easingFunction);
}
}
animation = scalarAnimation;
}
else if (typeof(T) == typeof(Vector2))
{
Vector2KeyFrameAnimation vector2Animation = target.Compositor.CreateVector2KeyFrameAnimation();
foreach (ref readonly var keyFrame in keyFrames)
{
if (keyFrame.TryInsertExpressionKeyFrame(vector2Animation, duration))
{
continue;
}
CompositionEasingFunction? easingFunction = target.Compositor.TryCreateEasingFunction(keyFrame.EasingType, keyFrame.EasingMode);
if (easingFunction is null)
{
vector2Animation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), keyFrame.GetValueAs<Vector2>());
}
else
{
vector2Animation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), keyFrame.GetValueAs<Vector2>(), easingFunction);
}
}
animation = vector2Animation;
}
else if (typeof(T) == typeof(Vector3))
{
Vector3KeyFrameAnimation vector3Animation = target.Compositor.CreateVector3KeyFrameAnimation();
foreach (ref readonly var keyFrame in keyFrames)
{
if (keyFrame.TryInsertExpressionKeyFrame(vector3Animation, duration))
{
continue;
}
CompositionEasingFunction? easingFunction = target.Compositor.TryCreateEasingFunction(keyFrame.EasingType, keyFrame.EasingMode);
if (easingFunction is null)
{
vector3Animation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), keyFrame.GetValueAs<Vector3>());
}
else
{
vector3Animation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), keyFrame.GetValueAs<Vector3>(), easingFunction);
}
}
animation = vector3Animation;
}
else if (typeof(T) == typeof(Vector4))
{
Vector4KeyFrameAnimation vector4Animation = target.Compositor.CreateVector4KeyFrameAnimation();
foreach (ref readonly var keyFrame in keyFrames)
{
if (keyFrame.TryInsertExpressionKeyFrame(vector4Animation, duration))
{
continue;
}
CompositionEasingFunction? easingFunction = target.Compositor.TryCreateEasingFunction(keyFrame.EasingType, keyFrame.EasingMode);
if (easingFunction is null)
{
vector4Animation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), keyFrame.GetValueAs<Vector4>());
}
else
{
vector4Animation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), keyFrame.GetValueAs<Vector4>(), easingFunction);
}
}
animation = vector4Animation;
}
else if (typeof(T) == typeof(Color))
{
ColorKeyFrameAnimation colorAnimation = target.Compositor.CreateColorKeyFrameAnimation();
foreach (ref readonly var keyFrame in keyFrames)
{
if (keyFrame.TryInsertExpressionKeyFrame(colorAnimation, duration))
{
continue;
}
CompositionEasingFunction? easingFunction = target.Compositor.TryCreateEasingFunction(keyFrame.EasingType, keyFrame.EasingMode);
if (easingFunction is null)
{
colorAnimation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), keyFrame.GetValueAs<Color>());
}
else
{
colorAnimation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), keyFrame.GetValueAs<Color>(), easingFunction);
}
}
animation = colorAnimation;
}
else if (typeof(T) == typeof(Quaternion))
{
QuaternionKeyFrameAnimation quaternionAnimation = target.Compositor.CreateQuaternionKeyFrameAnimation();
foreach (ref readonly var keyFrame in keyFrames)
{
if (keyFrame.TryInsertExpressionKeyFrame(quaternionAnimation, duration))
{
continue;
}
CompositionEasingFunction? easingFunction = target.Compositor.TryCreateEasingFunction(keyFrame.EasingType, keyFrame.EasingMode);
if (easingFunction is null)
{
quaternionAnimation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), keyFrame.GetValueAs<Quaternion>());
}
else
{
quaternionAnimation.InsertKeyFrame(keyFrame.GetNormalizedProgress(duration), keyFrame.GetValueAs<Quaternion>(), easingFunction);
}
}
animation = quaternionAnimation;
}
else
{
return ThrowHelper.ThrowInvalidOperationException<CompositionAnimation>("Invalid animation type");
}
animation.Duration = duration;
if (delay.HasValue)
{
animation.DelayTime = delay!.Value;
}
animation.Target = property;
(animation.IterationBehavior, animation.IterationCount) = repeat.ToBehaviorAndCount();
return animation;
}
/// <summary>
/// A custom <see cref="NormalizedKeyFrameAnimationBuilder{T}"/> class targeting the composition layer.
/// </summary>
public sealed class Composition : NormalizedKeyFrameAnimationBuilder<T>, AnimationBuilder.ICompositionAnimationFactory
{
/// <summary>
/// Initializes a new instance of the <see cref="NormalizedKeyFrameAnimationBuilder{T}.Composition"/> class.
/// </summary>
/// <inheritdoc cref="NormalizedKeyFrameAnimationBuilder{T}"/>
public Composition(string property, TimeSpan? delay, TimeSpan duration, RepeatOption repeat)
: base(property, delay, duration, repeat)
{
}
/// <inheritdoc/>
public override INormalizedKeyFrameAnimationBuilder<T> ExpressionKeyFrame(
double progress,
string expression,
EasingType easingType,
EasingMode easingMode)
{
this.keyFrames.Append(new(progress, expression, easingType, easingMode));
return this;
}
/// <inheritdoc/>
public CompositionAnimation GetAnimation(CompositionObject targetHint, out CompositionObject? target)
{
target = null;
return GetAnimation(
targetHint,
this.property,
this.delay,
this.duration,
this.repeat,
this.keyFrames.AsSpan());
}
}
}
}

52
Microsoft.Toolkit.Uwp.UI.Animations/Builders/NormalizedKeyFrameAnimationBuilder{T}.Xaml.cs Normal file
Просмотреть файл

@ -0,0 +1,52 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Media.Animation;
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <inheritdoc cref="NormalizedKeyFrameAnimationBuilder{T}"/>
internal abstract partial class NormalizedKeyFrameAnimationBuilder<T>
where T : unmanaged
{
/// <summary>
/// A custom <see cref="NormalizedKeyFrameAnimationBuilder{T}"/> class targeting the XAML layer.
/// </summary>
public sealed class Xaml : NormalizedKeyFrameAnimationBuilder<T>, AnimationBuilder.IXamlAnimationFactory
{
/// <summary>
/// Initializes a new instance of the <see cref="NormalizedKeyFrameAnimationBuilder{T}.Xaml"/> class.
/// </summary>
/// <inheritdoc cref="NormalizedKeyFrameAnimationBuilder{T}"/>
public Xaml(string property, TimeSpan? delay, TimeSpan duration, RepeatOption repeat)
: base(property, delay, duration, repeat)
{
}
/// <inheritdoc/>
public override INormalizedKeyFrameAnimationBuilder<T> ExpressionKeyFrame(
double progress,
string expression,
EasingType easingType,
EasingMode easingMode)
{
throw new InvalidOperationException("Expression keyframes can only be used on the composition layer");
}
/// <inheritdoc/>
public Timeline GetAnimation(DependencyObject targetHint)
{
return TimedKeyFrameAnimationBuilder<T>.GetAnimation(
targetHint,
this.property,
this.delay,
this.duration,
this.repeat,
this.keyFrames.AsSpan());
}
}
}
}

193
Microsoft.Toolkit.Uwp.UI.Animations/Builders/NormalizedKeyFrameAnimationBuilder{T}.cs Normal file
Просмотреть файл

@ -0,0 +1,193 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
using System.Runtime.CompilerServices;
using Microsoft.Toolkit.Uwp.UI.Animations.Builders.Helpers;
using Windows.UI.Composition;
using Windows.UI.Xaml.Media.Animation;
#nullable enable
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <summary>
/// A generic keyframe animation builder.
/// </summary>
/// <typeparam name="T">The type of values being set by the animation being constructed.</typeparam>
internal abstract partial class NormalizedKeyFrameAnimationBuilder<T> : INormalizedKeyFrameAnimationBuilder<T>
where T : unmanaged
{
/// <summary>
/// The target property to animate.
/// </summary>
private readonly string property;
/// <summary>
/// The target delay for the animation, if any.
/// </summary>
private readonly TimeSpan? delay;
/// <summary>
/// The target duration for the animation.
/// </summary>
private readonly TimeSpan duration;
/// <summary>
/// The repeat options for the animation.
/// </summary>
private readonly RepeatOption repeat;
/// <summary>
/// The list builder of keyframes to use.
/// </summary>
private ListBuilder<KeyFrameInfo> keyFrames = ListBuilder<KeyFrameInfo>.Empty;
/// <summary>
/// Initializes a new instance of the <see cref="NormalizedKeyFrameAnimationBuilder{T}"/> class.
/// </summary>
/// <param name="property">The target property to animate.</param>
/// <param name="delay">The target delay for the animation.</param>
/// <param name="duration">The target duration for the animation.</param>
/// <param name="repeat">The repeat options for the animation.</param>
protected NormalizedKeyFrameAnimationBuilder(string property, TimeSpan? delay, TimeSpan duration, RepeatOption repeat)
{
this.property = property;
this.delay = delay;
this.duration = duration;
this.repeat = repeat;
}
/// <inheritdoc/>
public INormalizedKeyFrameAnimationBuilder<T> KeyFrame(
double progress,
T value,
EasingType easingType,
EasingMode easingMode)
{
this.keyFrames.Append(new(progress, value, easingType, easingMode));
return this;
}
/// <inheritdoc/>
public abstract INormalizedKeyFrameAnimationBuilder<T> ExpressionKeyFrame(
double progress,
string expression,
EasingType easingType,
EasingMode easingMode);
/// <summary>
/// The abstracted info for a normalized animation keyframe.
/// </summary>
protected readonly struct KeyFrameInfo : IKeyFrameInfo
{
/// <summary>
/// The normalized progress for the keyframe.
/// </summary>
private readonly double progress;
/// <summary>
/// The value for the current keyframe.
/// </summary>
private readonly T value;
/// <summary>
/// The expression for the current keyframe, if present.
/// </summary>
private readonly string? expression;
/// <summary>
/// Initializes a new instance of the <see cref="KeyFrameInfo"/> struct.
/// </summary>
/// <param name="progress">The normalized progress for the keyframe.</param>
/// <param name="value">The value for the new keyframe to add.</param>
/// <param name="easingType">The easing type to use to reach the new keyframe.</param>
/// <param name="easingMode">The easing mode to use to reach the new keyframe.</param>
public KeyFrameInfo(
double progress,
T value,
EasingType easingType,
EasingMode easingMode)
{
this.progress = progress;
this.value = value;
this.expression = null;
EasingType = easingType;
EasingMode = easingMode;
}
/// <summary>
/// Initializes a new instance of the <see cref="KeyFrameInfo"/> struct.
/// </summary>
/// <param name="progress">The normalized progress for the keyframe.</param>
/// <param name="expression">The expression for the new keyframe to add.</param>
/// <param name="easingType">The easing type to use to reach the new keyframe.</param>
/// <param name="easingMode">The easing mode to use to reach the new keyframe.</param>
public KeyFrameInfo(
double progress,
string expression,
EasingType easingType,
EasingMode easingMode)
{
this.progress = progress;
this.value = default;
this.expression = expression;
EasingType = easingType;
EasingMode = easingMode;
}
/// <inheritdoc/>
public EasingType EasingType { get; }
/// <inheritdoc/>
public EasingMode EasingMode { get; }
/// <inheritdoc/>
[MethodImpl(MethodImplOptions.AggressiveInlining)]
public TValue GetValueAs<TValue>()
{
return Unsafe.As<T, TValue>(ref Unsafe.AsRef(in this.value));
}
/// <inheritdoc/>
public bool TryInsertExpressionKeyFrame(KeyFrameAnimation animation, TimeSpan duration)
{
if (this.expression is null)
{
return false;
}
CompositionEasingFunction? easingFunction = animation.Compositor.TryCreateEasingFunction(EasingType, EasingMode);
if (easingFunction is null)
{
animation.InsertExpressionKeyFrame((float)this.progress, this.expression);
}
else
{
animation.InsertExpressionKeyFrame((float)this.progress, this.expression, easingFunction);
}
return true;
}
/// <inheritdoc/>
[MethodImpl(MethodImplOptions.AggressiveInlining)]
public float GetNormalizedProgress(TimeSpan duration)
{
return (float)this.progress;
}
/// <inheritdoc/>
[MethodImpl(MethodImplOptions.AggressiveInlining)]
public TimeSpan GetTimedProgress(TimeSpan duration)
{
return TimeSpan.FromMilliseconds(duration.TotalMilliseconds * this.progress);
}
}
}
}

63
Microsoft.Toolkit.Uwp.UI.Animations/Builders/TimedKeyFrameAnimationBuilder{T}.Composition.cs Normal file
Просмотреть файл

@ -0,0 +1,63 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using System;
using Windows.UI.Composition;
using Windows.UI.Xaml.Media.Animation;
#nullable enable
namespace Microsoft.Toolkit.Uwp.UI.Animations
{
/// <inheritdoc cref="TimedKeyFrameAnimationBuilder{T}"/>
internal abstract partial class TimedKeyFrameAnimationBuilder<T>
where T : unmanaged
{
/// <summary>
/// A custom <see cref="TimedKeyFrameAnimationBuilder{T}"/> class targeting the composition layer.
/// </summary>
public sealed class Composition : TimedKeyFrameAnimationBuilder<T>, AnimationBuilder.ICompositionAnimationFactory
{
/// <summary>
/// Initializes a new instance of the <see cref="TimedKeyFrameAnimationBuilder{T}.Composition"/> class.
/// </summary>
/// <inheritdoc cref="TimedKeyFrameAnimationBuilder{T}"/>
public Composition(string property, TimeSpan? delay, RepeatOption repeat)
: base(property, delay, repeat)
{
}
/// <inheritdoc/>
public override ITimedKeyFrameAnimationBuilder<T> ExpressionKeyFrame(
TimeSpan progress,
string expression,
EasingType easingType,
EasingMode easingMode)
{
this.keyFrames.Append(new(progress, expression, easingType, easingMode));
return this;
}
/// <inheritdoc/>
public CompositionAnimation GetAnimation(CompositionObject targetHint, out CompositionObject? target)
{
target = null;
// We can retrieve the total duration from the last timed keyframe, and then set
// this as the target duration and use it to normalize the keyframe progresses.
ReadOnlySpan<KeyFrameInfo> keyFrames = this.keyFrames.AsSpan();
TimeSpan duration = keyFrames[keyFrames.Length - 1].GetTimedProgress(default);
return NormalizedKeyFrameAnimationBuilder<T>.GetAnimation(
targetHint,
this.property,
this.delay,
duration,
this.repeat,
keyFrames);
}
}
}
}

Некоторые файлы не были показаны из-за слишком большого количества измененных файлов Показать больше