diff --git a/samples/ControlCatalog/ControlCatalog.csproj b/samples/ControlCatalog/ControlCatalog.csproj
index c0e24357ca..117a9fad61 100644
--- a/samples/ControlCatalog/ControlCatalog.csproj
+++ b/samples/ControlCatalog/ControlCatalog.csproj
@@ -28,5 +28,11 @@
+
+
+ TransitioningContentControlPage.axaml
+
+
+
diff --git a/samples/ControlCatalog/MainView.xaml b/samples/ControlCatalog/MainView.xaml
index facce2aa82..f3b52428ca 100644
--- a/samples/ControlCatalog/MainView.xaml
+++ b/samples/ControlCatalog/MainView.xaml
@@ -145,6 +145,9 @@
+
+
+
diff --git a/samples/ControlCatalog/Pages/TransitioningContentControlPage.axaml b/samples/ControlCatalog/Pages/TransitioningContentControlPage.axaml
new file mode 100644
index 0000000000..20cd78abd3
--- /dev/null
+++ b/samples/ControlCatalog/Pages/TransitioningContentControlPage.axaml
@@ -0,0 +1,35 @@
+
+
+
+
+
+
+
+ The TransitioningContentControl control allows you to show a page transition whenever the Content changes.
+
+
+
+ Select a transition
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/samples/ControlCatalog/Pages/TransitioningContentControlPage.axaml.cs b/samples/ControlCatalog/Pages/TransitioningContentControlPage.axaml.cs
new file mode 100644
index 0000000000..2851a6c890
--- /dev/null
+++ b/samples/ControlCatalog/Pages/TransitioningContentControlPage.axaml.cs
@@ -0,0 +1,19 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Markup.Xaml;
+
+namespace ControlCatalog.Pages
+{
+ public partial class TransitioningContentControlPage : UserControl
+ {
+ public TransitioningContentControlPage()
+ {
+ InitializeComponent();
+ }
+
+ private void InitializeComponent()
+ {
+ AvaloniaXamlLoader.Load(this);
+ }
+ }
+}
diff --git a/samples/ControlCatalog/ViewModels/TransitioningContentControlPageViewModel.cs b/samples/ControlCatalog/ViewModels/TransitioningContentControlPageViewModel.cs
new file mode 100644
index 0000000000..edf3579ac9
--- /dev/null
+++ b/samples/ControlCatalog/ViewModels/TransitioningContentControlPageViewModel.cs
@@ -0,0 +1,110 @@
+using System;
+using System.Collections.Generic;
+using System.IO;
+using System.Text;
+using Avalonia;
+using Avalonia.Animation;
+using Avalonia.Media.Imaging;
+using Avalonia.Platform;
+using MiniMvvm;
+
+namespace ControlCatalog.ViewModels
+{
+ public class TransitioningContentControlPageViewModel : ViewModelBase
+ {
+ public TransitioningContentControlPageViewModel()
+ {
+ var assetLoader = AvaloniaLocator.Current.GetService();
+
+ var images = new string[]
+ {
+ "delicate-arch-896885_640.jpg",
+ "hirsch-899118_640.jpg",
+ "maple-leaf-888807_640.jpg"
+ };
+
+ foreach (var image in images)
+ {
+ var path = $"avares://ControlCatalog/Assets/{image}";
+ Images.Add(new Bitmap(assetLoader.Open(new Uri(path))));
+ }
+
+ SelectedImage = Images[0];
+ SelectedTransition = PageTransitions[0];
+ }
+
+ public List PageTransitions { get; } = new List()
+ {
+ new PageTransition("Slide horizontally", new PageSlide(TimeSpan.FromMilliseconds(500), PageSlide.SlideAxis.Horizontal)),
+ new PageTransition("Slide vertically", new PageSlide(TimeSpan.FromMilliseconds(500), PageSlide.SlideAxis.Vertical))
+ };
+
+ public List Images { get; } = new List();
+
+
+ private Bitmap? _SelectedImage;
+
+ ///
+ /// Gets or Sets the selected image
+ ///
+ public Bitmap? SelectedImage
+ {
+ get { return _SelectedImage; }
+ set { this.RaiseAndSetIfChanged(ref _SelectedImage, value); }
+ }
+
+
+ private PageTransition _SelectedTransition;
+
+ ///
+ /// Gets or sets the transition to play
+ ///
+ public PageTransition SelectedTransition
+ {
+ get { return _SelectedTransition; }
+ set { this.RaiseAndSetIfChanged(ref _SelectedTransition, value); }
+ }
+
+ public void NextImage()
+ {
+ var index = Images.IndexOf(SelectedImage) + 1;
+
+ if (index >= Images.Count)
+ {
+ index = 0;
+ }
+
+ SelectedImage = Images[index];
+ }
+
+ public void PrevImage()
+ {
+ var index = Images.IndexOf(SelectedImage) - 1;
+
+ if (index < 0)
+ {
+ index = Images.Count-1;
+ }
+
+ SelectedImage = Images[index];
+ }
+ }
+
+ public class PageTransition
+ {
+ public PageTransition(string displayTitle, IPageTransition transition)
+ {
+ DisplayTitle = displayTitle;
+ Transition = transition;
+ }
+
+ public string DisplayTitle { get; }
+ public IPageTransition Transition { get; }
+
+ public override string ToString()
+ {
+ return DisplayTitle;
+ }
+
+ }
+}