diff --git a/components/MarqueeText/samples/CustomStyleMarqueeTextSample.xaml b/components/MarqueeText/samples/CustomStyleMarqueeTextSample.xaml new file mode 100644 index 000000000..5ae3e61ed --- /dev/null +++ b/components/MarqueeText/samples/CustomStyleMarqueeTextSample.xaml @@ -0,0 +1,179 @@ + + + + + + + + + + + diff --git a/components/MarqueeText/samples/CustomStyleMarqueeTextSample.xaml.cs b/components/MarqueeText/samples/CustomStyleMarqueeTextSample.xaml.cs new file mode 100644 index 000000000..45008f2c9 --- /dev/null +++ b/components/MarqueeText/samples/CustomStyleMarqueeTextSample.xaml.cs @@ -0,0 +1,29 @@ +// 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 CommunityToolkit.Labs.WinUI.MarqueeTextRns; + +namespace MarqueeTextExperiment.Samples; + +[ToolkitSample(id: nameof(CustomStyleMarqueeTextSample), "MarqueeText", description: "A control for scrolling text in a marquee fashion.")] +[ToolkitSampleTextOption("MQText", LoremIpsum, Title = "Text")] +//[ToolkitSampleMultiChoiceOption("MarqueeRepeat", "Repeat", "Forever", "1x", "2x")] +public sealed partial class CustomStyleMarqueeTextSample : Page +{ + private const string LoremIpsum = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."; + + public CustomStyleMarqueeTextSample() + { + this.InitializeComponent(); + } + + private MarqueeDirection ConvertStringToMarqueeDirection(string str) => str switch + { + "Left" => MarqueeDirection.Left, + "Up" => MarqueeDirection.Up, + "Right" => MarqueeDirection.Right, + "Down" => MarqueeDirection.Down, + _ => throw new System.NotImplementedException(), + }; +} diff --git a/components/MarqueeText/samples/MarqueeText.Samples.csproj b/components/MarqueeText/samples/MarqueeText.Samples.csproj index fc4e7acb7..71cf1d437 100644 --- a/components/MarqueeText/samples/MarqueeText.Samples.csproj +++ b/components/MarqueeText/samples/MarqueeText.Samples.csproj @@ -17,9 +17,17 @@ + + PreserveNewest + + + + CustomStyleMarqueeTextSample.xaml + + diff --git a/components/MarqueeText/samples/MarqueeText.md b/components/MarqueeText/samples/MarqueeText.md index 786ee98f9..ea8480504 100644 --- a/components/MarqueeText/samples/MarqueeText.md +++ b/components/MarqueeText/samples/MarqueeText.md @@ -44,3 +44,9 @@ The repeat behavior determines how many times the marquee will loop before the a The default direction is left, meaning the text will move leftwards, but this can be changed to right, up, or down. Direction changed between left and right or up and down are handled continously, meaning that the animation will resume from its current position if changed between these directions. > [!Sample MarqueeTextSample] + +### Custom Transition Animations + +The transition animation can be customized using a style. + +> [!Sample CustomStyleMarqueeTextSample] diff --git a/components/MarqueeText/samples/MarqueeTextSample.xaml b/components/MarqueeText/samples/MarqueeTextSample.xaml index 292baeff4..339ac8087 100644 --- a/components/MarqueeText/samples/MarqueeTextSample.xaml +++ b/components/MarqueeText/samples/MarqueeTextSample.xaml @@ -1,4 +1,4 @@ - + - + Text="{x:Bind MQText, Mode=OneWay}" /> + +