From d5dfef17116714db9dc998ec6bbbf8f19ec948a6 Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Wed, 18 Sep 2024 17:10:49 -0400
Subject: [PATCH 01/30] feat: ZoomContentControl is a stand alone control in
 Toolkit now

---
 .../ZoomContentControl.xaml                   |  81 ++
 .../ZoomContentControl.xaml.cs                | 777 ++++++++++++++++++
 2 files changed, 858 insertions(+)
 create mode 100644 src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
 create mode 100644 src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
new file mode 100644
index 000000000..6391c6940
--- /dev/null
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
@@ -0,0 +1,81 @@
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+					xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+					xmlns:ctl="using:Uno.Toolkit.UI.Controls">
+
+	<Style x:Key="DefaultZoomContentControlStyle"
+		   TargetType="ctl:ZoomContentControl">
+		<Setter Property="Template">
+			<Setter.Value>
+				<ControlTemplate TargetType="ctl:ZoomContentControl">
+					<Grid x:Name="PART_RootGrid"
+						  Background="Transparent">
+						<Grid.RowDefinitions>
+							<RowDefinition Height="*" />
+							<RowDefinition Height="Auto" />
+						</Grid.RowDefinitions>
+						<Grid.ColumnDefinitions>
+							<ColumnDefinition Width="*" />
+							<ColumnDefinition Width="Auto" />
+						</Grid.ColumnDefinitions>
+						<Canvas x:Name="PART_Canvas">
+							<ContentPresenter x:Name="PART_Presenter"
+											  Grid.Row="0"
+											  Grid.Column="0"
+											  Margin="0"
+											  Padding="0"
+											  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+											  VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+											  Content="{TemplateBinding Content}"
+											  ContentTemplate="{TemplateBinding ContentTemplate}">
+								<ContentPresenter.RenderTransform>
+									<TransformGroup>
+										<ScaleTransform CenterX="{TemplateBinding HorizontalZoomCenter}"
+														CenterY="{TemplateBinding VerticalZoomCenter}"
+														ScaleX="{TemplateBinding ZoomLevel}"
+														ScaleY="{TemplateBinding ZoomLevel}" />
+										<TranslateTransform X="{TemplateBinding HorizontalOffset}"
+															Y="{TemplateBinding VerticalOffset}" />
+									</TransformGroup>
+								</ContentPresenter.RenderTransform>
+							</ContentPresenter>
+						</Canvas>
+						<!-- Vertical ScrollBar -->
+						<ScrollBar x:Name="PART_ScrollV"
+								   Grid.Row="0"
+								   Grid.Column="1"
+								   HorizontalAlignment="Right"
+								   VerticalAlignment="Stretch"
+								   IndicatorMode="MouseIndicator"
+								   LargeChange="10"
+								   Maximum="{TemplateBinding VerticalMaxScroll}"
+								   Minimum="{TemplateBinding VerticalMinScroll}"
+								   Orientation="Vertical"
+								   SmallChange="1"
+								   Visibility="{TemplateBinding IsVerticalScrollBarVisible}"
+								   ViewportSize="{TemplateBinding ViewPortHeight}"
+								   Value="{TemplateBinding VerticalScrollValue}" />
+						<!-- Horizontal ScrollBar -->
+						<ScrollBar x:Name="PART_ScrollH"
+								   Grid.Row="1"
+								   Grid.Column="0"
+								   HorizontalAlignment="Stretch"
+								   VerticalAlignment="Bottom"
+								   IndicatorMode="MouseIndicator"
+								   LargeChange="10"
+								   Maximum="{TemplateBinding HorizontalMaxScroll}"
+								   Minimum="{TemplateBinding HorizontalMinScroll}"
+								   Orientation="Horizontal"
+								   SmallChange="1"
+								   Visibility="{TemplateBinding IsHorizontalScrollBarVisible}"
+								   ViewportSize="{TemplateBinding ViewPortWidth}"
+								   Value="{TemplateBinding HorizontalScrollValue}" />
+					</Grid>
+				</ControlTemplate>
+			</Setter.Value>
+		</Setter>
+	</Style>
+
+	<Style BasedOn="{StaticResource DefaultZoomContentControlStyle}"
+		   TargetType="ctl:ZoomContentControl" />
+
+</ResourceDictionary>
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs
new file mode 100644
index 000000000..b549f7504
--- /dev/null
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs
@@ -0,0 +1,777 @@
+using System;
+using System.Collections;
+using System.Collections.Generic;
+using System.Collections.ObjectModel;
+using System.Linq;
+using System.Numerics;
+using Uno.Disposables;
+using Uno.Extensions.Specialized;
+using Windows.Foundation;
+using Windows.Foundation.Collections;
+using System.Threading.Tasks;
+
+#if IS_WINUI
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
+using Microsoft.UI.Xaml.Controls.Primitives;
+using Microsoft.UI.Xaml.Data;
+using Microsoft.UI.Xaml.Input;
+using Microsoft.UI.Xaml.Media;
+using Microsoft.UI.Xaml.Navigation;
+using Microsoft.UI.Input;
+#else
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Controls;
+using Windows.UI.Xaml.Controls.Primitives;
+using Windows.UI.Xaml.Data;
+using Windows.UI.Xaml.Input;
+using Windows.UI.Xaml.Media;
+using Windows.UI.Xaml.Navigation;
+using Windows.UI.Input;
+using Windows.Devices.Input;
+#endif
+
+
+namespace Uno.Toolkit.UI;
+
+[TemplatePart(Name = Parts.RootGrid, Type = typeof(Grid))]
+[TemplatePart(Name = Parts.Presenter, Type = typeof(ContentPresenter))]
+[TemplatePart(Name = Parts.VerticalScrollBar, Type = typeof(ScrollBar))]
+[TemplatePart(Name = Parts.HorizontalScrollBar, Type = typeof(ScrollBar))]
+public partial class ZoomContentControl : ContentControl
+{
+	private static class Parts
+	{
+		public const string RootGrid = "PART_RootGrid";
+
+		public const string Presenter = "PART_Presenter";
+
+		public const string HorizontalScrollBar = "PART_ScrollH";
+		public const string VerticalScrollBar = "PART_ScrollV";
+	}
+
+	private Grid? _grid;
+	private ContentPresenter? _presenter;
+	private ScrollBar? _scrollV;
+	private ScrollBar? _scrollH;
+
+	private Point _lastPosition = new Point(0, 0);
+
+	private (bool Horizontal, bool Vertical) _movimentDirection = (false, false);
+
+	private bool IsAllowedToWork => (IsEnabled && IsActive && _presenter is not null);
+
+	public bool ResetWhenNotActive { get; set; } = true;
+
+	public Size AvailableSize
+	{
+		get
+		{
+			var vOffset = (AdditionalMargin.Top + AdditionalMargin.Bottom);
+			var hOffset = (AdditionalMargin.Left + AdditionalMargin.Right);
+			return new Size(ActualWidth - hOffset, ActualHeight - vOffset);
+		}
+	}
+
+	public event EventHandler<EventArgs>? RenderedContentUpdated;
+
+	#region Dependency Properties
+	public static readonly DependencyProperty AdditionalMarginProperty =
+		DependencyProperty.Register(nameof(AdditionalMargin), typeof(Thickness), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: new Thickness(0)));
+
+	public static readonly DependencyProperty AutoZoomToCanvasOnSizeChangedProperty =
+		DependencyProperty.Register(nameof(AutoZoomToCanvasOnSizeChanged), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
+
+	public static readonly DependencyProperty IsActiveProperty =
+		DependencyProperty.Register(nameof(IsActive), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
+
+	public static readonly DependencyProperty IsHorizontalScrollBarVisibleProperty =
+		DependencyProperty.Register(nameof(IsHorizontalScrollBarVisible), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
+
+	public static readonly DependencyProperty IsVerticalScrollBarVisibleProperty =
+		DependencyProperty.Register(nameof(IsVerticalScrollBarVisible), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
+
+	public static readonly DependencyProperty ContentBoundsVisibilityDataProperty =
+		DependencyProperty.Register(nameof(ContentBoundsVisibility), typeof(BoundsVisibilityData), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: new BoundsVisibilityData(leftEdge: false, topEdge: false, rightEdge: false, bottomEdge: false)));
+
+	public static readonly DependencyProperty IsZoomAllowedProperty =
+	DependencyProperty.Register(nameof(IsZoomAllowed), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
+
+	public static readonly DependencyProperty ZoomLevelProperty =
+	DependencyProperty.Register(nameof(ZoomLevel), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(1d));
+
+	public static readonly DependencyProperty MinZoomLevelProperty =
+	DependencyProperty.Register(nameof(MinZoomLevel), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+
+	public static readonly DependencyProperty MaxZoomLevelProperty =
+	DependencyProperty.Register(nameof(MaxZoomLevel), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(500d));
+
+	public static readonly DependencyProperty HorizontalZoomCenterProperty =
+	DependencyProperty.Register(nameof(HorizontalZoomCenter), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+
+	public static readonly DependencyProperty VerticalZoomCenterProperty =
+	DependencyProperty.Register(nameof(VerticalZoomCenter), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+
+	public static readonly DependencyProperty ScaleWheelRatioProperty =
+	DependencyProperty.Register(nameof(ScaleWheelRatio), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0006d));
+
+	public static readonly DependencyProperty PanWheelRatioProperty =
+	DependencyProperty.Register(nameof(PanWheelRatio), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.25d));
+
+	public static readonly DependencyProperty IsPanAllowedProperty =
+	DependencyProperty.Register(nameof(IsPanAllowed), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
+
+	public static readonly DependencyProperty HorizontalOffsetProperty =
+	DependencyProperty.Register(nameof(HorizontalOffset), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+
+	public static readonly DependencyProperty VerticalOffsetProperty =
+	DependencyProperty.Register(nameof(VerticalOffset), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+
+	public static readonly DependencyProperty VerticalMaxScrollProperty =
+	DependencyProperty.Register(nameof(VerticalMaxScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+
+	public static readonly DependencyProperty VerticalMinScrollProperty =
+	DependencyProperty.Register(nameof(VerticalMinScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+
+	public static readonly DependencyProperty HorizontalMaxScrollProperty =
+	DependencyProperty.Register(nameof(HorizontalMaxScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+
+	public static readonly DependencyProperty HorizontalMinScrollProperty =
+	DependencyProperty.Register(nameof(HorizontalMinScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+
+	public static readonly DependencyProperty HorizontalScrollValueProperty =
+	DependencyProperty.Register(nameof(HorizontalScrollValue), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+
+	public static readonly DependencyProperty VerticalScrollValueProperty =
+	DependencyProperty.Register(nameof(VerticalScrollValue), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+
+	public static readonly DependencyProperty ViewPortWidthProperty =
+	DependencyProperty.Register(nameof(ViewPortWidth), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+
+	public static readonly DependencyProperty ViewPortHeightProperty =
+	DependencyProperty.Register(nameof(ViewPortHeight), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+
+	//Not a real margin, but a spacing to avoid overlapped by ShellControlPanel
+	public Thickness AdditionalMargin
+	{
+		get => (Thickness)GetValue(AdditionalMarginProperty);
+		set => SetValue(AdditionalMarginProperty, value);
+	}
+
+	public bool AutoZoomToCanvasOnSizeChanged
+	{
+		get => (bool)GetValue(AutoZoomToCanvasOnSizeChangedProperty);
+		set => SetValue(AutoZoomToCanvasOnSizeChangedProperty, value);
+	}
+
+	public bool IsActive
+	{
+		get => (bool)GetValue(IsActiveProperty);
+		set => SetValue(IsActiveProperty, value);
+	}
+
+	public bool IsZoomAllowed
+	{
+		get => (bool)GetValue(IsZoomAllowedProperty);
+		set => SetValue(IsZoomAllowedProperty, value);
+	}
+
+	public bool IsHorizontalScrollBarVisible
+	{
+		get => (bool)GetValue(IsHorizontalScrollBarVisibleProperty);
+		set => SetValue(IsHorizontalScrollBarVisibleProperty, value);
+	}
+
+	public bool IsVerticalScrollBarVisible
+	{
+		get => (bool)GetValue(IsVerticalScrollBarVisibleProperty);
+		set => SetValue(IsVerticalScrollBarVisibleProperty, value);
+	}
+
+	public BoundsVisibilityData ContentBoundsVisibility
+	{
+		get => (BoundsVisibilityData)GetValue(ContentBoundsVisibilityDataProperty);
+		set => SetValue(ContentBoundsVisibilityDataProperty, value);
+	}
+
+	public double ZoomLevel
+	{
+		get => (double)GetValue(ZoomLevelProperty);
+		set => SetValue(ZoomLevelProperty, value);
+	}
+
+	public double MinZoomLevel
+	{
+		get => (double)GetValue(MinZoomLevelProperty);
+		set => SetValue(MinZoomLevelProperty, value);
+	}
+
+	public double MaxZoomLevel
+	{
+		get => (double)GetValue(MaxZoomLevelProperty);
+		set => SetValue(MaxZoomLevelProperty, value);
+	}
+
+	public double HorizontalZoomCenter
+	{
+		get => (double)GetValue(HorizontalZoomCenterProperty);
+		set => SetValue(HorizontalZoomCenterProperty, value);
+	}
+
+	public double VerticalZoomCenter
+	{
+		get => (double)GetValue(VerticalZoomCenterProperty);
+		set => SetValue(VerticalZoomCenterProperty, value);
+	}
+
+	public double ScaleWheelRatio
+	{
+		get => (double)GetValue(ScaleWheelRatioProperty);
+		set => SetValue(ScaleWheelRatioProperty, value);
+	}
+
+	public double PanWheelRatio
+	{
+		get => (double)GetValue(PanWheelRatioProperty);
+		set => SetValue(PanWheelRatioProperty, value);
+	}
+
+	public bool IsPanAllowed
+	{
+		get => (bool)GetValue(IsPanAllowedProperty);
+		set => SetValue(IsPanAllowedProperty, value);
+	}
+
+	public double HorizontalOffset
+	{
+		get => (double)GetValue(HorizontalOffsetProperty);
+		set => SetValue(HorizontalOffsetProperty, value);
+	}
+
+	public double VerticalOffset
+	{
+		get => (double)GetValue(VerticalOffsetProperty);
+		set => SetValue(VerticalOffsetProperty, value);
+	}
+
+	public double VerticalMaxScroll
+	{
+		get => (double)GetValue(VerticalMaxScrollProperty);
+		set => SetValue(VerticalMaxScrollProperty, value);
+	}
+
+	public double VerticalMinScroll
+	{
+		get => (double)GetValue(VerticalMinScrollProperty);
+		set => SetValue(VerticalMinScrollProperty, value);
+	}
+
+	public double HorizontalMaxScroll
+	{
+		get => (double)GetValue(HorizontalMaxScrollProperty);
+		set => SetValue(HorizontalMaxScrollProperty, value);
+	}
+
+	public double HorizontalMinScroll
+	{
+		get => (double)GetValue(HorizontalMinScrollProperty);
+		set => SetValue(HorizontalMinScrollProperty, value);
+	}
+
+	public double HorizontalScrollValue
+	{
+		get => (double)GetValue(HorizontalScrollValueProperty);
+		set => SetValue(HorizontalScrollValueProperty, value);
+	}
+
+	public double VerticalScrollValue
+	{
+		get => (double)GetValue(VerticalScrollValueProperty);
+		set => SetValue(VerticalScrollValueProperty, value);
+	}
+
+	public double ViewPortHeight
+	{
+		get => (double)GetValue(ViewPortHeightProperty);
+		set => SetValue(ViewPortHeightProperty, value);
+	}
+
+	public double ViewPortWidth
+	{
+		get => (double)GetValue(ViewPortWidthProperty);
+		set => SetValue(ViewPortWidthProperty, value);
+	}
+
+	#endregion
+
+	private async Task RaiseRenderedContentUpdated()
+	{
+		await Task.Yield();
+		RenderedContentUpdated?.Invoke(this, EventArgs.Empty);
+	}
+
+	private void RegisterPropertyHandlers()
+	{
+		// Register for property changed events.
+		RegisterPropertyChangedCallback(ZoomLevelProperty, OnZoomLevelChanged);
+		RegisterPropertyChangedCallback(MinZoomLevelProperty, CoerceZoomLevel);
+		RegisterPropertyChangedCallback(MaxZoomLevelProperty, CoerceZoomLevel);
+
+		RegisterPropertyChangedCallback(HorizontalOffsetProperty, OnHorizontalOffsetChanged);
+		RegisterPropertyChangedCallback(VerticalOffsetProperty, OnVerticalOffsetChanged);
+
+		RegisterPropertyChangedCallback(IsActiveProperty, IsActiveChanged);
+
+		this.SizeChanged += (s, e) => UpdateContentBoundsVisibility();
+	}
+
+	private void OnVerticalOffsetChanged(DependencyObject sender, DependencyProperty dp)
+	{
+		UpdateContentBoundsVisibility();
+		UpdateScrollVisibility();
+		UpdateVerticalScrollBarValue();
+	}
+
+	private void OnHorizontalOffsetChanged(DependencyObject sender, DependencyProperty dp)
+	{
+		UpdateContentBoundsVisibility();
+		UpdateScrollVisibility();
+		UpdateHorizontalScrollBarValue();
+	}
+
+	private async void OnZoomLevelChanged(DependencyObject sender, DependencyProperty dp)
+	{
+		CoerceZoomLevel(sender, dp);
+		UpdateScrollLimits();
+		UpdateContentBoundsVisibility();
+		UpdateScrollVisibility();
+		await RaiseRenderedContentUpdated();
+	}
+
+	public record BoundsVisibilityData
+	{
+		public bool LeftEdge { get; init; }
+
+		public bool TopEdge { get; init; }
+
+		public bool RightEdge { get; init; }
+
+		public bool BottomEdge { get; init; }
+
+		public bool AllEdgesVisible { get; init; }
+
+		public BoundsVisibilityData(bool leftEdge, bool topEdge, bool rightEdge, bool bottomEdge)
+		{
+			LeftEdge = leftEdge;
+			TopEdge = topEdge;
+			RightEdge = rightEdge;
+			BottomEdge = bottomEdge;
+			AllEdgesVisible = LeftEdge && TopEdge && RightEdge && BottomEdge;
+		}
+	}
+
+	private void UpdateContentBoundsVisibility()
+	{
+		if (_presenter?.Content is FrameworkElement fe)
+		{
+			var m = GetPositionMatrix(fe, this);
+
+			ContentBoundsVisibility = new BoundsVisibilityData(
+				m.OffsetX >= 0,
+				m.OffsetY >= 0,
+				this.ActualWidth >= (fe.ActualWidth * ZoomLevel) + m.OffsetX,
+				this.ActualHeight >= (fe.ActualHeight * ZoomLevel) + m.OffsetY);
+		}
+	}
+
+	private void UpdateScrollVisibility()
+	{
+		IsHorizontalScrollBarVisible = !(ContentBoundsVisibility.RightEdge && ContentBoundsVisibility.LeftEdge);
+		IsVerticalScrollBarVisible = !(ContentBoundsVisibility.TopEdge && ContentBoundsVisibility.BottomEdge);
+	}
+
+	private bool CanMoveThisWay()
+	{
+		if (ContentBoundsVisibility.AllEdgesVisible)
+		{
+			return false;
+		}
+
+		var rules = false;
+		rules |= !ContentBoundsVisibility.LeftEdge && _movimentDirection.Horizontal is true;
+		rules |= !ContentBoundsVisibility.RightEdge && _movimentDirection.Horizontal is false;
+		rules |= !ContentBoundsVisibility.TopEdge && _movimentDirection.Vertical is true;
+		rules |= !ContentBoundsVisibility.BottomEdge && _movimentDirection.Vertical is false;
+
+		return rules;
+	}
+
+	private bool CanScrollUp() => !ContentBoundsVisibility.TopEdge;
+
+	private bool CanScrollDown() => !ContentBoundsVisibility.BottomEdge;
+
+	private bool CanScrollLeft() => !ContentBoundsVisibility.LeftEdge;
+
+	private bool CanScrollRight() => !ContentBoundsVisibility.RightEdge;
+
+	//Slide move is always on the opposite direction of the drag
+	private async void UpdateVerticalScrollBarValue()
+	{
+		VerticalScrollValue = VerticalOffset;
+		await RaiseRenderedContentUpdated();
+	}
+
+	//Slide move is always on the opposite direction of the drag
+	private async void UpdateHorizontalScrollBarValue()
+	{
+		HorizontalScrollValue = -1 * HorizontalOffset;
+		await RaiseRenderedContentUpdated();
+	}
+
+	private void IsActiveChanged(DependencyObject sender, DependencyProperty dp)
+	{
+		if (ResetWhenNotActive && !IsActive)
+		{
+			RemoveOffset();
+			ResetZoom();
+		}
+		if (_scrollH is not null)
+		{
+			_scrollH.Visibility = IsActive ? Visibility.Visible : Visibility.Collapsed;
+		}
+		if (_scrollV is not null)
+		{
+			_scrollV.Visibility = IsActive ? Visibility.Visible : Visibility.Collapsed;
+		}
+	}
+
+	private void UpdateScrollLimits()
+	{
+		if (_presenter?.Content is FrameworkElement fe)
+		{
+			// If Actual Width/Height * Zoom < ViewPort Width/Height there should be no scroll
+			// If Actual Width/Height * Zoom > ViewPort Width/Height the amount of scroll should
+			// be based on the difference between the two values
+			var verticalScroll = Math.Max(0, (fe.ActualHeight * ZoomLevel) - ViewPortHeight);
+			var horizontalScroll = Math.Max(0, (fe.ActualWidth * ZoomLevel) - ViewPortWidth);
+
+			HorizontalMaxScroll = horizontalScroll / 2;
+			VerticalMaxScroll = verticalScroll / 2;
+
+			HorizontalMinScroll = -1 * HorizontalMaxScroll;
+			VerticalMinScroll = -1 * VerticalMaxScroll;
+		}
+	}
+
+	private void CoerceZoomLevel(DependencyObject sender, DependencyProperty dp)
+	{
+		var control = (ZoomContentControl)sender;
+		control.ZoomLevel = Math.Clamp(control.ZoomLevel, control.MinZoomLevel, control.MaxZoomLevel);
+	}
+
+	public ZoomContentControl()
+	{
+		DefaultStyleKey = typeof(ZoomContentControl);
+
+		RegisterPropertyHandlers();
+
+		this.SizeChanged += ZoomContentControl_SizeChanged;
+	}
+
+	private void ZoomContentControl_SizeChanged(object sender, SizeChangedEventArgs args)
+	{
+		if (AutoZoomToCanvasOnSizeChanged)
+		{
+			ZoomToCanvas();
+		}
+	}
+
+	protected override void OnApplyTemplate()
+	{
+		_grid = GetTemplateChild(Parts.RootGrid) as Grid;
+		_presenter = GetTemplateChild(Parts.Presenter) as ContentPresenter;
+		_scrollV = GetTemplateChild(Parts.VerticalScrollBar) as ScrollBar;
+		_scrollH = GetTemplateChild(Parts.HorizontalScrollBar) as ScrollBar;
+
+		if (_grid is null ||
+			_presenter is null ||
+			_scrollH is null ||
+			_scrollV is null)
+		{
+			throw new InvalidOperationException("ZoomContentControl template is missing required parts.");
+		}
+
+		RegisterToControlEvents();
+
+		ResetOffset();
+		ResetZoom();
+		RegisterPointerHandlers();
+	}
+
+	#region ScrollBars Events
+
+	private void RegisterToControlEvents()
+	{
+		if (_presenter?.Content is FrameworkElement { } fe)
+		{
+			fe.LayoutUpdated += (s, e) =>
+			{
+				ViewPortWidth = fe.ActualWidth;
+				ViewPortHeight = fe.ActualHeight;
+
+				UpdateScrollLimits();
+			};
+		}
+
+		//due to templatebinding there's no TwoWay mode. We need to manually update the values
+		if (_scrollV is not null)
+		{
+			_scrollV.Scroll += ScrollV_Scroll;
+		}
+
+		if (_scrollH is not null)
+		{
+			_scrollH.Scroll += ScrollH_Scroll;
+		}
+	}
+
+	private double _previousVerticalScrollValue = double.MinValue;
+
+	private double _previousHorizontalScrollValue = double.MinValue;
+
+	//TemplateBinding doesn't support TwoWay mode. We need to manually update the values
+	private void ScrollV_Scroll(object sender, ScrollEventArgs e)
+	{
+		if ((_previousVerticalScrollValue > e.NewValue && !CanScrollUp()) ||
+			(_previousVerticalScrollValue < e.NewValue && !CanScrollDown()))
+		{
+			return;
+		}
+
+		VerticalOffset = -1 * e.NewValue;
+		_previousVerticalScrollValue = e.NewValue;
+	}
+
+	private void ScrollH_Scroll(object sender, ScrollEventArgs e)
+	{
+		if ((_previousHorizontalScrollValue < e.NewValue && !CanScrollRight()) ||
+			(_previousHorizontalScrollValue > e.NewValue && !CanScrollLeft()))
+		{
+			return;
+		}
+
+		HorizontalOffset = -1 * e.NewValue;
+		_previousHorizontalScrollValue = e.NewValue;
+	}
+
+	#endregion
+
+	private uint _capturedPointerId;
+	private Point _referencePosition;
+
+	private void RegisterPointerHandlers()
+	{
+		// Register for pointer events.
+		PointerPressed -= OnPointerPressed;
+		PointerReleased -= OnPointerReleased;
+		PointerMoved -= OnPointerMoved;
+		PointerWheelChanged -= OnPointerWheelChanged;
+
+		PointerPressed += OnPointerPressed;
+		PointerReleased += OnPointerReleased;
+		PointerMoved += OnPointerMoved;
+		PointerWheelChanged += OnPointerWheelChanged;
+	}
+
+	private void OnPointerPressed(object sender, PointerRoutedEventArgs e)
+	{
+		if (!IsAllowedToWork)
+		{
+			return; // Don't handle the event when the control is disabled.
+		}
+
+		var pointerPoint = e.GetCurrentPoint(this);
+		var pointerProperties = pointerPoint.Properties;
+
+		// If the middle button of a mouse is pressed, then we want to handle the event.
+		if (pointerProperties.IsMiddleButtonPressed
+#if IS_WINUI
+			&& pointerPoint.PointerDeviceType == PointerDeviceType.Mouse)
+#else
+			&& pointerPoint.PointerDevice.PointerDeviceType == PointerDeviceType.Mouse)
+#endif
+		{
+			e.Handled = true;
+
+			// Capture the pointer so that we can track its movement even if it leaves the bounds of the control.
+			var pointer = e.Pointer;
+			var captured = CapturePointer(pointer);
+			if (captured)
+			{
+				_capturedPointerId = pointer.PointerId;
+				_referencePosition = pointerPoint.Position;
+				_lastPosition = _referencePosition;
+			}
+		}
+	}
+
+	private void OnPointerReleased(object sender, PointerRoutedEventArgs e)
+	{
+		ReleasePointerCaptures();
+		_capturedPointerId = default;
+	}
+
+	private void OnPointerMoved(object sender, PointerRoutedEventArgs e)
+	{
+		if (!(IsAllowedToWork && _capturedPointerId > 0 && IsPanAllowed))
+		{
+			return;
+		}
+
+		var currentPosition = e.GetCurrentPoint(this).Position;
+		_movimentDirection = (currentPosition.X > _lastPosition.X, currentPosition.Y > _lastPosition.Y);
+		_lastPosition = currentPosition;
+
+		if (CanMoveThisWay())
+		{
+			// If the pointer is captured, then we want to handle the event.
+			e.Handled = true;
+
+			var pointerPoint = e.GetCurrentPoint(this);
+
+			// Adjust the offsets based on the pointer's movement.
+			var position = pointerPoint.Position;
+			var deltaX = position.X - _referencePosition.X;
+			var deltaY = position.Y - _referencePosition.Y;
+
+			TryUpdateOffsets(deltaX, deltaY);
+
+			// Update the starting position for next time.
+			_referencePosition = position;
+		}
+	}
+
+	private void TryUpdateOffsets(double deltaX, double deltaY)
+	{
+		if ((deltaX > 0 && CanScrollLeft()) ||
+			(deltaX < 0 && CanScrollRight()))
+		{
+			HorizontalOffset += deltaX;
+		}
+
+		if ((deltaY > 0 && CanScrollUp()) ||
+			(deltaY < 0 && CanScrollDown()))
+		{
+			VerticalOffset += deltaY;
+		}
+	}
+
+	private void OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
+	{
+		if (!IsAllowedToWork)
+		{
+			return; // Don't handle the event when the control is disabled.
+		}
+
+		var pointerPoint = e.GetCurrentPoint(this);
+		var pointerProperties = pointerPoint.Properties;
+
+		var changeRatio = GetZoomDelta(pointerProperties);
+
+		//Zoom In/Out
+		if (
+#if IS_WINUI
+			pointerPoint.PointerDeviceType == PointerDeviceType.Mouse &&
+#else
+			pointerPoint.PointerDevice.PointerDeviceType == PointerDeviceType.Mouse &&
+#endif
+			e.KeyModifiers.HasFlag(Windows.System.VirtualKeyModifiers.Control) &&
+			IsZoomAllowed)
+		{
+			e.Handled = true;
+
+			// Pointer relative to the content
+			var relativeX = (pointerPoint.Position.X - HorizontalOffset) / ZoomLevel;
+			var relativeY = (pointerPoint.Position.Y - VerticalOffset) / ZoomLevel;
+
+			ZoomLevel *= changeRatio;
+
+			HorizontalOffset = pointerPoint.Position.X - (relativeX * ZoomLevel);
+			VerticalOffset = pointerPoint.Position.Y - (relativeY * ZoomLevel);
+			return;
+		}
+
+		//Horizontal Scroll
+		if (e.KeyModifiers.HasFlag(Windows.System.VirtualKeyModifiers.Shift))
+		{
+			var deltaX = GetPanDelta(pointerProperties);
+			TryUpdateOffsets(deltaX, 0);
+			return;
+		}
+
+		//Vertical Scroll
+		var deltaY = GetPanDelta(pointerProperties);
+		TryUpdateOffsets(0, deltaY);
+	}
+
+	private double GetZoomDelta(PointerPointProperties pointerProperties)
+	{
+		var delta = pointerProperties.MouseWheelDelta * ScaleWheelRatio;
+		return 1 + delta;
+	}
+
+	private double GetPanDelta(PointerPointProperties pointerProperties)
+	{
+		var delta = pointerProperties.MouseWheelDelta * PanWheelRatio;
+		return delta;
+	}
+
+	public void Initialize()
+	{
+		if (_presenter?.Content is FrameworkElement { } fe)
+		{
+			fe.UpdateLayout();
+		}
+
+		ResetZoom();
+		ResetOffset();
+		Centralize();
+	}
+
+	public void ResetZoom() => ZoomLevel = 1;
+
+	public void ResetOffset()
+	{
+		HorizontalOffset = AdditionalMargin.Left;
+		VerticalOffset = AdditionalMargin.Top;
+	}
+
+	public void RemoveOffset()
+	{
+		HorizontalOffset = 0;
+		VerticalOffset = 0;
+	}
+
+	public void Centralize()
+	{
+		if (IsActive &&
+			_presenter is not null &&
+			_presenter.Content is FrameworkElement { } content)
+		{
+			HorizontalOffset = ((AvailableSize.Width - (content.ActualWidth * ZoomLevel)) / 2) + AdditionalMargin.Left;
+			VerticalOffset = ((AvailableSize.Height - (content.ActualHeight * ZoomLevel)) / 2) + AdditionalMargin.Top;
+		}
+	}
+
+	public void ZoomToCanvas()
+	{
+		if (IsActive)
+		{
+			var vZoom = (AvailableSize.Height / ViewPortHeight);
+			var hZoom = (AvailableSize.Width / ViewPortWidth);
+			ZoomLevel = Math.Min(vZoom, hZoom);
+			Centralize();
+		}
+	}
+	private static Matrix GetPositionMatrix(FrameworkElement element, FrameworkElement rootElement) => ((MatrixTransform)element.TransformToVisual(rootElement)).Matrix;
+}

From 78f7f7b143558c7b3cddd2ad99d03f6e8f76639c Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Thu, 19 Sep 2024 13:28:25 -0400
Subject: [PATCH 02/30] feat: ZoomContentControl Sample

---
 .../ZoomContentControlSamplePage.xaml         | 45 +++++++++++++++++++
 .../ZoomContentControlSamplePage.xaml.cs      | 36 +++++++++++++++
 2 files changed, 81 insertions(+)
 create mode 100644 samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
 create mode 100644 samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs

diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
new file mode 100644
index 000000000..acdb1581a
--- /dev/null
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
@@ -0,0 +1,45 @@
+<Page x:Class="Uno.Toolkit.Samples.Content.Controls.ZoomContentControlSamplePage"
+	  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+	  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+	  xmlns:local="using:Uno.Toolkit.Samples.Content.Controls"
+	  xmlns:utu="using:Uno.Toolkit.UI"
+	  xmlns:sample="using:Uno.Toolkit.Samples"
+	  xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+	  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+	  mc:Ignorable="d"
+	  Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+
+	<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+
+		<StackPanel Padding="0,20" Spacing="20">
+			<TextBlock Text="ZoomContentControl Sample"
+								   Style="{StaticResource TitleLarge}" />
+
+			<utu:ZoomContentControl x:Name="ZoomContent"
+												Width="400"
+												Height="300"
+												HorizontalAlignment="Center"
+												VerticalAlignment="Center"
+												ZoomLevel="1.5"
+												MinZoomLevel="0.5"
+												MaxZoomLevel="3.0"
+												IsZoomAllowed="True"
+												IsPanAllowed="True">
+							<utu:ZoomContentControl.Content>
+								<Image Source="ms-appx:///Assets/Media/LargeMedia.svg"
+									   Stretch="Uniform" />
+							</utu:ZoomContentControl.Content>
+						</utu:ZoomContentControl>
+
+			<StackPanel Orientation="Horizontal" Spacing="12" HorizontalAlignment="Center">
+							<Button Content="Zoom In"
+									Click="OnZoomInClick" />
+							<Button Content="Zoom Out"
+									Click="OnZoomOutClick" />
+							<Button Content="Reset"
+									Click="OnResetClick" />
+						</StackPanel>
+		</StackPanel>
+		
+	</Grid>
+</Page>
diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
new file mode 100644
index 000000000..e614ae21f
--- /dev/null
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
@@ -0,0 +1,36 @@
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
+using Windows.UI.Xaml.Controls;
+using Windows.UI.Xaml;
+
+namespace Uno.Toolkit.Samples.Content.Controls
+{
+	public sealed partial class ZoomContentControlSamplePage : Page
+	{
+		public ZoomContentControlSamplePage()
+		{
+			this.InitializeComponent();
+		}
+
+		private void OnZoomInClick(object sender, RoutedEventArgs e)
+		{
+			if (ZoomContent.ZoomLevel < ZoomContent.MaxZoomLevel)
+			{
+				ZoomContent.ZoomLevel += 0.2;
+			}
+		}
+
+		private void OnZoomOutClick(object sender, RoutedEventArgs e)
+		{
+			if (ZoomContent.ZoomLevel > ZoomContent.MinZoomLevel)
+			{
+				ZoomContent.ZoomLevel -= 0.2;
+			}
+		}
+
+		private void OnResetClick(object sender, RoutedEventArgs e)
+		{
+			ZoomContent.ResetZoom();
+		}
+	}
+}

From 54503dfe1186678a889ed5fd1c7a28ed7c96778a Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Mon, 23 Sep 2024 07:21:22 -0400
Subject: [PATCH 03/30] fix: ZoomContentControl Sample

---
 .../ZoomContentControlSamplePage.xaml.cs      | 30 +++++++++++++++++--
 .../Uno.Toolkit.Samples.Shared.projitems      |  9 +++++-
 .../ZoomContentControl.xaml                   |  2 +-
 3 files changed, 37 insertions(+), 4 deletions(-)

diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
index e614ae21f..17a778148 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
@@ -1,10 +1,36 @@
-using Microsoft.UI.Xaml;
+using System;
+using System.Collections.Generic;
+using System.IO;
+using System.Linq;
+using System.Runtime.InteropServices.WindowsRuntime;
+using Uno.Toolkit.Samples.Entities;
+using Windows.Foundation;
+using Windows.Foundation.Collections;
+
+#if IS_WINUI
+using Microsoft.UI;
+using Microsoft.UI.Xaml;
 using Microsoft.UI.Xaml.Controls;
-using Windows.UI.Xaml.Controls;
+using Microsoft.UI.Xaml.Controls.Primitives;
+using Microsoft.UI.Xaml.Data;
+using Microsoft.UI.Xaml.Input;
+using Microsoft.UI.Xaml.Media;
+using Microsoft.UI.Xaml.Navigation;
+#else
+using Windows.UI;
 using Windows.UI.Xaml;
+using Windows.UI.Xaml.Controls;
+using Windows.UI.Xaml.Controls.Primitives;
+using Windows.UI.Xaml.Data;
+using Windows.UI.Xaml.Input;
+using Windows.UI.Xaml.Media;
+using Windows.UI.Xaml.Navigation;
+#endif
+
 
 namespace Uno.Toolkit.Samples.Content.Controls
 {
+	[SamplePage(SampleCategory.Controls, "ZoomContentControl")]
 	public sealed partial class ZoomContentControlSamplePage : Page
 	{
 		public ZoomContentControlSamplePage()
diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Uno.Toolkit.Samples.Shared.projitems b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Uno.Toolkit.Samples.Shared.projitems
index 55d215598..ef1b13ffd 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Uno.Toolkit.Samples.Shared.projitems
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Uno.Toolkit.Samples.Shared.projitems
@@ -74,6 +74,9 @@
     <Compile Include="$(MSBuildThisFileDirectory)Content\Controls\VisualStateManagerExtensionsSamplePage.xaml.cs">
       <DependentUpon>VisualStateManagerExtensionsSamplePage.xaml</DependentUpon>
     </Compile>
+    <Compile Include="$(MSBuildThisFileDirectory)Content\Controls\ZoomContentControlSamplePage.xaml.cs">
+      <DependentUpon>ZoomContentControlSamplePage.xaml</DependentUpon>
+    </Compile>
     <Compile Include="$(MSBuildThisFileDirectory)Content\Helpers\BindingExtensionsSamplePage.xaml.cs">
       <DependentUpon>BindingExtensionsSamplePage.xaml</DependentUpon>
     </Compile>
@@ -317,6 +320,10 @@
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>
+    <Page Include="$(MSBuildThisFileDirectory)Content\Controls\ZoomContentControlSamplePage.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
     <Page Include="$(MSBuildThisFileDirectory)Content\Helpers\BindingExtensionsSamplePage.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
@@ -583,4 +590,4 @@
     <Content Include="$(MSBuildThisFileDirectory)Assets\Media\SmallMedia.scale-400.png" />
     <Content Include="$(MSBuildThisFileDirectory)Assets\UnoLogo.png" />
   </ItemGroup>
-</Project>
+</Project>
\ No newline at end of file
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
index 6391c6940..b9c1d95b3 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
@@ -1,6 +1,6 @@
 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 					xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-					xmlns:ctl="using:Uno.Toolkit.UI.Controls">
+					xmlns:ctl="using:Uno.Toolkit.UI">
 
 	<Style x:Key="DefaultZoomContentControlStyle"
 		   TargetType="ctl:ZoomContentControl">

From 768501b75b9f3d087ba0604ee9301b8f4beb3834 Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Mon, 23 Sep 2024 08:10:41 -0400
Subject: [PATCH 04/30] docs: ZoomContentControl

---
 doc/controls/ZoomContentControl.md | 72 ++++++++++++++++++++++++++++++
 doc/toc.yml                        |  2 +
 2 files changed, 74 insertions(+)
 create mode 100644 doc/controls/ZoomContentControl.md

diff --git a/doc/controls/ZoomContentControl.md b/doc/controls/ZoomContentControl.md
new file mode 100644
index 000000000..af129bc93
--- /dev/null
+++ b/doc/controls/ZoomContentControl.md
@@ -0,0 +1,72 @@
+---
+uid: Toolkit.Controls.ZoomContentControl
+---
+
+# ZoomContentControl
+
+> [!TIP]
+> This guide covers details for the `ZoomContentControl`. If you are just getting started with the Uno Toolkit UI Library, please see our [general getting started](../getting-started.md) page to make sure you have the correct setup in place.
+
+## Summary
+
+`ZoomContentControl` allows you to display content that can be zoomed in and out, as well as panned. It is especially useful for scenarios such as viewing large images, maps, or documents where users need control over zoom levels and panning.
+
+### C\#
+
+```csharp
+public partial class ZoomContentControl : Control
+```
+
+### XAML
+
+```xml
+xmlns:utu="using:Uno.Toolkit.UI"
+...
+
+<utu:ZoomContentControl ZoomLevel="1.5"
+                        MinZoomLevel="0.5"
+                        MaxZoomLevel="3.0"
+                        IsZoomAllowed="True"
+                        IsPanAllowed="True">
+    <utu:ZoomContentControl.Content>
+        <Image Source="ms-appx:///Assets/Media/LargeMedia.svg"
+               Stretch="Uniform" />
+    </utu:ZoomContentControl.Content>
+</utu:ZoomContentControl>
+```
+
+### Inheritance
+
+`Object` &#8594; `DependencyObject` &#8594; `UIElement` &#8594; `FrameworkElement` &#8594; `Control` &#8594; `ContentControl` &#8594; `ZoomContentControl`
+
+### Constructors
+
+| Constructor    | Description                                           |
+|----------------|-------------------------------------------------------|
+| `ZoomContentControl()` | Initializes a new instance of the `ZoomContentControl` class. |
+
+### Properties
+
+| Property               | Type                  | Description                                                                                                                                                                                                                                                                                                                                            |
+|------------------------|-----------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
+| `ZoomLevel`          | `double`         | Gets or sets the current zoom level for the content.                                                                                                                                                                                                                                                                                             |
+| `MinZoomLevel`              | `double`              | Gets or sets the minimum zoom level allowed for the content.                                                                                                                                                                                                                   |
+| `MaxZoomLevel`              | `double`   | Gets or sets the maximum zoom level allowed for the content                                                                                                                                     |
+| `isZoomAllowed` | `bool` | Gets or sets the value indicating whether zooming is allowed.                                                                                                                                             |
+| `IsPanAllowed` | `bool` | Gets or sets the value indicating whether panning is allowed.                                                        |
+| `HorizontalOffest`      | `double`                | Gets or sets the horizontal offset for panning.                                                                                                                                                                                                                                                     |
+| `VerticalOffset`              | `double`           | Gets or sets the vertical offset for panning. |
+| `HorizontalZoomCenter`      | `double`                | Gets or sets the horizontal center point of the zooming operation.                                                                                                                                                                                                                                                     |
+| `VerticalZoomCenter`              | `double`           | Gets or sets the vertical center point of the zooming operation. |
+| `ScaleWheelRatio`      | `double`                | Gets or sets the ratio for scaling zoom level when using a mouse wheel.                                                                                                                                                                                                                                                     |
+| `PanWheelRatio`              | `double`           | Gets or sets the ratio for panning when using a mouse wheel. |
+| `ResetWhenNotActive`              | `bool`           | Gets or sets a value indicating whether the zoom and pan should reset when the control is not active. |
+
+### Methods
+
+| Method              | Return Type                         | Description                                                                                                                                                                                                                                                                                                                                              |
+|-----------------------|------------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
+| `ResetZoom()`    | `void` | Resets the zoom level to it's default value.                                                                                                                    |
+| `ResetOffset()`    | `void`        | Resets the horizontal and vertical offset to it's default value. |
+| `ZoomToCanvas()`       | `void`                     | Adjust the zoom level so that the content fits within the available space.                                                                                                                                                                                                            |
+| `Centralize()`       | `void`                     | Centers the content within the available space.                                                                                                                                                                                                 |
diff --git a/doc/toc.yml b/doc/toc.yml
index 76ab5d169..37e991655 100644
--- a/doc/toc.yml
+++ b/doc/toc.yml
@@ -48,6 +48,8 @@
       href: controls/ShadowContainer.md
     - name: TabBar and TabBarItem
       href: controls/TabBarAndTabBarItem.md
+    - name: ZoomContentControl
+      href: controls/ZoomContentControl.md
   # ***************** Reference\Helpers *******************
   - name: Helpers
     items:

From 67c3f5ad55583edb3e18926d5216206002eb316d Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Tue, 24 Sep 2024 11:07:34 -0400
Subject: [PATCH 05/30] fix: ZoomContentControl Sample

---
 .../ZoomContentControlSamplePage.xaml         | 36 ++++++++++++-------
 .../ZoomContentControlSamplePage.xaml.cs      |  3 +-
 2 files changed, 25 insertions(+), 14 deletions(-)

diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
index acdb1581a..a1b57d722 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
@@ -3,19 +3,17 @@
 	  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 	  xmlns:local="using:Uno.Toolkit.Samples.Content.Controls"
 	  xmlns:utu="using:Uno.Toolkit.UI"
-	  xmlns:sample="using:Uno.Toolkit.Samples"
 	  xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
 	  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
 	  mc:Ignorable="d"
 	  Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
 
-	<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+	<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" RowDefinitions="Auto, *, Auto">
 
-		<StackPanel Padding="0,20" Spacing="20">
-			<TextBlock Text="ZoomContentControl Sample"
-								   Style="{StaticResource TitleLarge}" />
+			<TextBlock Grid.Row="0" Text="ZoomContentControl Sample"
+						Style="{StaticResource TitleLarge}" />
 
-			<utu:ZoomContentControl x:Name="ZoomContent"
+			<utu:ZoomContentControl Grid.Row="1" x:Name="ZoomContent"
 												Width="400"
 												Height="300"
 												HorizontalAlignment="Center"
@@ -24,21 +22,33 @@
 												MinZoomLevel="0.5"
 												MaxZoomLevel="3.0"
 												IsZoomAllowed="True"
+												BorderBrush="Pink"
+												BorderThickness="2"
 												IsPanAllowed="True">
-							<utu:ZoomContentControl.Content>
-								<Image Source="ms-appx:///Assets/Media/LargeMedia.svg"
-									   Stretch="Uniform" />
-							</utu:ZoomContentControl.Content>
-						</utu:ZoomContentControl>
+				
+				<StackPanel Orientation="Horizontal"
+							Spacing="12"
+							HorizontalAlignment="Center">
+					<Border BorderThickness="2"
+							BorderBrush="White">
+					<Image Source="ms-appx:///Assets/UnoLogo.png"
+						   Height="101"
+						   Width="75"
+						   HorizontalAlignment="Left"
+						   Margin="16,8,0,12" />
+					</Border>
+				</StackPanel>
+				
+			</utu:ZoomContentControl>
 
-			<StackPanel Orientation="Horizontal" Spacing="12" HorizontalAlignment="Center">
+
+		<StackPanel Grid.Row="2" Orientation="Horizontal" Spacing="12" HorizontalAlignment="Center" VerticalAlignment="Bottom">
 							<Button Content="Zoom In"
 									Click="OnZoomInClick" />
 							<Button Content="Zoom Out"
 									Click="OnZoomOutClick" />
 							<Button Content="Reset"
 									Click="OnResetClick" />
-						</StackPanel>
 		</StackPanel>
 		
 	</Grid>
diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
index 17a778148..48982e3fa 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
@@ -36,6 +36,7 @@ public sealed partial class ZoomContentControlSamplePage : Page
 		public ZoomContentControlSamplePage()
 		{
 			this.InitializeComponent();
+			this.Loaded += (_, _) => ZoomContent.Initialize();
 		}
 
 		private void OnZoomInClick(object sender, RoutedEventArgs e)
@@ -56,7 +57,7 @@ private void OnZoomOutClick(object sender, RoutedEventArgs e)
 
 		private void OnResetClick(object sender, RoutedEventArgs e)
 		{
-			ZoomContent.ResetZoom();
+			ZoomContent.Initialize();
 		}
 	}
 }

From d706f509880609250452c890b937bf38ca9ea52a Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Tue, 24 Sep 2024 14:44:02 -0400
Subject: [PATCH 06/30] chore: resolving comments

---
 .../ZoomContentControl.xaml.cs                | 65 ++++++++-----------
 1 file changed, 28 insertions(+), 37 deletions(-)

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs
index b549f7504..be5af79b5 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs
@@ -34,13 +34,13 @@
 
 namespace Uno.Toolkit.UI;
 
-[TemplatePart(Name = Parts.RootGrid, Type = typeof(Grid))]
-[TemplatePart(Name = Parts.Presenter, Type = typeof(ContentPresenter))]
-[TemplatePart(Name = Parts.VerticalScrollBar, Type = typeof(ScrollBar))]
-[TemplatePart(Name = Parts.HorizontalScrollBar, Type = typeof(ScrollBar))]
+[TemplatePart(Name = TemplateParts.RootGrid, Type = typeof(Grid))]
+[TemplatePart(Name = TemplateParts.Presenter, Type = typeof(ContentPresenter))]
+[TemplatePart(Name = TemplateParts.VerticalScrollBar, Type = typeof(ScrollBar))]
+[TemplatePart(Name = TemplateParts.HorizontalScrollBar, Type = typeof(ScrollBar))]
 public partial class ZoomContentControl : ContentControl
 {
-	private static class Parts
+	private static class TemplateParts
 	{
 		public const string RootGrid = "PART_RootGrid";
 
@@ -57,7 +57,7 @@ private static class Parts
 
 	private Point _lastPosition = new Point(0, 0);
 
-	private (bool Horizontal, bool Vertical) _movimentDirection = (false, false);
+	private (bool Horizontal, bool Vertical) _movementDirection = (false, false);
 
 	private bool IsAllowedToWork => (IsEnabled && IsActive && _presenter is not null);
 
@@ -92,7 +92,7 @@ public Size AvailableSize
 		DependencyProperty.Register(nameof(IsVerticalScrollBarVisible), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
 
 	public static readonly DependencyProperty ContentBoundsVisibilityDataProperty =
-		DependencyProperty.Register(nameof(ContentBoundsVisibility), typeof(BoundsVisibilityData), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: new BoundsVisibilityData(leftEdge: false, topEdge: false, rightEdge: false, bottomEdge: false)));
+		DependencyProperty.Register(nameof(ContentBoundsVisibility), typeof(BoundsVisibilityData), typeof(ZoomContentControl), new PropertyMetadata(BoundsVisibilityData.None));
 
 	public static readonly DependencyProperty IsZoomAllowedProperty =
 	DependencyProperty.Register(nameof(IsZoomAllowed), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
@@ -350,14 +350,12 @@ private async void OnZoomLevelChanged(DependencyObject sender, DependencyPropert
 
 	public record BoundsVisibilityData
 	{
-		public bool LeftEdge { get; init; }
+		public static readonly BoundsVisibilityData None = new BoundsVisibilityData(leftEdge: false, topEdge: false, rightEdge: false, bottomEdge: false);
 
+		public bool LeftEdge { get; init; }
 		public bool TopEdge { get; init; }
-
 		public bool RightEdge { get; init; }
-
 		public bool BottomEdge { get; init; }
-
 		public bool AllEdgesVisible { get; init; }
 
 		public BoundsVisibilityData(bool leftEdge, bool topEdge, bool rightEdge, bool bottomEdge)
@@ -390,20 +388,20 @@ private void UpdateScrollVisibility()
 		IsVerticalScrollBarVisible = !(ContentBoundsVisibility.TopEdge && ContentBoundsVisibility.BottomEdge);
 	}
 
-	private bool CanMoveThisWay()
+	private bool CanMoveIn((bool Horizontal, bool Vertical) _movementDirection)
 	{
 		if (ContentBoundsVisibility.AllEdgesVisible)
 		{
 			return false;
 		}
 
-		var rules = false;
-		rules |= !ContentBoundsVisibility.LeftEdge && _movimentDirection.Horizontal is true;
-		rules |= !ContentBoundsVisibility.RightEdge && _movimentDirection.Horizontal is false;
-		rules |= !ContentBoundsVisibility.TopEdge && _movimentDirection.Vertical is true;
-		rules |= !ContentBoundsVisibility.BottomEdge && _movimentDirection.Vertical is false;
+		var canMove = false;
+		canMove |= CanScrollLeft() && _movementDirection.Horizontal is true;
+		canMove |= CanScrollRight() && _movementDirection.Horizontal is false;
+		canMove |= CanScrollUp() && _movementDirection.Vertical is true;
+		canMove |= CanScrollDown() && _movementDirection.Vertical is false;
 
-		return rules;
+		return canMove;
 	}
 
 	private bool CanScrollUp() => !ContentBoundsVisibility.TopEdge;
@@ -488,23 +486,18 @@ private void ZoomContentControl_SizeChanged(object sender, SizeChangedEventArgs
 
 	protected override void OnApplyTemplate()
 	{
-		_grid = GetTemplateChild(Parts.RootGrid) as Grid;
-		_presenter = GetTemplateChild(Parts.Presenter) as ContentPresenter;
-		_scrollV = GetTemplateChild(Parts.VerticalScrollBar) as ScrollBar;
-		_scrollH = GetTemplateChild(Parts.HorizontalScrollBar) as ScrollBar;
-
-		if (_grid is null ||
-			_presenter is null ||
-			_scrollH is null ||
-			_scrollV is null)
-		{
-			throw new InvalidOperationException("ZoomContentControl template is missing required parts.");
-		}
-
-		RegisterToControlEvents();
+		T FindTemplatePart<T>(string name) where T : class =>
+			(GetTemplateChild(name) ?? throw new Exception($"Expected template part not found: {name}"))
+			as T ?? throw new Exception($"Expected template part '{name}' to be of type: {typeof(T)}");
+		_grid = FindTemplatePart<Grid>(TemplateParts.RootGrid);
+		_presenter = FindTemplatePart<ContentPresenter>(TemplateParts.Presenter);
+		_scrollV = FindTemplatePart<ScrollBar>(TemplateParts.VerticalScrollBar);
+		_scrollH = FindTemplatePart<ScrollBar>(TemplateParts.HorizontalScrollBar);
 
 		ResetOffset();
 		ResetZoom();
+
+		RegisterToControlEvents();
 		RegisterPointerHandlers();
 	}
 
@@ -629,10 +622,10 @@ private void OnPointerMoved(object sender, PointerRoutedEventArgs e)
 		}
 
 		var currentPosition = e.GetCurrentPoint(this).Position;
-		_movimentDirection = (currentPosition.X > _lastPosition.X, currentPosition.Y > _lastPosition.Y);
+		_movementDirection = (currentPosition.X > _lastPosition.X, currentPosition.Y > _lastPosition.Y);
 		_lastPosition = currentPosition;
 
-		if (CanMoveThisWay())
+		if (CanMoveIn(_movementDirection))
 		{
 			// If the pointer is captured, then we want to handle the event.
 			e.Handled = true;
@@ -754,9 +747,7 @@ public void RemoveOffset()
 
 	public void Centralize()
 	{
-		if (IsActive &&
-			_presenter is not null &&
-			_presenter.Content is FrameworkElement { } content)
+		if (IsActive && _presenter?.Content is FrameworkElement { } content)
 		{
 			HorizontalOffset = ((AvailableSize.Width - (content.ActualWidth * ZoomLevel)) / 2) + AdditionalMargin.Left;
 			VerticalOffset = ((AvailableSize.Height - (content.ActualHeight * ZoomLevel)) / 2) + AdditionalMargin.Top;

From 92fb0d9dc028c3dc53aab00839d1481d616c0d63 Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Tue, 24 Sep 2024 16:59:37 -0400
Subject: [PATCH 07/30] chore: misc changes

---
 .../ZoomContentControlSamplePage.xaml         | 69 ++++++++++---------
 .../ZoomContentControlSamplePage.xaml.cs      | 27 ++++++--
 .../ZoomContentControl.xaml                   |  6 +-
 .../ZoomContentControl.xaml.cs                | 26 +++++--
 4 files changed, 83 insertions(+), 45 deletions(-)

diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
index a1b57d722..33e2ddd15 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
@@ -5,15 +5,17 @@
 	  xmlns:utu="using:Uno.Toolkit.UI"
 	  xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
 	  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+	  xmlns:sample="using:Uno.Toolkit.Samples"
 	  mc:Ignorable="d"
 	  Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
 
-	<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" RowDefinitions="Auto, *, Auto">
-
-			<TextBlock Grid.Row="0" Text="ZoomContentControl Sample"
-						Style="{StaticResource TitleLarge}" />
-
-			<utu:ZoomContentControl Grid.Row="1" x:Name="ZoomContent"
+	<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+		<sample:SamplePageLayout x:Name="SamplePageLayout" IsDesignAgnostic="True">
+			<sample:SamplePageLayout.DesignAgnosticTemplate>
+				<DataTemplate>
+					<StackPanel>
+						<utu:ZoomContentControl Grid.Row="1"
+												x:Name="ZoomContent"
 												Width="400"
 												Height="300"
 												HorizontalAlignment="Center"
@@ -22,34 +24,37 @@
 												MinZoomLevel="0.5"
 												MaxZoomLevel="3.0"
 												IsZoomAllowed="True"
-												BorderBrush="Pink"
-												BorderThickness="2"
 												IsPanAllowed="True">
-				
-				<StackPanel Orientation="Horizontal"
-							Spacing="12"
-							HorizontalAlignment="Center">
-					<Border BorderThickness="2"
-							BorderBrush="White">
-					<Image Source="ms-appx:///Assets/UnoLogo.png"
-						   Height="101"
-						   Width="75"
-						   HorizontalAlignment="Left"
-						   Margin="16,8,0,12" />
-					</Border>
-				</StackPanel>
-				
-			</utu:ZoomContentControl>
 
+							<StackPanel Orientation="Horizontal"
+										Spacing="12"
+										HorizontalAlignment="Center">
+								<Border BorderThickness="2"
+										BorderBrush="White"
+										Padding="10">
+									<Image Source="ms-appx:///Assets/UnoLogo.png"
+										   Height="101"
+										   Width="75"
+										   HorizontalAlignment="Center" />
+								</Border>
+							</StackPanel>
+
+						</utu:ZoomContentControl>
 
-		<StackPanel Grid.Row="2" Orientation="Horizontal" Spacing="12" HorizontalAlignment="Center" VerticalAlignment="Bottom">
-							<Button Content="Zoom In"
-									Click="OnZoomInClick" />
-							<Button Content="Zoom Out"
-									Click="OnZoomOutClick" />
-							<Button Content="Reset"
-									Click="OnResetClick" />
-		</StackPanel>
-		
+
+						<StackPanel Grid.Row="2"
+									Orientation="Horizontal"
+									Spacing="12"
+									HorizontalAlignment="Center"
+									VerticalAlignment="Bottom">
+							<Button x:Name="ZoomInButton" Content="Zoom In" />
+							<Button x:Name="ZoomOutButton" Content="Zoom Out" />
+							<Button x:Name="ResetButton" Content="Reset" />
+						</StackPanel>
+					</StackPanel>
+				</DataTemplate>
+			</sample:SamplePageLayout.DesignAgnosticTemplate>
+		</sample:SamplePageLayout>
 	</Grid>
+
 </Page>
diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
index 48982e3fa..648e0c555 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
@@ -4,6 +4,7 @@
 using System.Linq;
 using System.Runtime.InteropServices.WindowsRuntime;
 using Uno.Toolkit.Samples.Entities;
+using Uno.Toolkit.UI;
 using Windows.Foundation;
 using Windows.Foundation.Collections;
 
@@ -33,31 +34,45 @@ namespace Uno.Toolkit.Samples.Content.Controls
 	[SamplePage(SampleCategory.Controls, "ZoomContentControl")]
 	public sealed partial class ZoomContentControlSamplePage : Page
 	{
+		private ZoomContentControl zoomControl;
+
 		public ZoomContentControlSamplePage()
 		{
 			this.InitializeComponent();
-			this.Loaded += (_, _) => ZoomContent.Initialize();
+			this.Loaded += (s, e) => SetUpOptions();
+		}
+
+		private void SetUpOptions()
+		{
+			zoomControl = SamplePageLayout.GetSampleChild<ZoomContentControl>(Design.Agnostic, "ZoomContent");
+			var zoomInButton = SamplePageLayout.GetSampleChild<Button>(Design.Agnostic, "ZoomInButton");
+			var zoomOutButton = SamplePageLayout.GetSampleChild<Button>(Design.Agnostic, "ZoomOutButton");
+			var resetButton = SamplePageLayout.GetSampleChild<Button>(Design.Agnostic, "ResetButton");
+
+			zoomInButton.Click += OnZoomInClick;
+			zoomOutButton.Click += OnZoomOutClick;
+			resetButton.Click += OnResetClick;
 		}
 
 		private void OnZoomInClick(object sender, RoutedEventArgs e)
 		{
-			if (ZoomContent.ZoomLevel < ZoomContent.MaxZoomLevel)
+			if (zoomControl.ZoomLevel < zoomControl.MaxZoomLevel)
 			{
-				ZoomContent.ZoomLevel += 0.2;
+				zoomControl.ZoomLevel += 0.2;
 			}
 		}
 
 		private void OnZoomOutClick(object sender, RoutedEventArgs e)
 		{
-			if (ZoomContent.ZoomLevel > ZoomContent.MinZoomLevel)
+			if (zoomControl.ZoomLevel > zoomControl.MinZoomLevel)
 			{
-				ZoomContent.ZoomLevel -= 0.2;
+				zoomControl.ZoomLevel -= 0.2;
 			}
 		}
 
 		private void OnResetClick(object sender, RoutedEventArgs e)
 		{
-			ZoomContent.Initialize();
+			zoomControl.Initialize();
 		}
 	}
 }
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
index b9c1d95b3..2cc872a9f 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
@@ -4,11 +4,15 @@
 
 	<Style x:Key="DefaultZoomContentControlStyle"
 		   TargetType="ctl:ZoomContentControl">
+		<Setter Property="Background"
+				Value="Transparent" />
 		<Setter Property="Template">
 			<Setter.Value>
 				<ControlTemplate TargetType="ctl:ZoomContentControl">
 					<Grid x:Name="PART_RootGrid"
-						  Background="Transparent">
+						  Background="{TemplateBinding Background}"
+						  BorderThickness="{TemplateBinding BorderThickness}"
+						  BorderBrush="{TemplateBinding BorderBrush}">
 						<Grid.RowDefinitions>
 							<RowDefinition Height="*" />
 							<RowDefinition Height="Auto" />
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs
index be5af79b5..ec4dfe573 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs
@@ -473,12 +473,18 @@ public ZoomContentControl()
 
 		RegisterPropertyHandlers();
 
-		this.SizeChanged += ZoomContentControl_SizeChanged;
+		this.Loaded += OnLoaded;
+		this.SizeChanged += OnSizeChanged;
 	}
 
-	private void ZoomContentControl_SizeChanged(object sender, SizeChangedEventArgs args)
+	private void OnLoaded(object sender, RoutedEventArgs e)
 	{
-		if (AutoZoomToCanvasOnSizeChanged)
+		Centralize();
+	}
+
+	private void OnSizeChanged(object sender, SizeChangedEventArgs args)
+	{
+		if (IsLoaded && AutoZoomToCanvasOnSizeChanged)
 		{
 			ZoomToCanvas();
 		}
@@ -649,13 +655,20 @@ private void TryUpdateOffsets(double deltaX, double deltaY)
 		if ((deltaX > 0 && CanScrollLeft()) ||
 			(deltaX < 0 && CanScrollRight()))
 		{
-			HorizontalOffset += deltaX;
+			var offset = HorizontalOffset + deltaX;
+			var max = HorizontalMaxScroll * ZoomLevel;
+
+			HorizontalOffset = Math.Clamp(offset, 0, max);
 		}
 
 		if ((deltaY > 0 && CanScrollUp()) ||
 			(deltaY < 0 && CanScrollDown()))
 		{
-			VerticalOffset += deltaY;
+			var offset = VerticalOffset + deltaY;
+
+			var max = VerticalMaxScroll * ZoomLevel;
+
+			VerticalOffset = Math.Clamp(offset, 0, max);
 		}
 	}
 
@@ -760,7 +773,8 @@ public void ZoomToCanvas()
 		{
 			var vZoom = (AvailableSize.Height / ViewPortHeight);
 			var hZoom = (AvailableSize.Width / ViewPortWidth);
-			ZoomLevel = Math.Min(vZoom, hZoom);
+			var zoomLevel = Math.Min(vZoom, hZoom);
+			ZoomLevel = Math.Clamp(zoomLevel, MinZoomLevel, MaxZoomLevel);
 			Centralize();
 		}
 	}

From beabc6ba0c9fc493dabe48d0edb09697be8e4f56 Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Tue, 24 Sep 2024 17:00:43 -0400
Subject: [PATCH 08/30] chore: renaming zoomcontentcontrol

---
 .../{ZoomContentControl.xaml.cs => ZoomContentControl.cs}         | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename src/Uno.Toolkit.UI/Controls/ZoomContentControl/{ZoomContentControl.xaml.cs => ZoomContentControl.cs} (100%)

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
similarity index 100%
rename from src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml.cs
rename to src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs

From 561f7a55d515c2232c3c14621fcb3e37867e8738 Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Wed, 25 Sep 2024 11:56:05 -0400
Subject: [PATCH 09/30] chore: formatting docs

---
 doc/controls/ZoomContentControl.md | 40 +++++++++++++++---------------
 1 file changed, 20 insertions(+), 20 deletions(-)

diff --git a/doc/controls/ZoomContentControl.md b/doc/controls/ZoomContentControl.md
index af129bc93..b4008cf61 100644
--- a/doc/controls/ZoomContentControl.md
+++ b/doc/controls/ZoomContentControl.md
@@ -41,32 +41,32 @@ xmlns:utu="using:Uno.Toolkit.UI"
 
 ### Constructors
 
-| Constructor    | Description                                           |
+| Constructor| Description|
 |----------------|-------------------------------------------------------|
-| `ZoomContentControl()` | Initializes a new instance of the `ZoomContentControl` class. |
+| `ZoomContentControl()`|Initializes a new instance of the `ZoomContentControl` class.|
 
 ### Properties
 
-| Property               | Type                  | Description                                                                                                                                                                                                                                                                                                                                            |
+| Property| Type| Description|
 |------------------------|-----------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| `ZoomLevel`          | `double`         | Gets or sets the current zoom level for the content.                                                                                                                                                                                                                                                                                             |
-| `MinZoomLevel`              | `double`              | Gets or sets the minimum zoom level allowed for the content.                                                                                                                                                                                                                   |
-| `MaxZoomLevel`              | `double`   | Gets or sets the maximum zoom level allowed for the content                                                                                                                                     |
-| `isZoomAllowed` | `bool` | Gets or sets the value indicating whether zooming is allowed.                                                                                                                                             |
-| `IsPanAllowed` | `bool` | Gets or sets the value indicating whether panning is allowed.                                                        |
-| `HorizontalOffest`      | `double`                | Gets or sets the horizontal offset for panning.                                                                                                                                                                                                                                                     |
-| `VerticalOffset`              | `double`           | Gets or sets the vertical offset for panning. |
-| `HorizontalZoomCenter`      | `double`                | Gets or sets the horizontal center point of the zooming operation.                                                                                                                                                                                                                                                     |
-| `VerticalZoomCenter`              | `double`           | Gets or sets the vertical center point of the zooming operation. |
-| `ScaleWheelRatio`      | `double`                | Gets or sets the ratio for scaling zoom level when using a mouse wheel.                                                                                                                                                                                                                                                     |
-| `PanWheelRatio`              | `double`           | Gets or sets the ratio for panning when using a mouse wheel. |
-| `ResetWhenNotActive`              | `bool`           | Gets or sets a value indicating whether the zoom and pan should reset when the control is not active. |
+| `ZoomLevel`| `double`| Gets or sets the current zoom level for the content.|
+| `MinZoomLevel`| `double`| Gets or sets the minimum zoom level allowed for the content.|
+| `MaxZoomLevel`| `double`| Gets or sets the maximum zoom level allowed for the content.|
+| `isZoomAllowed`| `bool`| Gets or sets a value indicating whether zooming is allowed.|
+| `IsPanAllowed`| `bool`| Gets or sets a value indicating whether panning is allowed.|
+| `HorizontalOffest`| `double`| Gets or sets the horizontal offset for panning.|
+| `VerticalOffset`| `double`| Gets or sets the vertical offset for panning.|
+| `HorizontalZoomCenter`| `double`| Gets or sets the horizontal center point of the zooming operation.|
+| `VerticalZoomCenter`| `double`| Gets or sets the vertical center point of the zooming operation.|
+| `ScaleWheelRatio`| `double`| Gets or sets the ratio for scaling zoom level when using a mouse wheel.|
+| `PanWheelRatio`| `double`| Gets or sets the ratio for panning when using a mouse wheel.|
+| `ResetWhenNotActive`| `bool`| Gets or sets a value indicating whether the zoom and pan should reset when the control is not active.|
 
 ### Methods
 
-| Method              | Return Type                         | Description                                                                                                                                                                                                                                                                                                                                              |
+| Method| Return Type| Description|
 |-----------------------|------------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| `ResetZoom()`    | `void` | Resets the zoom level to it's default value.                                                                                                                    |
-| `ResetOffset()`    | `void`        | Resets the horizontal and vertical offset to it's default value. |
-| `ZoomToCanvas()`       | `void`                     | Adjust the zoom level so that the content fits within the available space.                                                                                                                                                                                                            |
-| `Centralize()`       | `void`                     | Centers the content within the available space.                                                                                                                                                                                                 |
+| `ResetZoom()`| `void`| Resets the zoom level to its default value.|
+| `ResetOffset()`| `void`| Resets the horizontal and vertical offset to its default value. |
+| `ZoomToCanvas()`| `void`| Adjust the zoom level so that the content fits within the available space.|
+| `Centralize()`| `void`| Centers the content within the available space.|

From cae0d7184c636d0e596ace2298e8491cd03e1643 Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Wed, 25 Sep 2024 15:30:58 -0400
Subject: [PATCH 10/30] chore: ZoomContentControl Tests

---
 .../Tests/ZoomContentControlTest.cs           | 170 ++++++++++++++++++
 1 file changed, 170 insertions(+)
 create mode 100644 src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs

diff --git a/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs b/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs
new file mode 100644
index 000000000..c2105c9ac
--- /dev/null
+++ b/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs
@@ -0,0 +1,170 @@
+using System;
+using System.Threading.Tasks;
+using Microsoft.VisualStudio.TestTools.UnitTesting;
+using Uno.Toolkit.RuntimeTests.Helpers;
+using Uno.Toolkit.UI;
+using Windows.Foundation;
+using FluentAssertions;
+using Uno.UI.RuntimeTests;
+using Uno.UI.Extensions;
+using Uno.Toolkit.RuntimeTests.Tests;
+
+#if IS_WINUI
+using Microsoft.UI;
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
+using Microsoft.UI.Xaml.Controls.Primitives;
+using Microsoft.UI.Xaml.Media;
+using Microsoft.UI.Xaml.Media.Animation;
+#else
+using Windows.UI;
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Controls;
+using Windows.UI.Xaml.Controls.Primitives;
+using Windows.UI.Xaml.Media;
+using Windows.UI.Xaml.Media.Animation;
+#endif
+
+namespace Uno.Toolkit.RuntimeTests.Tests
+{
+	[TestClass]
+	[RunsOnUIThread]
+	internal class ZoomContentControlTest
+	{
+		[TestMethod]
+		public async Task When_ZoomIn_ShouldIncreaseZoomLevel()
+		{
+			var SUT = new ZoomContentControl()
+			{
+				Width = 400,
+				Height = 300,
+				MinZoomLevel = 1.0,
+				MaxZoomLevel = 5.0,
+				ZoomLevel = 1.5,
+				IsZoomAllowed = true,
+			};
+
+			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
+
+			// the control will set an appropriate zoom level on load
+			// based on available size & content size
+			// so we need to force that to a known value here.
+			SUT.ZoomLevel = 1.5;
+			SUT.ZoomLevel.Should().Be(1.5);
+
+			SUT.ZoomLevel += 0.5;
+			SUT.ZoomLevel.Should().Be(2.0);
+
+			// should be coerce back to MaxZoomLevel of 5
+			SUT.ZoomLevel = 6.0;
+			SUT.ZoomLevel.Should().Be(5.0);
+		}
+
+		[TestMethod]
+		public async Task When_ZoomOut_ShouldDecreaseZoomLevel()
+		{
+			var SUT = new ZoomContentControl()
+			{
+				Width = 400,
+				Height = 300,
+				MinZoomLevel = 1.0,
+				MaxZoomLevel = 5.0,
+				ZoomLevel = 3.0,
+				IsZoomAllowed = true,
+			};
+
+			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
+
+			// the control will set an appropriate zoom level on load
+			// based on available size & content size
+			// so we need to force that to a known value here.
+			SUT.ZoomLevel = 3.0;
+			SUT.ZoomLevel.Should().Be(3.0);
+
+			SUT.ZoomLevel -= 0.5;
+			SUT.ZoomLevel.Should().Be(2.5);
+			
+			// should be coerce back to MinZoomLevel of 1
+			SUT.ZoomLevel = 0.5;
+			SUT.ZoomLevel.Should().Be(1.0);
+		}
+
+		[TestMethod]
+		public async Task When_Reset_ShouldResetZoomAndOffsets()
+		{
+			var SUT = new ZoomContentControl()
+			{
+				Width = 400,
+				Height = 300,
+				ZoomLevel = 2.0,
+				HorizontalOffset = 50,
+				VerticalOffset = 50,
+				IsZoomAllowed = true,
+			};
+
+			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
+
+			// Perform a reset
+			SUT.ResetZoom();
+			SUT.ZoomLevel.Should().Be(1.0); //ZoomLevel resets to 1.0
+			SUT.HorizontalOffset.Should().Be(0); //HorizontalOffset resets to 0
+			SUT.VerticalOffset.Should().Be(0); //VerticalOffset resets to 0
+		}
+
+		[TestMethod]
+		public async Task When_ContentBounds_ShouldHideScrollBars()
+		{
+			var SUT = new ZoomContentControl()
+			{
+				Width = 400,
+				Height = 300,
+				ZoomLevel = 1.0,
+				IsZoomAllowed = true,
+				Content = new Border
+				{
+					Width = 400 - 20, // the actual height/width is 12
+					Height = 300 - 20,
+					Background = new SolidColorBrush(Colors.Blue),
+				},
+			};
+			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
+
+			//Expect no scrollbars when content fits within the bounds
+			SUT.IsHorizontalScrollBarVisible.Should().BeFalse();
+			SUT.IsVerticalScrollBarVisible.Should().BeFalse();
+
+			//Zoom in to make content larger and display scrollbars
+			SUT.ZoomLevel = 2.0;
+			SUT.IsHorizontalScrollBarVisible.Should().BeTrue();
+			SUT.IsVerticalScrollBarVisible.Should().BeTrue();
+		}
+
+		[TestMethod]
+		public async Task When_Pan_ShouldUpdateOffsets()
+		{
+			var SUT = new ZoomContentControl()
+			{
+				Width = 400,
+				Height = 300,
+				ZoomLevel = 1.0,
+				IsPanAllowed = true,
+				HorizontalOffset = 0,
+				VerticalOffset = 0,
+			};
+
+			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
+
+			var presenter = SUT.FindFirstDescendant<ContentPresenter>("PART_Presenter");
+			var translation = (presenter?.RenderTransform as TransformGroup)?.Children[1] as TranslateTransform
+				?? throw new Exception("Failed to find PART_Presenter's TranslateTransform");
+
+			// Simulate panning
+			SUT.HorizontalOffset = 50;
+			SUT.VerticalOffset = 50;
+
+			// Verify that the content's translate transform has been updated to reflect the new offsets
+			translation.X.Should().Be(50);
+			translation.Y.Should().Be(50);
+		}
+	}
+}

From b8b0f529151519b0ac9edbda68cbf68b5dcb8c5c Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Fri, 27 Sep 2024 16:34:25 -0400
Subject: [PATCH 11/30] chore: resolving comments

---
 doc/controls/ZoomContentControl.md            |  6 +-
 .../ZoomContentControlSamplePage.xaml         |  8 +--
 .../ZoomContentControlSamplePage.xaml.cs      | 67 +++++++++--------
 .../ZoomContentControl/ZoomContentControl.cs  | 72 ++++++++-----------
 .../ZoomContentControl.xaml                   | 11 +--
 5 files changed, 72 insertions(+), 92 deletions(-)

diff --git a/doc/controls/ZoomContentControl.md b/doc/controls/ZoomContentControl.md
index b4008cf61..08ac372a2 100644
--- a/doc/controls/ZoomContentControl.md
+++ b/doc/controls/ZoomContentControl.md
@@ -52,7 +52,7 @@ xmlns:utu="using:Uno.Toolkit.UI"
 | `ZoomLevel`| `double`| Gets or sets the current zoom level for the content.|
 | `MinZoomLevel`| `double`| Gets or sets the minimum zoom level allowed for the content.|
 | `MaxZoomLevel`| `double`| Gets or sets the maximum zoom level allowed for the content.|
-| `isZoomAllowed`| `bool`| Gets or sets a value indicating whether zooming is allowed.|
+| `IsZoomAllowed`| `bool`| Gets or sets a value indicating whether zooming is allowed.|
 | `IsPanAllowed`| `bool`| Gets or sets a value indicating whether panning is allowed.|
 | `HorizontalOffest`| `double`| Gets or sets the horizontal offset for panning.|
 | `VerticalOffset`| `double`| Gets or sets the vertical offset for panning.|
@@ -68,5 +68,5 @@ xmlns:utu="using:Uno.Toolkit.UI"
 |-----------------------|------------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
 | `ResetZoom()`| `void`| Resets the zoom level to its default value.|
 | `ResetOffset()`| `void`| Resets the horizontal and vertical offset to its default value. |
-| `ZoomToCanvas()`| `void`| Adjust the zoom level so that the content fits within the available space.|
-| `Centralize()`| `void`| Centers the content within the available space.|
+| `FitToCanvas()`| `void`| Adjust the zoom level so that the content fits within the available space.|
+| `CenterContent()`| `void`| Centers the content within the available space.|
diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
index 33e2ddd15..ebe4b8310 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
@@ -25,23 +25,17 @@
 												MaxZoomLevel="3.0"
 												IsZoomAllowed="True"
 												IsPanAllowed="True">
-
-							<StackPanel Orientation="Horizontal"
-										Spacing="12"
-										HorizontalAlignment="Center">
 								<Border BorderThickness="2"
 										BorderBrush="White"
+										HorizontalAlignment="Center"
 										Padding="10">
 									<Image Source="ms-appx:///Assets/UnoLogo.png"
 										   Height="101"
 										   Width="75"
 										   HorizontalAlignment="Center" />
 								</Border>
-							</StackPanel>
-
 						</utu:ZoomContentControl>
 
-
 						<StackPanel Grid.Row="2"
 									Orientation="Horizontal"
 									Spacing="12"
diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
index 648e0c555..f1f3f494f 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
@@ -29,50 +29,49 @@
 #endif
 
 
-namespace Uno.Toolkit.Samples.Content.Controls
+namespace Uno.Toolkit.Samples.Content.Controls;
+
+[SamplePage(SampleCategory.Controls, "ZoomContentControl")]
+public sealed partial class ZoomContentControlSamplePage : Page
 {
-	[SamplePage(SampleCategory.Controls, "ZoomContentControl")]
-	public sealed partial class ZoomContentControlSamplePage : Page
-	{
-		private ZoomContentControl zoomControl;
+	private ZoomContentControl zoomControl;
 
-		public ZoomContentControlSamplePage()
-		{
-			this.InitializeComponent();
-			this.Loaded += (s, e) => SetUpOptions();
-		}
+	public ZoomContentControlSamplePage()
+	{
+		this.InitializeComponent();
+		this.Loaded += (s, e) => SetUpOptions();
+	}
 
-		private void SetUpOptions()
-		{
-			zoomControl = SamplePageLayout.GetSampleChild<ZoomContentControl>(Design.Agnostic, "ZoomContent");
-			var zoomInButton = SamplePageLayout.GetSampleChild<Button>(Design.Agnostic, "ZoomInButton");
-			var zoomOutButton = SamplePageLayout.GetSampleChild<Button>(Design.Agnostic, "ZoomOutButton");
-			var resetButton = SamplePageLayout.GetSampleChild<Button>(Design.Agnostic, "ResetButton");
+	private void SetUpOptions()
+	{
+		zoomControl = SamplePageLayout.GetSampleChild<ZoomContentControl>(Design.Agnostic, "ZoomContent");
+		var zoomInButton = SamplePageLayout.GetSampleChild<Button>(Design.Agnostic, "ZoomInButton");
+		var zoomOutButton = SamplePageLayout.GetSampleChild<Button>(Design.Agnostic, "ZoomOutButton");
+		var resetButton = SamplePageLayout.GetSampleChild<Button>(Design.Agnostic, "ResetButton");
 
-			zoomInButton.Click += OnZoomInClick;
-			zoomOutButton.Click += OnZoomOutClick;
-			resetButton.Click += OnResetClick;
-		}
+		zoomInButton.Click += OnZoomInClick;
+		zoomOutButton.Click += OnZoomOutClick;
+		resetButton.Click += OnResetClick;
+	}
 
-		private void OnZoomInClick(object sender, RoutedEventArgs e)
+	private void OnZoomInClick(object sender, RoutedEventArgs e)
+	{
+		if (zoomControl.ZoomLevel < zoomControl.MaxZoomLevel)
 		{
-			if (zoomControl.ZoomLevel < zoomControl.MaxZoomLevel)
-			{
-				zoomControl.ZoomLevel += 0.2;
-			}
+			zoomControl.ZoomLevel += 0.2;
 		}
+	}
 
-		private void OnZoomOutClick(object sender, RoutedEventArgs e)
+	private void OnZoomOutClick(object sender, RoutedEventArgs e)
+	{
+		if (zoomControl.ZoomLevel > zoomControl.MinZoomLevel)
 		{
-			if (zoomControl.ZoomLevel > zoomControl.MinZoomLevel)
-			{
-				zoomControl.ZoomLevel -= 0.2;
-			}
+			zoomControl.ZoomLevel -= 0.2;
 		}
+	}
 
-		private void OnResetClick(object sender, RoutedEventArgs e)
-		{
-			zoomControl.Initialize();
-		}
+	private void OnResetClick(object sender, RoutedEventArgs e)
+	{
+		zoomControl.Initialize();
 	}
 }
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index ec4dfe573..ffa302460 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -95,61 +95,61 @@ public Size AvailableSize
 		DependencyProperty.Register(nameof(ContentBoundsVisibility), typeof(BoundsVisibilityData), typeof(ZoomContentControl), new PropertyMetadata(BoundsVisibilityData.None));
 
 	public static readonly DependencyProperty IsZoomAllowedProperty =
-	DependencyProperty.Register(nameof(IsZoomAllowed), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
+		DependencyProperty.Register(nameof(IsZoomAllowed), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
 
 	public static readonly DependencyProperty ZoomLevelProperty =
-	DependencyProperty.Register(nameof(ZoomLevel), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(1d));
+		DependencyProperty.Register(nameof(ZoomLevel), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(1d));
 
 	public static readonly DependencyProperty MinZoomLevelProperty =
-	DependencyProperty.Register(nameof(MinZoomLevel), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+		DependencyProperty.Register(nameof(MinZoomLevel), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
 	public static readonly DependencyProperty MaxZoomLevelProperty =
-	DependencyProperty.Register(nameof(MaxZoomLevel), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(500d));
+		DependencyProperty.Register(nameof(MaxZoomLevel), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(500d));
 
 	public static readonly DependencyProperty HorizontalZoomCenterProperty =
-	DependencyProperty.Register(nameof(HorizontalZoomCenter), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+		DependencyProperty.Register(nameof(HorizontalZoomCenter), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
 	public static readonly DependencyProperty VerticalZoomCenterProperty =
-	DependencyProperty.Register(nameof(VerticalZoomCenter), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+		DependencyProperty.Register(nameof(VerticalZoomCenter), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
 	public static readonly DependencyProperty ScaleWheelRatioProperty =
-	DependencyProperty.Register(nameof(ScaleWheelRatio), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0006d));
+		DependencyProperty.Register(nameof(ScaleWheelRatio), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0006d));
 
 	public static readonly DependencyProperty PanWheelRatioProperty =
-	DependencyProperty.Register(nameof(PanWheelRatio), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.25d));
+		DependencyProperty.Register(nameof(PanWheelRatio), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.25d));
 
 	public static readonly DependencyProperty IsPanAllowedProperty =
-	DependencyProperty.Register(nameof(IsPanAllowed), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
+		DependencyProperty.Register(nameof(IsPanAllowed), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
 
 	public static readonly DependencyProperty HorizontalOffsetProperty =
-	DependencyProperty.Register(nameof(HorizontalOffset), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+		DependencyProperty.Register(nameof(HorizontalOffset), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
 	public static readonly DependencyProperty VerticalOffsetProperty =
-	DependencyProperty.Register(nameof(VerticalOffset), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+		DependencyProperty.Register(nameof(VerticalOffset), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
 	public static readonly DependencyProperty VerticalMaxScrollProperty =
-	DependencyProperty.Register(nameof(VerticalMaxScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+		DependencyProperty.Register(nameof(VerticalMaxScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
 	public static readonly DependencyProperty VerticalMinScrollProperty =
-	DependencyProperty.Register(nameof(VerticalMinScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+		DependencyProperty.Register(nameof(VerticalMinScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
 	public static readonly DependencyProperty HorizontalMaxScrollProperty =
-	DependencyProperty.Register(nameof(HorizontalMaxScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+		DependencyProperty.Register(nameof(HorizontalMaxScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
 	public static readonly DependencyProperty HorizontalMinScrollProperty =
-	DependencyProperty.Register(nameof(HorizontalMinScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+		DependencyProperty.Register(nameof(HorizontalMinScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
 	public static readonly DependencyProperty HorizontalScrollValueProperty =
-	DependencyProperty.Register(nameof(HorizontalScrollValue), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+		DependencyProperty.Register(nameof(HorizontalScrollValue), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
 	public static readonly DependencyProperty VerticalScrollValueProperty =
-	DependencyProperty.Register(nameof(VerticalScrollValue), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+		DependencyProperty.Register(nameof(VerticalScrollValue), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
 	public static readonly DependencyProperty ViewPortWidthProperty =
-	DependencyProperty.Register(nameof(ViewPortWidth), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+		DependencyProperty.Register(nameof(ViewPortWidth), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
 	public static readonly DependencyProperty ViewPortHeightProperty =
-	DependencyProperty.Register(nameof(ViewPortHeight), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
+		DependencyProperty.Register(nameof(ViewPortHeight), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
 	//Not a real margin, but a spacing to avoid overlapped by ShellControlPanel
 	public Thickness AdditionalMargin
@@ -191,7 +191,7 @@ public bool IsVerticalScrollBarVisible
 	public BoundsVisibilityData ContentBoundsVisibility
 	{
 		get => (BoundsVisibilityData)GetValue(ContentBoundsVisibilityDataProperty);
-		set => SetValue(ContentBoundsVisibilityDataProperty, value);
+		private set => SetValue(ContentBoundsVisibilityDataProperty, value);
 	}
 
 	public double ZoomLevel
@@ -348,24 +348,10 @@ private async void OnZoomLevelChanged(DependencyObject sender, DependencyPropert
 		await RaiseRenderedContentUpdated();
 	}
 
-	public record BoundsVisibilityData
+	public record BoundsVisibilityData(bool LeftEdge, bool TopEdge, bool RightEdge, bool BottomEdge)
 	{
-		public static readonly BoundsVisibilityData None = new BoundsVisibilityData(leftEdge: false, topEdge: false, rightEdge: false, bottomEdge: false);
-
-		public bool LeftEdge { get; init; }
-		public bool TopEdge { get; init; }
-		public bool RightEdge { get; init; }
-		public bool BottomEdge { get; init; }
-		public bool AllEdgesVisible { get; init; }
-
-		public BoundsVisibilityData(bool leftEdge, bool topEdge, bool rightEdge, bool bottomEdge)
-		{
-			LeftEdge = leftEdge;
-			TopEdge = topEdge;
-			RightEdge = rightEdge;
-			BottomEdge = bottomEdge;
-			AllEdgesVisible = LeftEdge && TopEdge && RightEdge && BottomEdge;
-		}
+		public static BoundsVisibilityData None => new BoundsVisibilityData(false, false, false, false);
+		public bool AllEdgesVisible => LeftEdge && TopEdge && RightEdge && BottomEdge;
 	}
 
 	private void UpdateContentBoundsVisibility()
@@ -479,14 +465,14 @@ public ZoomContentControl()
 
 	private void OnLoaded(object sender, RoutedEventArgs e)
 	{
-		Centralize();
+		CenterContent();
 	}
 
 	private void OnSizeChanged(object sender, SizeChangedEventArgs args)
 	{
 		if (IsLoaded && AutoZoomToCanvasOnSizeChanged)
 		{
-			ZoomToCanvas();
+			FitToCanvas();
 		}
 	}
 
@@ -741,7 +727,7 @@ public void Initialize()
 
 		ResetZoom();
 		ResetOffset();
-		Centralize();
+		CenterContent();
 	}
 
 	public void ResetZoom() => ZoomLevel = 1;
@@ -758,7 +744,7 @@ public void RemoveOffset()
 		VerticalOffset = 0;
 	}
 
-	public void Centralize()
+	public void CenterContent()
 	{
 		if (IsActive && _presenter?.Content is FrameworkElement { } content)
 		{
@@ -767,7 +753,7 @@ public void Centralize()
 		}
 	}
 
-	public void ZoomToCanvas()
+	public void FitToCanvas()
 	{
 		if (IsActive)
 		{
@@ -775,7 +761,7 @@ public void ZoomToCanvas()
 			var hZoom = (AvailableSize.Width / ViewPortWidth);
 			var zoomLevel = Math.Min(vZoom, hZoom);
 			ZoomLevel = Math.Clamp(zoomLevel, MinZoomLevel, MaxZoomLevel);
-			Centralize();
+			CenterContent();
 		}
 	}
 	private static Matrix GetPositionMatrix(FrameworkElement element, FrameworkElement rootElement) => ((MatrixTransform)element.TransformToVisual(rootElement)).Matrix;
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
index 2cc872a9f..440cae3c1 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
@@ -1,14 +1,14 @@
 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 					xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-					xmlns:ctl="using:Uno.Toolkit.UI">
+					xmlns:utu="using:Uno.Toolkit.UI">
 
 	<Style x:Key="DefaultZoomContentControlStyle"
-		   TargetType="ctl:ZoomContentControl">
+		   TargetType="utu:ZoomContentControl">
 		<Setter Property="Background"
 				Value="Transparent" />
 		<Setter Property="Template">
 			<Setter.Value>
-				<ControlTemplate TargetType="ctl:ZoomContentControl">
+				<ControlTemplate TargetType="utu:ZoomContentControl">
 					<Grid x:Name="PART_RootGrid"
 						  Background="{TemplateBinding Background}"
 						  BorderThickness="{TemplateBinding BorderThickness}"
@@ -30,7 +30,8 @@
 											  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
 											  VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
 											  Content="{TemplateBinding Content}"
-											  ContentTemplate="{TemplateBinding ContentTemplate}">
+											  ContentTemplate="{TemplateBinding ContentTemplate}"
+											  ContentTemplateSelector="{TemplateBinding ContentTemplateSelector}">
 								<ContentPresenter.RenderTransform>
 									<TransformGroup>
 										<ScaleTransform CenterX="{TemplateBinding HorizontalZoomCenter}"
@@ -80,6 +81,6 @@
 	</Style>
 
 	<Style BasedOn="{StaticResource DefaultZoomContentControlStyle}"
-		   TargetType="ctl:ZoomContentControl" />
+		   TargetType="utu:ZoomContentControl" />
 
 </ResourceDictionary>

From 05943e120c51a63ea4f7c57668db9b1dde21df77 Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Fri, 27 Sep 2024 17:14:46 -0400
Subject: [PATCH 12/30] chore: resolving comments

---
 doc/controls/ZoomContentControl.md            | 30 ++++++++++---------
 .../ZoomContentControl/ZoomContentControl.cs  |  8 ++---
 2 files changed, 18 insertions(+), 20 deletions(-)

diff --git a/doc/controls/ZoomContentControl.md b/doc/controls/ZoomContentControl.md
index 08ac372a2..3ca2e89ba 100644
--- a/doc/controls/ZoomContentControl.md
+++ b/doc/controls/ZoomContentControl.md
@@ -47,20 +47,22 @@ xmlns:utu="using:Uno.Toolkit.UI"
 
 ### Properties
 
-| Property| Type| Description|
-|------------------------|-----------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| `ZoomLevel`| `double`| Gets or sets the current zoom level for the content.|
-| `MinZoomLevel`| `double`| Gets or sets the minimum zoom level allowed for the content.|
-| `MaxZoomLevel`| `double`| Gets or sets the maximum zoom level allowed for the content.|
-| `IsZoomAllowed`| `bool`| Gets or sets a value indicating whether zooming is allowed.|
-| `IsPanAllowed`| `bool`| Gets or sets a value indicating whether panning is allowed.|
-| `HorizontalOffest`| `double`| Gets or sets the horizontal offset for panning.|
-| `VerticalOffset`| `double`| Gets or sets the vertical offset for panning.|
-| `HorizontalZoomCenter`| `double`| Gets or sets the horizontal center point of the zooming operation.|
-| `VerticalZoomCenter`| `double`| Gets or sets the vertical center point of the zooming operation.|
-| `ScaleWheelRatio`| `double`| Gets or sets the ratio for scaling zoom level when using a mouse wheel.|
-| `PanWheelRatio`| `double`| Gets or sets the ratio for panning when using a mouse wheel.|
-| `ResetWhenNotActive`| `bool`| Gets or sets a value indicating whether the zoom and pan should reset when the control is not active.|
+| Property| Type | Description |
+|-|-|-|
+| `ZoomLevel` | `double` | Gets or sets the current zoom level for the content. |
+| `MinZoomLevel` | `double` | Gets or sets the minimum zoom level allowed for the content. |
+| `MaxZoomLevel` | `double` | Gets or sets the maximum zoom level allowed for the content. |
+| `IsZoomAllowed` | `bool` | Gets or sets a value indicating whether zooming is allowed. |
+| `IsPanAllowed` | `bool` | Gets or sets a value indicating whether panning is allowed. |
+| `HorizontalOffest` | `double` | Gets or sets the horizontal offset for panning. |
+| `VerticalOffset` | `double` | Gets or sets the vertical offset for panning. |
+| `HorizontalZoomCenter` | `double` | Gets or sets the horizontal center point of the zooming operation. |
+| `VerticalZoomCenter` | `double` | Gets or sets the vertical center point of the zooming operation. |
+| `ScaleWheelRatio` | `double` | Gets or sets the ratio for scaling zoom level when using a mouse wheel. |
+| `PanWheelRatio` | `double` | Gets or sets the ratio for panning when using a mouse wheel. |
+| `ResetWhenNotActive` | `bool` | Gets or sets a value indicating whether the zoom and pan should reset when the control is not active. |
+| `AutoZoomToCanvasOnSizeChanged` | `bool` | Gets or sets a value indicating whether the control should automatically adjust zoom when resized. |
+| `IsActive` | `bool` | Gets or sets a value indicating whether the control is active. |
 
 ### Methods
 
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index ffa302460..aab57387b 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -50,7 +50,6 @@ private static class TemplateParts
 		public const string VerticalScrollBar = "PART_ScrollV";
 	}
 
-	private Grid? _grid;
 	private ContentPresenter? _presenter;
 	private ScrollBar? _scrollV;
 	private ScrollBar? _scrollH;
@@ -151,7 +150,6 @@ public Size AvailableSize
 	public static readonly DependencyProperty ViewPortHeightProperty =
 		DependencyProperty.Register(nameof(ViewPortHeight), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
 
-	//Not a real margin, but a spacing to avoid overlapped by ShellControlPanel
 	public Thickness AdditionalMargin
 	{
 		get => (Thickness)GetValue(AdditionalMarginProperty);
@@ -481,7 +479,6 @@ protected override void OnApplyTemplate()
 		T FindTemplatePart<T>(string name) where T : class =>
 			(GetTemplateChild(name) ?? throw new Exception($"Expected template part not found: {name}"))
 			as T ?? throw new Exception($"Expected template part '{name}' to be of type: {typeof(T)}");
-		_grid = FindTemplatePart<Grid>(TemplateParts.RootGrid);
 		_presenter = FindTemplatePart<ContentPresenter>(TemplateParts.Presenter);
 		_scrollV = FindTemplatePart<ScrollBar>(TemplateParts.VerticalScrollBar);
 		_scrollH = FindTemplatePart<ScrollBar>(TemplateParts.HorizontalScrollBar);
@@ -508,7 +505,6 @@ private void RegisterToControlEvents()
 			};
 		}
 
-		//due to templatebinding there's no TwoWay mode. We need to manually update the values
 		if (_scrollV is not null)
 		{
 			_scrollV.Scroll += ScrollV_Scroll;
@@ -757,8 +753,8 @@ public void FitToCanvas()
 	{
 		if (IsActive)
 		{
-			var vZoom = (AvailableSize.Height / ViewPortHeight);
-			var hZoom = (AvailableSize.Width / ViewPortWidth);
+			var vZoom = (ActualHeight - AdditionalMargin.Top - AdditionalMargin.Bottom) / ViewPortHeight;
+			var hZoom = (ActualWidth - AdditionalMargin.Left - AdditionalMargin.Right) / ViewPortWidth;
 			var zoomLevel = Math.Min(vZoom, hZoom);
 			ZoomLevel = Math.Clamp(zoomLevel, MinZoomLevel, MaxZoomLevel);
 			CenterContent();

From 524839edfa5a488003b876bb57108c47e0acabea Mon Sep 17 00:00:00 2001
From: xiaoy312 <xiaoyao312@gmail.com>
Date: Thu, 3 Oct 2024 10:38:32 -0400
Subject: [PATCH 13/30] chore: refactor properties into separate file

---
 .../ZoomContentControl.Properties.cs          | 420 ++++++++++++++++++
 .../ZoomContentControl/ZoomContentControl.cs  | 261 +----------
 2 files changed, 428 insertions(+), 253 deletions(-)
 create mode 100644 src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
new file mode 100644
index 000000000..5527c6eb9
--- /dev/null
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
@@ -0,0 +1,420 @@
+using System;
+using System.Collections;
+using System.Collections.Generic;
+using System.Collections.ObjectModel;
+using System.Linq;
+using System.Numerics;
+using Uno.Disposables;
+using Uno.Extensions.Specialized;
+using Windows.Foundation;
+using Windows.Foundation.Collections;
+using System.Threading.Tasks;
+
+#if IS_WINUI
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
+using Microsoft.UI.Xaml.Controls.Primitives;
+using Microsoft.UI.Xaml.Data;
+using Microsoft.UI.Xaml.Input;
+using Microsoft.UI.Xaml.Media;
+using Microsoft.UI.Xaml.Navigation;
+using Microsoft.UI.Input;
+#else
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Controls;
+using Windows.UI.Xaml.Controls.Primitives;
+using Windows.UI.Xaml.Data;
+using Windows.UI.Xaml.Input;
+using Windows.UI.Xaml.Media;
+using Windows.UI.Xaml.Navigation;
+using Windows.UI.Input;
+using Windows.Devices.Input;
+#endif
+
+namespace Uno.Toolkit.UI;
+
+public partial class ZoomContentControl
+{
+	#region DependencyProperty: HorizontalOffset
+
+	public static DependencyProperty HorizontalOffsetProperty { get; } = DependencyProperty.Register(
+		nameof(HorizontalOffset),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double), OnHorizontalOffsetChanged));
+
+	public double HorizontalOffset
+	{
+		get => (double)GetValue(HorizontalOffsetProperty);
+		set => SetValue(HorizontalOffsetProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: HorizontalScrollValue
+
+	public static DependencyProperty HorizontalScrollValueProperty { get; } = DependencyProperty.Register(
+		nameof(HorizontalScrollValue),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double)));
+
+	public double HorizontalScrollValue
+	{
+		get => (double)GetValue(HorizontalScrollValueProperty);
+		set => SetValue(HorizontalScrollValueProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: HorizontalMinScroll
+
+	public static DependencyProperty HorizontalMinScrollProperty { get; } = DependencyProperty.Register(
+		nameof(HorizontalMinScroll),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double)));
+
+	public double HorizontalMinScroll
+	{
+		get => (double)GetValue(HorizontalMinScrollProperty);
+		set => SetValue(HorizontalMinScrollProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: HorizontalMaxScroll
+
+	public static DependencyProperty HorizontalMaxScrollProperty { get; } = DependencyProperty.Register(
+		nameof(HorizontalMaxScroll),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double)));
+
+	public double HorizontalMaxScroll
+	{
+		get => (double)GetValue(HorizontalMaxScrollProperty);
+		set => SetValue(HorizontalMaxScrollProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: HorizontalZoomCenter
+
+	public static DependencyProperty HorizontalZoomCenterProperty { get; } = DependencyProperty.Register(
+		nameof(HorizontalZoomCenter),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double)));
+
+	public double HorizontalZoomCenter
+	{
+		get => (double)GetValue(HorizontalZoomCenterProperty);
+		set => SetValue(HorizontalZoomCenterProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: VerticalOffset
+
+	public static DependencyProperty VerticalOffsetProperty { get; } = DependencyProperty.Register(
+		nameof(VerticalOffset),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double), OnVerticalOffsetChanged));
+
+	public double VerticalOffset
+	{
+		get => (double)GetValue(VerticalOffsetProperty);
+		set => SetValue(VerticalOffsetProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: VerticalScrollValue
+
+	public static DependencyProperty VerticalScrollValueProperty { get; } = DependencyProperty.Register(
+		nameof(VerticalScrollValue),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double)));
+
+	public double VerticalScrollValue
+	{
+		get => (double)GetValue(VerticalScrollValueProperty);
+		set => SetValue(VerticalScrollValueProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: VerticalMaxScroll
+
+	public static DependencyProperty VerticalMaxScrollProperty { get; } = DependencyProperty.Register(
+		nameof(VerticalMaxScroll),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double)));
+
+	public double VerticalMaxScroll
+	{
+		get => (double)GetValue(VerticalMaxScrollProperty);
+		set => SetValue(VerticalMaxScrollProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: VerticalMinScroll
+
+	public static DependencyProperty VerticalMinScrollProperty { get; } = DependencyProperty.Register(
+		nameof(VerticalMinScroll),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double)));
+
+	public double VerticalMinScroll
+	{
+		get => (double)GetValue(VerticalMinScrollProperty);
+		set => SetValue(VerticalMinScrollProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: VerticalZoomCenter
+
+	public static DependencyProperty VerticalZoomCenterProperty { get; } = DependencyProperty.Register(
+		nameof(VerticalZoomCenter),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double)));
+
+	public double VerticalZoomCenter
+	{
+		get => (double)GetValue(VerticalZoomCenterProperty);
+		set => SetValue(VerticalZoomCenterProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: ViewPortWidth
+
+	public static DependencyProperty ViewPortWidthProperty { get; } = DependencyProperty.Register(
+		nameof(ViewPortWidth),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double)));
+
+	public double ViewPortWidth
+	{
+		get => (double)GetValue(ViewPortWidthProperty);
+		set => SetValue(ViewPortWidthProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: ViewPortHeight
+
+	public static DependencyProperty ViewPortHeightProperty { get; } = DependencyProperty.Register(
+		nameof(ViewPortHeight),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double)));
+
+	public double ViewPortHeight
+	{
+		get => (double)GetValue(ViewPortHeightProperty);
+		set => SetValue(ViewPortHeightProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: ZoomLevel
+
+	public static DependencyProperty ZoomLevelProperty { get; } = DependencyProperty.Register(
+		nameof(ZoomLevel),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(1d, OnZoomLevelChanged));
+
+	public double ZoomLevel
+	{
+		get => (double)GetValue(ZoomLevelProperty);
+		set => SetValue(ZoomLevelProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: MinZoomLevel
+
+	public static DependencyProperty MinZoomLevelProperty { get; } = DependencyProperty.Register(
+		nameof(MinZoomLevel),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double), OnMinZoomLevelChanged));
+
+	public double MinZoomLevel
+	{
+		get => (double)GetValue(MinZoomLevelProperty);
+		set => SetValue(MinZoomLevelProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: MaxZoomLevel
+
+	public static DependencyProperty MaxZoomLevelProperty { get; } = DependencyProperty.Register(
+		nameof(MaxZoomLevel),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(500d, OnMaxZoomLevelChanged));
+
+	public double MaxZoomLevel
+	{
+		get => (double)GetValue(MaxZoomLevelProperty);
+		set => SetValue(MaxZoomLevelProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: PanWheelRatio
+
+	public static DependencyProperty PanWheelRatioProperty { get; } = DependencyProperty.Register(
+		nameof(PanWheelRatio),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(0.25d));
+
+	public double PanWheelRatio
+	{
+		get => (double)GetValue(PanWheelRatioProperty);
+		set => SetValue(PanWheelRatioProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: ScaleWheelRatio
+
+	public static DependencyProperty ScaleWheelRatioProperty { get; } = DependencyProperty.Register(
+		nameof(ScaleWheelRatio),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(0.0006d));
+
+	public double ScaleWheelRatio
+	{
+		get => (double)GetValue(ScaleWheelRatioProperty);
+		set => SetValue(ScaleWheelRatioProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: IsActive
+
+	public static DependencyProperty IsActiveProperty { get; } = DependencyProperty.Register(
+		nameof(IsActive),
+		typeof(bool),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(true, OnIsActiveChanged));
+
+	public bool IsActive
+	{
+		get => (bool)GetValue(IsActiveProperty);
+		set => SetValue(IsActiveProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: IsZoomAllowed
+
+	public static DependencyProperty IsZoomAllowedProperty { get; } = DependencyProperty.Register(
+		nameof(IsZoomAllowed),
+		typeof(bool),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(true));
+
+	public bool IsZoomAllowed
+	{
+		get => (bool)GetValue(IsZoomAllowedProperty);
+		set => SetValue(IsZoomAllowedProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: IsHorizontalScrollBarVisible
+
+	public static DependencyProperty IsHorizontalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
+		nameof(IsHorizontalScrollBarVisible),
+		typeof(bool),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(true));
+
+	public bool IsHorizontalScrollBarVisible
+	{
+		get => (bool)GetValue(IsHorizontalScrollBarVisibleProperty);
+		set => SetValue(IsHorizontalScrollBarVisibleProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: IsPanAllowed
+
+	public static DependencyProperty IsPanAllowedProperty { get; } = DependencyProperty.Register(
+		nameof(IsPanAllowed),
+		typeof(bool),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(true));
+
+	public bool IsPanAllowed
+	{
+		get => (bool)GetValue(IsPanAllowedProperty);
+		set => SetValue(IsPanAllowedProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: IsVerticalScrollBarVisible
+
+	public static DependencyProperty IsVerticalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
+		nameof(IsVerticalScrollBarVisible),
+		typeof(bool),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(true));
+
+	public bool IsVerticalScrollBarVisible
+	{
+		get => (bool)GetValue(IsVerticalScrollBarVisibleProperty);
+		set => SetValue(IsVerticalScrollBarVisibleProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: AutoZoomToCanvasOnSizeChanged
+
+	public static DependencyProperty AutoZoomToCanvasOnSizeChangedProperty { get; } = DependencyProperty.Register(
+		nameof(AutoZoomToCanvasOnSizeChanged),
+		typeof(bool),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(true));
+
+	public bool AutoZoomToCanvasOnSizeChanged
+	{
+		get => (bool)GetValue(AutoZoomToCanvasOnSizeChangedProperty);
+		set => SetValue(AutoZoomToCanvasOnSizeChangedProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: AdditionalMargin
+
+	public static DependencyProperty AdditionalMarginProperty { get; } = DependencyProperty.Register(
+		nameof(AdditionalMargin),
+		typeof(Thickness),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(new Thickness(0)));
+
+	public Thickness AdditionalMargin
+	{
+		get => (Thickness)GetValue(AdditionalMarginProperty);
+		set => SetValue(AdditionalMarginProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: ContentBoundsVisibility
+
+	public static DependencyProperty ContentBoundsVisibilityProperty { get; } = DependencyProperty.Register(
+		nameof(ContentBoundsVisibility),
+		typeof(BoundsVisibilityData),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(BoundsVisibilityData.None));
+
+	public BoundsVisibilityData ContentBoundsVisibility
+	{
+		get => (BoundsVisibilityData)GetValue(ContentBoundsVisibilityProperty);
+		set => SetValue(ContentBoundsVisibilityProperty, value);
+	}
+
+	#endregion
+
+	private static void OnHorizontalOffsetChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).OnHorizontalOffsetChanged();
+	private static void OnVerticalOffsetChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).OnVerticalOffsetChanged();
+	private static void OnZoomLevelChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).OnZoomLevelChanged();
+	private static void OnMinZoomLevelChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).CoerceZoomLevel();
+	private static void OnMaxZoomLevelChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).CoerceZoomLevel();
+	private static void OnIsActiveChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).IsActiveChanged();
+}
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index aab57387b..59b342eb6 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -74,272 +74,29 @@ public Size AvailableSize
 
 	public event EventHandler<EventArgs>? RenderedContentUpdated;
 
-	#region Dependency Properties
-	public static readonly DependencyProperty AdditionalMarginProperty =
-		DependencyProperty.Register(nameof(AdditionalMargin), typeof(Thickness), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: new Thickness(0)));
-
-	public static readonly DependencyProperty AutoZoomToCanvasOnSizeChangedProperty =
-		DependencyProperty.Register(nameof(AutoZoomToCanvasOnSizeChanged), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
-
-	public static readonly DependencyProperty IsActiveProperty =
-		DependencyProperty.Register(nameof(IsActive), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
-
-	public static readonly DependencyProperty IsHorizontalScrollBarVisibleProperty =
-		DependencyProperty.Register(nameof(IsHorizontalScrollBarVisible), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
-
-	public static readonly DependencyProperty IsVerticalScrollBarVisibleProperty =
-		DependencyProperty.Register(nameof(IsVerticalScrollBarVisible), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
-
-	public static readonly DependencyProperty ContentBoundsVisibilityDataProperty =
-		DependencyProperty.Register(nameof(ContentBoundsVisibility), typeof(BoundsVisibilityData), typeof(ZoomContentControl), new PropertyMetadata(BoundsVisibilityData.None));
-
-	public static readonly DependencyProperty IsZoomAllowedProperty =
-		DependencyProperty.Register(nameof(IsZoomAllowed), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
-
-	public static readonly DependencyProperty ZoomLevelProperty =
-		DependencyProperty.Register(nameof(ZoomLevel), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(1d));
-
-	public static readonly DependencyProperty MinZoomLevelProperty =
-		DependencyProperty.Register(nameof(MinZoomLevel), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
-
-	public static readonly DependencyProperty MaxZoomLevelProperty =
-		DependencyProperty.Register(nameof(MaxZoomLevel), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(500d));
-
-	public static readonly DependencyProperty HorizontalZoomCenterProperty =
-		DependencyProperty.Register(nameof(HorizontalZoomCenter), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
-
-	public static readonly DependencyProperty VerticalZoomCenterProperty =
-		DependencyProperty.Register(nameof(VerticalZoomCenter), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
-
-	public static readonly DependencyProperty ScaleWheelRatioProperty =
-		DependencyProperty.Register(nameof(ScaleWheelRatio), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0006d));
-
-	public static readonly DependencyProperty PanWheelRatioProperty =
-		DependencyProperty.Register(nameof(PanWheelRatio), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.25d));
-
-	public static readonly DependencyProperty IsPanAllowedProperty =
-		DependencyProperty.Register(nameof(IsPanAllowed), typeof(bool), typeof(ZoomContentControl), new PropertyMetadata(defaultValue: true));
-
-	public static readonly DependencyProperty HorizontalOffsetProperty =
-		DependencyProperty.Register(nameof(HorizontalOffset), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
-
-	public static readonly DependencyProperty VerticalOffsetProperty =
-		DependencyProperty.Register(nameof(VerticalOffset), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
-
-	public static readonly DependencyProperty VerticalMaxScrollProperty =
-		DependencyProperty.Register(nameof(VerticalMaxScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
-
-	public static readonly DependencyProperty VerticalMinScrollProperty =
-		DependencyProperty.Register(nameof(VerticalMinScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
-
-	public static readonly DependencyProperty HorizontalMaxScrollProperty =
-		DependencyProperty.Register(nameof(HorizontalMaxScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
-
-	public static readonly DependencyProperty HorizontalMinScrollProperty =
-		DependencyProperty.Register(nameof(HorizontalMinScroll), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
-
-	public static readonly DependencyProperty HorizontalScrollValueProperty =
-		DependencyProperty.Register(nameof(HorizontalScrollValue), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
-
-	public static readonly DependencyProperty VerticalScrollValueProperty =
-		DependencyProperty.Register(nameof(VerticalScrollValue), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
-
-	public static readonly DependencyProperty ViewPortWidthProperty =
-		DependencyProperty.Register(nameof(ViewPortWidth), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
-
-	public static readonly DependencyProperty ViewPortHeightProperty =
-		DependencyProperty.Register(nameof(ViewPortHeight), typeof(double), typeof(ZoomContentControl), new PropertyMetadata(0.0d));
-
-	public Thickness AdditionalMargin
-	{
-		get => (Thickness)GetValue(AdditionalMarginProperty);
-		set => SetValue(AdditionalMarginProperty, value);
-	}
-
-	public bool AutoZoomToCanvasOnSizeChanged
-	{
-		get => (bool)GetValue(AutoZoomToCanvasOnSizeChangedProperty);
-		set => SetValue(AutoZoomToCanvasOnSizeChangedProperty, value);
-	}
-
-	public bool IsActive
-	{
-		get => (bool)GetValue(IsActiveProperty);
-		set => SetValue(IsActiveProperty, value);
-	}
-
-	public bool IsZoomAllowed
-	{
-		get => (bool)GetValue(IsZoomAllowedProperty);
-		set => SetValue(IsZoomAllowedProperty, value);
-	}
-
-	public bool IsHorizontalScrollBarVisible
-	{
-		get => (bool)GetValue(IsHorizontalScrollBarVisibleProperty);
-		set => SetValue(IsHorizontalScrollBarVisibleProperty, value);
-	}
-
-	public bool IsVerticalScrollBarVisible
-	{
-		get => (bool)GetValue(IsVerticalScrollBarVisibleProperty);
-		set => SetValue(IsVerticalScrollBarVisibleProperty, value);
-	}
-
-	public BoundsVisibilityData ContentBoundsVisibility
-	{
-		get => (BoundsVisibilityData)GetValue(ContentBoundsVisibilityDataProperty);
-		private set => SetValue(ContentBoundsVisibilityDataProperty, value);
-	}
-
-	public double ZoomLevel
-	{
-		get => (double)GetValue(ZoomLevelProperty);
-		set => SetValue(ZoomLevelProperty, value);
-	}
-
-	public double MinZoomLevel
-	{
-		get => (double)GetValue(MinZoomLevelProperty);
-		set => SetValue(MinZoomLevelProperty, value);
-	}
-
-	public double MaxZoomLevel
-	{
-		get => (double)GetValue(MaxZoomLevelProperty);
-		set => SetValue(MaxZoomLevelProperty, value);
-	}
-
-	public double HorizontalZoomCenter
-	{
-		get => (double)GetValue(HorizontalZoomCenterProperty);
-		set => SetValue(HorizontalZoomCenterProperty, value);
-	}
-
-	public double VerticalZoomCenter
-	{
-		get => (double)GetValue(VerticalZoomCenterProperty);
-		set => SetValue(VerticalZoomCenterProperty, value);
-	}
-
-	public double ScaleWheelRatio
-	{
-		get => (double)GetValue(ScaleWheelRatioProperty);
-		set => SetValue(ScaleWheelRatioProperty, value);
-	}
-
-	public double PanWheelRatio
-	{
-		get => (double)GetValue(PanWheelRatioProperty);
-		set => SetValue(PanWheelRatioProperty, value);
-	}
-
-	public bool IsPanAllowed
-	{
-		get => (bool)GetValue(IsPanAllowedProperty);
-		set => SetValue(IsPanAllowedProperty, value);
-	}
-
-	public double HorizontalOffset
-	{
-		get => (double)GetValue(HorizontalOffsetProperty);
-		set => SetValue(HorizontalOffsetProperty, value);
-	}
-
-	public double VerticalOffset
-	{
-		get => (double)GetValue(VerticalOffsetProperty);
-		set => SetValue(VerticalOffsetProperty, value);
-	}
-
-	public double VerticalMaxScroll
-	{
-		get => (double)GetValue(VerticalMaxScrollProperty);
-		set => SetValue(VerticalMaxScrollProperty, value);
-	}
-
-	public double VerticalMinScroll
-	{
-		get => (double)GetValue(VerticalMinScrollProperty);
-		set => SetValue(VerticalMinScrollProperty, value);
-	}
-
-	public double HorizontalMaxScroll
-	{
-		get => (double)GetValue(HorizontalMaxScrollProperty);
-		set => SetValue(HorizontalMaxScrollProperty, value);
-	}
-
-	public double HorizontalMinScroll
-	{
-		get => (double)GetValue(HorizontalMinScrollProperty);
-		set => SetValue(HorizontalMinScrollProperty, value);
-	}
-
-	public double HorizontalScrollValue
-	{
-		get => (double)GetValue(HorizontalScrollValueProperty);
-		set => SetValue(HorizontalScrollValueProperty, value);
-	}
-
-	public double VerticalScrollValue
-	{
-		get => (double)GetValue(VerticalScrollValueProperty);
-		set => SetValue(VerticalScrollValueProperty, value);
-	}
-
-	public double ViewPortHeight
-	{
-		get => (double)GetValue(ViewPortHeightProperty);
-		set => SetValue(ViewPortHeightProperty, value);
-	}
-
-	public double ViewPortWidth
-	{
-		get => (double)GetValue(ViewPortWidthProperty);
-		set => SetValue(ViewPortWidthProperty, value);
-	}
-
-	#endregion
-
 	private async Task RaiseRenderedContentUpdated()
 	{
 		await Task.Yield();
 		RenderedContentUpdated?.Invoke(this, EventArgs.Empty);
 	}
 
-	private void RegisterPropertyHandlers()
-	{
-		// Register for property changed events.
-		RegisterPropertyChangedCallback(ZoomLevelProperty, OnZoomLevelChanged);
-		RegisterPropertyChangedCallback(MinZoomLevelProperty, CoerceZoomLevel);
-		RegisterPropertyChangedCallback(MaxZoomLevelProperty, CoerceZoomLevel);
-
-		RegisterPropertyChangedCallback(HorizontalOffsetProperty, OnHorizontalOffsetChanged);
-		RegisterPropertyChangedCallback(VerticalOffsetProperty, OnVerticalOffsetChanged);
-
-		RegisterPropertyChangedCallback(IsActiveProperty, IsActiveChanged);
-
-		this.SizeChanged += (s, e) => UpdateContentBoundsVisibility();
-	}
-
-	private void OnVerticalOffsetChanged(DependencyObject sender, DependencyProperty dp)
+	private void OnVerticalOffsetChanged()
 	{
 		UpdateContentBoundsVisibility();
 		UpdateScrollVisibility();
 		UpdateVerticalScrollBarValue();
 	}
 
-	private void OnHorizontalOffsetChanged(DependencyObject sender, DependencyProperty dp)
+	private void OnHorizontalOffsetChanged()
 	{
 		UpdateContentBoundsVisibility();
 		UpdateScrollVisibility();
 		UpdateHorizontalScrollBarValue();
 	}
 
-	private async void OnZoomLevelChanged(DependencyObject sender, DependencyProperty dp)
+	private async void OnZoomLevelChanged()
 	{
-		CoerceZoomLevel(sender, dp);
+		CoerceZoomLevel();
 		UpdateScrollLimits();
 		UpdateContentBoundsVisibility();
 		UpdateScrollVisibility();
@@ -410,7 +167,7 @@ private async void UpdateHorizontalScrollBarValue()
 		await RaiseRenderedContentUpdated();
 	}
 
-	private void IsActiveChanged(DependencyObject sender, DependencyProperty dp)
+	private void IsActiveChanged()
 	{
 		if (ResetWhenNotActive && !IsActive)
 		{
@@ -445,18 +202,15 @@ private void UpdateScrollLimits()
 		}
 	}
 
-	private void CoerceZoomLevel(DependencyObject sender, DependencyProperty dp)
+	private void CoerceZoomLevel()
 	{
-		var control = (ZoomContentControl)sender;
-		control.ZoomLevel = Math.Clamp(control.ZoomLevel, control.MinZoomLevel, control.MaxZoomLevel);
+		ZoomLevel = Math.Clamp(ZoomLevel, MinZoomLevel, MaxZoomLevel);
 	}
 
 	public ZoomContentControl()
 	{
 		DefaultStyleKey = typeof(ZoomContentControl);
 
-		RegisterPropertyHandlers();
-
 		this.Loaded += OnLoaded;
 		this.SizeChanged += OnSizeChanged;
 	}
@@ -468,6 +222,7 @@ private void OnLoaded(object sender, RoutedEventArgs e)
 
 	private void OnSizeChanged(object sender, SizeChangedEventArgs args)
 	{
+		UpdateContentBoundsVisibility();
 		if (IsLoaded && AutoZoomToCanvasOnSizeChanged)
 		{
 			FitToCanvas();

From 81f4bc1996062084d676a338bf03ec8577d20924 Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Fri, 4 Oct 2024 11:43:36 -0400
Subject: [PATCH 14/30] chore: refactor ZoomContentControl.cs

---
 .../ZoomContentControl/ZoomContentControl.cs  | 218 +++++++-----------
 1 file changed, 86 insertions(+), 132 deletions(-)

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index 59b342eb6..bcd4a320f 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -31,7 +31,6 @@
 using Windows.Devices.Input;
 #endif
 
-
 namespace Uno.Toolkit.UI;
 
 [TemplatePart(Name = TemplateParts.RootGrid, Type = typeof(Grid))]
@@ -43,23 +42,35 @@ public partial class ZoomContentControl : ContentControl
 	private static class TemplateParts
 	{
 		public const string RootGrid = "PART_RootGrid";
-
 		public const string Presenter = "PART_Presenter";
-
 		public const string HorizontalScrollBar = "PART_ScrollH";
 		public const string VerticalScrollBar = "PART_ScrollV";
 	}
 
+	// Fields
 	private ContentPresenter? _presenter;
 	private ScrollBar? _scrollV;
 	private ScrollBar? _scrollH;
-
 	private Point _lastPosition = new Point(0, 0);
-
 	private (bool Horizontal, bool Vertical) _movementDirection = (false, false);
-
 	private bool IsAllowedToWork => (IsEnabled && IsActive && _presenter is not null);
+	private double _previousVerticalScrollValue = double.MinValue;
+	private double _previousHorizontalScrollValue = double.MinValue;
+	private uint _capturedPointerId;
+	private Point _referencePosition;
 
+	// Constructor
+	public ZoomContentControl()
+	{
+		DefaultStyleKey = typeof(ZoomContentControl);
+		Loaded += OnLoaded;
+		SizeChanged += OnSizeChanged;
+	}
+
+	// Events
+	public event EventHandler<EventArgs>? RenderedContentUpdated;
+
+	// Dependency Properties
 	public bool ResetWhenNotActive { get; set; } = true;
 
 	public Size AvailableSize
@@ -72,8 +83,7 @@ public Size AvailableSize
 		}
 	}
 
-	public event EventHandler<EventArgs>? RenderedContentUpdated;
-
+	// Methods
 	private async Task RaiseRenderedContentUpdated()
 	{
 		await Task.Yield();
@@ -103,12 +113,6 @@ private async void OnZoomLevelChanged()
 		await RaiseRenderedContentUpdated();
 	}
 
-	public record BoundsVisibilityData(bool LeftEdge, bool TopEdge, bool RightEdge, bool BottomEdge)
-	{
-		public static BoundsVisibilityData None => new BoundsVisibilityData(false, false, false, false);
-		public bool AllEdgesVisible => LeftEdge && TopEdge && RightEdge && BottomEdge;
-	}
-
 	private void UpdateContentBoundsVisibility()
 	{
 		if (_presenter?.Content is FrameworkElement fe)
@@ -118,8 +122,8 @@ private void UpdateContentBoundsVisibility()
 			ContentBoundsVisibility = new BoundsVisibilityData(
 				m.OffsetX >= 0,
 				m.OffsetY >= 0,
-				this.ActualWidth >= (fe.ActualWidth * ZoomLevel) + m.OffsetX,
-				this.ActualHeight >= (fe.ActualHeight * ZoomLevel) + m.OffsetY);
+				ActualWidth >= (fe.ActualWidth * ZoomLevel) + m.OffsetX,
+				ActualHeight >= (fe.ActualHeight * ZoomLevel) + m.OffsetY);
 		}
 	}
 
@@ -146,21 +150,16 @@ private bool CanMoveIn((bool Horizontal, bool Vertical) _movementDirection)
 	}
 
 	private bool CanScrollUp() => !ContentBoundsVisibility.TopEdge;
-
 	private bool CanScrollDown() => !ContentBoundsVisibility.BottomEdge;
-
 	private bool CanScrollLeft() => !ContentBoundsVisibility.LeftEdge;
-
 	private bool CanScrollRight() => !ContentBoundsVisibility.RightEdge;
 
-	//Slide move is always on the opposite direction of the drag
 	private async void UpdateVerticalScrollBarValue()
 	{
 		VerticalScrollValue = VerticalOffset;
 		await RaiseRenderedContentUpdated();
 	}
 
-	//Slide move is always on the opposite direction of the drag
 	private async void UpdateHorizontalScrollBarValue()
 	{
 		HorizontalScrollValue = -1 * HorizontalOffset;
@@ -188,9 +187,6 @@ private void UpdateScrollLimits()
 	{
 		if (_presenter?.Content is FrameworkElement fe)
 		{
-			// If Actual Width/Height * Zoom < ViewPort Width/Height there should be no scroll
-			// If Actual Width/Height * Zoom > ViewPort Width/Height the amount of scroll should
-			// be based on the difference between the two values
 			var verticalScroll = Math.Max(0, (fe.ActualHeight * ZoomLevel) - ViewPortHeight);
 			var horizontalScroll = Math.Max(0, (fe.ActualWidth * ZoomLevel) - ViewPortWidth);
 
@@ -207,14 +203,25 @@ private void CoerceZoomLevel()
 		ZoomLevel = Math.Clamp(ZoomLevel, MinZoomLevel, MaxZoomLevel);
 	}
 
-	public ZoomContentControl()
+	// Template handling
+	protected override void OnApplyTemplate()
 	{
-		DefaultStyleKey = typeof(ZoomContentControl);
+		T FindTemplatePart<T>(string name) where T : class =>
+			(GetTemplateChild(name) ?? throw new Exception($"Expected template part not found: {name}"))
+			as T ?? throw new Exception($"Expected template part '{name}' to be of type: {typeof(T)}");
+
+		_presenter = FindTemplatePart<ContentPresenter>(TemplateParts.Presenter);
+		_scrollV = FindTemplatePart<ScrollBar>(TemplateParts.VerticalScrollBar);
+		_scrollH = FindTemplatePart<ScrollBar>(TemplateParts.HorizontalScrollBar);
+
+		ResetOffset();
+		ResetZoom();
 
-		this.Loaded += OnLoaded;
-		this.SizeChanged += OnSizeChanged;
+		RegisterToControlEvents();
+		RegisterPointerHandlers();
 	}
 
+	// Event handlers
 	private void OnLoaded(object sender, RoutedEventArgs e)
 	{
 		CenterContent();
@@ -229,24 +236,6 @@ private void OnSizeChanged(object sender, SizeChangedEventArgs args)
 		}
 	}
 
-	protected override void OnApplyTemplate()
-	{
-		T FindTemplatePart<T>(string name) where T : class =>
-			(GetTemplateChild(name) ?? throw new Exception($"Expected template part not found: {name}"))
-			as T ?? throw new Exception($"Expected template part '{name}' to be of type: {typeof(T)}");
-		_presenter = FindTemplatePart<ContentPresenter>(TemplateParts.Presenter);
-		_scrollV = FindTemplatePart<ScrollBar>(TemplateParts.VerticalScrollBar);
-		_scrollH = FindTemplatePart<ScrollBar>(TemplateParts.HorizontalScrollBar);
-
-		ResetOffset();
-		ResetZoom();
-
-		RegisterToControlEvents();
-		RegisterPointerHandlers();
-	}
-
-	#region ScrollBars Events
-
 	private void RegisterToControlEvents()
 	{
 		if (_presenter?.Content is FrameworkElement { } fe)
@@ -271,11 +260,19 @@ private void RegisterToControlEvents()
 		}
 	}
 
-	private double _previousVerticalScrollValue = double.MinValue;
+	private void RegisterPointerHandlers()
+	{
+		PointerPressed -= OnPointerPressed;
+		PointerReleased -= OnPointerReleased;
+		PointerMoved -= OnPointerMoved;
+		PointerWheelChanged -= OnPointerWheelChanged;
 
-	private double _previousHorizontalScrollValue = double.MinValue;
+		PointerPressed += OnPointerPressed;
+		PointerReleased += OnPointerReleased;
+		PointerMoved += OnPointerMoved;
+		PointerWheelChanged += OnPointerWheelChanged;
+	}
 
-	//TemplateBinding doesn't support TwoWay mode. We need to manually update the values
 	private void ScrollV_Scroll(object sender, ScrollEventArgs e)
 	{
 		if ((_previousVerticalScrollValue > e.NewValue && !CanScrollUp()) ||
@@ -300,51 +297,22 @@ private void ScrollH_Scroll(object sender, ScrollEventArgs e)
 		_previousHorizontalScrollValue = e.NewValue;
 	}
 
-	#endregion
-
-	private uint _capturedPointerId;
-	private Point _referencePosition;
-
-	private void RegisterPointerHandlers()
-	{
-		// Register for pointer events.
-		PointerPressed -= OnPointerPressed;
-		PointerReleased -= OnPointerReleased;
-		PointerMoved -= OnPointerMoved;
-		PointerWheelChanged -= OnPointerWheelChanged;
-
-		PointerPressed += OnPointerPressed;
-		PointerReleased += OnPointerReleased;
-		PointerMoved += OnPointerMoved;
-		PointerWheelChanged += OnPointerWheelChanged;
-	}
-
+	// Additional private methods for pointer handling
 	private void OnPointerPressed(object sender, PointerRoutedEventArgs e)
 	{
-		if (!IsAllowedToWork)
-		{
-			return; // Don't handle the event when the control is disabled.
-		}
-
+		if (!IsAllowedToWork) return;
 		var pointerPoint = e.GetCurrentPoint(this);
 		var pointerProperties = pointerPoint.Properties;
 
-		// If the middle button of a mouse is pressed, then we want to handle the event.
-		if (pointerProperties.IsMiddleButtonPressed
-#if IS_WINUI
-			&& pointerPoint.PointerDeviceType == PointerDeviceType.Mouse)
-#else
-			&& pointerPoint.PointerDevice.PointerDeviceType == PointerDeviceType.Mouse)
-#endif
+		if (pointerProperties.IsMiddleButtonPressed &&
+			pointerPoint.PointerDeviceType == PointerDeviceType.Mouse)
 		{
 			e.Handled = true;
 
-			// Capture the pointer so that we can track its movement even if it leaves the bounds of the control.
-			var pointer = e.Pointer;
-			var captured = CapturePointer(pointer);
+			var captured = CapturePointer(e.Pointer);
 			if (captured)
 			{
-				_capturedPointerId = pointer.PointerId;
+				_capturedPointerId = e.Pointer.PointerId;
 				_referencePosition = pointerPoint.Position;
 				_lastPosition = _referencePosition;
 			}
@@ -359,10 +327,7 @@ private void OnPointerReleased(object sender, PointerRoutedEventArgs e)
 
 	private void OnPointerMoved(object sender, PointerRoutedEventArgs e)
 	{
-		if (!(IsAllowedToWork && _capturedPointerId > 0 && IsPanAllowed))
-		{
-			return;
-		}
+		if (!(IsAllowedToWork && _capturedPointerId > 0 && IsPanAllowed)) return;
 
 		var currentPosition = e.GetCurrentPoint(this).Position;
 		_movementDirection = (currentPosition.X > _lastPosition.X, currentPosition.Y > _lastPosition.Y);
@@ -370,70 +335,31 @@ private void OnPointerMoved(object sender, PointerRoutedEventArgs e)
 
 		if (CanMoveIn(_movementDirection))
 		{
-			// If the pointer is captured, then we want to handle the event.
 			e.Handled = true;
-
 			var pointerPoint = e.GetCurrentPoint(this);
-
-			// Adjust the offsets based on the pointer's movement.
 			var position = pointerPoint.Position;
 			var deltaX = position.X - _referencePosition.X;
 			var deltaY = position.Y - _referencePosition.Y;
-
 			TryUpdateOffsets(deltaX, deltaY);
-
-			// Update the starting position for next time.
 			_referencePosition = position;
 		}
 	}
 
-	private void TryUpdateOffsets(double deltaX, double deltaY)
-	{
-		if ((deltaX > 0 && CanScrollLeft()) ||
-			(deltaX < 0 && CanScrollRight()))
-		{
-			var offset = HorizontalOffset + deltaX;
-			var max = HorizontalMaxScroll * ZoomLevel;
-
-			HorizontalOffset = Math.Clamp(offset, 0, max);
-		}
-
-		if ((deltaY > 0 && CanScrollUp()) ||
-			(deltaY < 0 && CanScrollDown()))
-		{
-			var offset = VerticalOffset + deltaY;
-
-			var max = VerticalMaxScroll * ZoomLevel;
-
-			VerticalOffset = Math.Clamp(offset, 0, max);
-		}
-	}
-
 	private void OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
 	{
-		if (!IsAllowedToWork)
-		{
-			return; // Don't handle the event when the control is disabled.
-		}
+		if (!IsAllowedToWork) return;
 
 		var pointerPoint = e.GetCurrentPoint(this);
 		var pointerProperties = pointerPoint.Properties;
 
 		var changeRatio = GetZoomDelta(pointerProperties);
 
-		//Zoom In/Out
-		if (
-#if IS_WINUI
-			pointerPoint.PointerDeviceType == PointerDeviceType.Mouse &&
-#else
-			pointerPoint.PointerDevice.PointerDeviceType == PointerDeviceType.Mouse &&
-#endif
+		if (pointerPoint.PointerDeviceType == PointerDeviceType.Mouse &&
 			e.KeyModifiers.HasFlag(Windows.System.VirtualKeyModifiers.Control) &&
 			IsZoomAllowed)
 		{
 			e.Handled = true;
 
-			// Pointer relative to the content
 			var relativeX = (pointerPoint.Position.X - HorizontalOffset) / ZoomLevel;
 			var relativeY = (pointerPoint.Position.Y - VerticalOffset) / ZoomLevel;
 
@@ -444,7 +370,6 @@ private void OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
 			return;
 		}
 
-		//Horizontal Scroll
 		if (e.KeyModifiers.HasFlag(Windows.System.VirtualKeyModifiers.Shift))
 		{
 			var deltaX = GetPanDelta(pointerProperties);
@@ -452,7 +377,6 @@ private void OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
 			return;
 		}
 
-		//Vertical Scroll
 		var deltaY = GetPanDelta(pointerProperties);
 		TryUpdateOffsets(0, deltaY);
 	}
@@ -469,6 +393,26 @@ private double GetPanDelta(PointerPointProperties pointerProperties)
 		return delta;
 	}
 
+	private void TryUpdateOffsets(double deltaX, double deltaY)
+	{
+		if ((deltaX > 0 && CanScrollLeft()) ||
+			(deltaX < 0 && CanScrollRight()))
+		{
+			var offset = HorizontalOffset + deltaX;
+			var max = HorizontalMaxScroll * ZoomLevel;
+			HorizontalOffset = Math.Clamp(offset, 0, max);
+		}
+
+		if ((deltaY > 0 && CanScrollUp()) ||
+			(deltaY < 0 && CanScrollDown()))
+		{
+			var offset = VerticalOffset + deltaY;
+			var max = VerticalMaxScroll * ZoomLevel;
+			VerticalOffset = Math.Clamp(offset, 0, max);
+		}
+	}
+
+	// Public methods
 	public void Initialize()
 	{
 		if (_presenter?.Content is FrameworkElement { } fe)
@@ -515,5 +459,15 @@ public void FitToCanvas()
 			CenterContent();
 		}
 	}
-	private static Matrix GetPositionMatrix(FrameworkElement element, FrameworkElement rootElement) => ((MatrixTransform)element.TransformToVisual(rootElement)).Matrix;
+
+	// Record for BoundsVisibilityData
+	public record BoundsVisibilityData(bool LeftEdge, bool TopEdge, bool RightEdge, bool BottomEdge)
+	{
+		public static BoundsVisibilityData None => new BoundsVisibilityData(false, false, false, false);
+		public bool AllEdgesVisible => LeftEdge && TopEdge && RightEdge && BottomEdge;
+	}
+
+	// Static helper
+	private static Matrix GetPositionMatrix(FrameworkElement element, FrameworkElement rootElement)
+		=> ((MatrixTransform)element.TransformToVisual(rootElement)).Matrix;
 }

From 6fb19a691d5285aeda984ace964e46555d3f7098 Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Fri, 4 Oct 2024 15:39:20 -0400
Subject: [PATCH 15/30] fix: ci build

---
 .../ZoomContentControl/ZoomContentControl.cs      | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index bcd4a320f..52e617182 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -304,8 +304,12 @@ private void OnPointerPressed(object sender, PointerRoutedEventArgs e)
 		var pointerPoint = e.GetCurrentPoint(this);
 		var pointerProperties = pointerPoint.Properties;
 
-		if (pointerProperties.IsMiddleButtonPressed &&
-			pointerPoint.PointerDeviceType == PointerDeviceType.Mouse)
+		if (pointerProperties.IsMiddleButtonPressed
+#if IS_WINUI
+			&& pointerPoint.PointerDeviceType == PointerDeviceType.Mouse)
+#else
+			&& pointerPoint.PointerDevice.PointerDeviceType == PointerDeviceType.Mouse)
+#endif
 		{
 			e.Handled = true;
 
@@ -354,7 +358,12 @@ private void OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
 
 		var changeRatio = GetZoomDelta(pointerProperties);
 
-		if (pointerPoint.PointerDeviceType == PointerDeviceType.Mouse &&
+		if (
+#if IS_WINUI
+			pointerPoint.PointerDeviceType == PointerDeviceType.Mouse &&
+#else
+			pointerPoint.PointerDevice.PointerDeviceType == PointerDeviceType.Mouse &&
+#endif
 			e.KeyModifiers.HasFlag(Windows.System.VirtualKeyModifiers.Control) &&
 			IsZoomAllowed)
 		{

From 719482541baf1f9287392ff12d0a89143eff8224 Mon Sep 17 00:00:00 2001
From: xiaoy312 <xiaoyao312@gmail.com>
Date: Thu, 10 Oct 2024 12:57:17 -0400
Subject: [PATCH 16/30] chore: refactor

---
 .../BoundsVisibilityFlag.cs                   | 15 ++++++++
 .../ZoomContentControl.Properties.cs          |  8 ++---
 .../ZoomContentControl/ZoomContentControl.cs  | 35 +++++++++----------
 3 files changed, 35 insertions(+), 23 deletions(-)
 create mode 100644 src/Uno.Toolkit.UI/Controls/ZoomContentControl/BoundsVisibilityFlag.cs

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/BoundsVisibilityFlag.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/BoundsVisibilityFlag.cs
new file mode 100644
index 000000000..6e480c5a6
--- /dev/null
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/BoundsVisibilityFlag.cs
@@ -0,0 +1,15 @@
+using System;
+
+namespace Uno.Toolkit.UI;
+
+[Flags]
+public enum BoundsVisibilityFlag
+{
+	Left = 1 << 0,
+	Top = 1 << 1,
+	Right = 1 << 2,
+	Bottom = 1 << 3,
+
+	None = 0,
+	All = Left | Top | Right | Bottom,
+}
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
index 5527c6eb9..1c00c49fc 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
@@ -399,13 +399,13 @@ public Thickness AdditionalMargin
 
 	public static DependencyProperty ContentBoundsVisibilityProperty { get; } = DependencyProperty.Register(
 		nameof(ContentBoundsVisibility),
-		typeof(BoundsVisibilityData),
+		typeof(BoundsVisibilityFlag),
 		typeof(ZoomContentControl),
-		new PropertyMetadata(BoundsVisibilityData.None));
+		new PropertyMetadata(BoundsVisibilityFlag.None));
 
-	public BoundsVisibilityData ContentBoundsVisibility
+	public BoundsVisibilityFlag ContentBoundsVisibility
 	{
-		get => (BoundsVisibilityData)GetValue(ContentBoundsVisibilityProperty);
+		get => (BoundsVisibilityFlag)GetValue(ContentBoundsVisibilityProperty);
 		set => SetValue(ContentBoundsVisibilityProperty, value);
 	}
 
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index 52e617182..fd14ccd8e 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -31,6 +31,8 @@
 using Windows.Devices.Input;
 #endif
 
+using static Uno.Toolkit.UI.BoundsVisibilityFlag;
+
 namespace Uno.Toolkit.UI;
 
 [TemplatePart(Name = TemplateParts.RootGrid, Type = typeof(Grid))]
@@ -119,23 +121,25 @@ private void UpdateContentBoundsVisibility()
 		{
 			var m = GetPositionMatrix(fe, this);
 
-			ContentBoundsVisibility = new BoundsVisibilityData(
-				m.OffsetX >= 0,
-				m.OffsetY >= 0,
-				ActualWidth >= (fe.ActualWidth * ZoomLevel) + m.OffsetX,
-				ActualHeight >= (fe.ActualHeight * ZoomLevel) + m.OffsetY);
+			var flags = None;
+			if (m.OffsetX >= 0) flags |= Left;
+			if (m.OffsetY >= 0) flags |= Top;
+			if (ActualWidth >= (fe.ActualWidth * ZoomLevel) + m.OffsetX) flags |= Right;
+			if (ActualHeight >= (fe.ActualHeight * ZoomLevel) + m.OffsetY) flags |= Bottom;
+
+			ContentBoundsVisibility = flags;
 		}
 	}
 
 	private void UpdateScrollVisibility()
 	{
-		IsHorizontalScrollBarVisible = !(ContentBoundsVisibility.RightEdge && ContentBoundsVisibility.LeftEdge);
-		IsVerticalScrollBarVisible = !(ContentBoundsVisibility.TopEdge && ContentBoundsVisibility.BottomEdge);
+		IsHorizontalScrollBarVisible = !ContentBoundsVisibility.HasFlag(Left | Right);
+		IsVerticalScrollBarVisible = !ContentBoundsVisibility.HasFlag(Top | Bottom);
 	}
 
 	private bool CanMoveIn((bool Horizontal, bool Vertical) _movementDirection)
 	{
-		if (ContentBoundsVisibility.AllEdgesVisible)
+		if (ContentBoundsVisibility.HasFlag(All))
 		{
 			return false;
 		}
@@ -149,10 +153,10 @@ private bool CanMoveIn((bool Horizontal, bool Vertical) _movementDirection)
 		return canMove;
 	}
 
-	private bool CanScrollUp() => !ContentBoundsVisibility.TopEdge;
-	private bool CanScrollDown() => !ContentBoundsVisibility.BottomEdge;
-	private bool CanScrollLeft() => !ContentBoundsVisibility.LeftEdge;
-	private bool CanScrollRight() => !ContentBoundsVisibility.RightEdge;
+	private bool CanScrollUp() => !ContentBoundsVisibility.HasFlag(Top);
+	private bool CanScrollDown() => !ContentBoundsVisibility.HasFlag(Bottom);
+	private bool CanScrollLeft() => !ContentBoundsVisibility.HasFlag(Left);
+	private bool CanScrollRight() => !ContentBoundsVisibility.HasFlag(Right);
 
 	private async void UpdateVerticalScrollBarValue()
 	{
@@ -469,13 +473,6 @@ public void FitToCanvas()
 		}
 	}
 
-	// Record for BoundsVisibilityData
-	public record BoundsVisibilityData(bool LeftEdge, bool TopEdge, bool RightEdge, bool BottomEdge)
-	{
-		public static BoundsVisibilityData None => new BoundsVisibilityData(false, false, false, false);
-		public bool AllEdgesVisible => LeftEdge && TopEdge && RightEdge && BottomEdge;
-	}
-
 	// Static helper
 	private static Matrix GetPositionMatrix(FrameworkElement element, FrameworkElement rootElement)
 		=> ((MatrixTransform)element.TransformToVisual(rootElement)).Matrix;

From d1ddfee973358cd98285068e7f2fe5c980896e57 Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Thu, 10 Oct 2024 14:03:05 -0400
Subject: [PATCH 17/30] chore: refactor

---
 .../Tests/ZoomContentControlTest.cs           | 11 ++-
 .../ZoomContentControl.Properties.cs          | 98 ++++++++++++++++---
 .../ZoomContentControl/ZoomContentControl.cs  | 50 +++++-----
 .../ZoomContentControl.xaml                   |  4 +-
 4 files changed, 117 insertions(+), 46 deletions(-)

diff --git a/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs b/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs
index c2105c9ac..df77f434f 100644
--- a/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs
+++ b/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs
@@ -139,6 +139,8 @@ public async Task When_ContentBounds_ShouldHideScrollBars()
 			SUT.IsVerticalScrollBarVisible.Should().BeTrue();
 		}
 
+		// FindFirstDescendent is not available in UWP
+#if !IS_UWP
 		[TestMethod]
 		public async Task When_Pan_ShouldUpdateOffsets()
 		{
@@ -151,20 +153,21 @@ public async Task When_Pan_ShouldUpdateOffsets()
 				HorizontalOffset = 0,
 				VerticalOffset = 0,
 			};
-
+ 
 			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
-
+ 
 			var presenter = SUT.FindFirstDescendant<ContentPresenter>("PART_Presenter");
 			var translation = (presenter?.RenderTransform as TransformGroup)?.Children[1] as TranslateTransform
 				?? throw new Exception("Failed to find PART_Presenter's TranslateTransform");
-
+ 
 			// Simulate panning
 			SUT.HorizontalOffset = 50;
 			SUT.VerticalOffset = 50;
-
+ 
 			// Verify that the content's translate transform has been updated to reflect the new offsets
 			translation.X.Should().Be(50);
 			translation.Y.Should().Be(50);
 		}
+#endif
 	}
 }
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
index 1c00c49fc..270b8e06b 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
@@ -37,12 +37,14 @@ public partial class ZoomContentControl
 {
 	#region DependencyProperty: HorizontalOffset
 
+	/// Identifies the HorizontalOffset dependency property.
 	public static DependencyProperty HorizontalOffsetProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalOffset),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double), OnHorizontalOffsetChanged));
 
+	/// Gets or sets the horizontal offset for panning the content.
 	public double HorizontalOffset
 	{
 		get => (double)GetValue(HorizontalOffsetProperty);
@@ -50,14 +52,17 @@ public double HorizontalOffset
 	}
 
 	#endregion
+
 	#region DependencyProperty: HorizontalScrollValue
 
+	/// Identifies the HorizontalScrollValue dependency property.
 	public static DependencyProperty HorizontalScrollValueProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalScrollValue),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
+	/// Gets or sets the value of the horizontal scrollbar.
 	public double HorizontalScrollValue
 	{
 		get => (double)GetValue(HorizontalScrollValueProperty);
@@ -65,14 +70,17 @@ public double HorizontalScrollValue
 	}
 
 	#endregion
+
 	#region DependencyProperty: HorizontalMinScroll
 
+	/// Identifies the HorizontalMinScroll dependency property.
 	public static DependencyProperty HorizontalMinScrollProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalMinScroll),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
+	/// Gets or sets the minimum horizontal scroll limit.
 	public double HorizontalMinScroll
 	{
 		get => (double)GetValue(HorizontalMinScrollProperty);
@@ -80,14 +88,17 @@ public double HorizontalMinScroll
 	}
 
 	#endregion
+
 	#region DependencyProperty: HorizontalMaxScroll
 
+	/// Identifies the HorizontalMaxScroll dependency property.
 	public static DependencyProperty HorizontalMaxScrollProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalMaxScroll),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
+	/// Gets or sets the maximum horizontal scroll limit.
 	public double HorizontalMaxScroll
 	{
 		get => (double)GetValue(HorizontalMaxScrollProperty);
@@ -95,14 +106,17 @@ public double HorizontalMaxScroll
 	}
 
 	#endregion
+
 	#region DependencyProperty: HorizontalZoomCenter
 
+	/// Identifies the HorizontalZoomCenter dependency property.
 	public static DependencyProperty HorizontalZoomCenterProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalZoomCenter),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
+	/// Gets or sets the horizontal center point for zooming.
 	public double HorizontalZoomCenter
 	{
 		get => (double)GetValue(HorizontalZoomCenterProperty);
@@ -110,14 +124,17 @@ public double HorizontalZoomCenter
 	}
 
 	#endregion
+
 	#region DependencyProperty: VerticalOffset
 
+	/// Identifies the VerticalOffset dependency property.
 	public static DependencyProperty VerticalOffsetProperty { get; } = DependencyProperty.Register(
 		nameof(VerticalOffset),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double), OnVerticalOffsetChanged));
 
+	/// Gets or sets the vertical offset for panning the content.
 	public double VerticalOffset
 	{
 		get => (double)GetValue(VerticalOffsetProperty);
@@ -125,14 +142,17 @@ public double VerticalOffset
 	}
 
 	#endregion
+
 	#region DependencyProperty: VerticalScrollValue
 
+	/// Identifies the VerticalScrollValue dependency property.
 	public static DependencyProperty VerticalScrollValueProperty { get; } = DependencyProperty.Register(
 		nameof(VerticalScrollValue),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
+	/// Gets or sets the value of the vertical scrollbar.
 	public double VerticalScrollValue
 	{
 		get => (double)GetValue(VerticalScrollValueProperty);
@@ -140,14 +160,17 @@ public double VerticalScrollValue
 	}
 
 	#endregion
+
 	#region DependencyProperty: VerticalMaxScroll
 
+	/// Identifies the VerticalMaxScroll dependency property.
 	public static DependencyProperty VerticalMaxScrollProperty { get; } = DependencyProperty.Register(
 		nameof(VerticalMaxScroll),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
+	/// Gets or sets the maximum vertical scroll limit.
 	public double VerticalMaxScroll
 	{
 		get => (double)GetValue(VerticalMaxScrollProperty);
@@ -155,14 +178,17 @@ public double VerticalMaxScroll
 	}
 
 	#endregion
+
 	#region DependencyProperty: VerticalMinScroll
 
+	/// Identifies the VerticalMinScroll dependency property.
 	public static DependencyProperty VerticalMinScrollProperty { get; } = DependencyProperty.Register(
 		nameof(VerticalMinScroll),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
+	/// Gets or sets the minimum vertical scroll limit.
 	public double VerticalMinScroll
 	{
 		get => (double)GetValue(VerticalMinScrollProperty);
@@ -170,14 +196,17 @@ public double VerticalMinScroll
 	}
 
 	#endregion
+
 	#region DependencyProperty: VerticalZoomCenter
 
+	/// Identifies the VerticalZoomCenter dependency property.
 	public static DependencyProperty VerticalZoomCenterProperty { get; } = DependencyProperty.Register(
 		nameof(VerticalZoomCenter),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
+	/// Gets or sets the vertical center point for zooming.
 	public double VerticalZoomCenter
 	{
 		get => (double)GetValue(VerticalZoomCenterProperty);
@@ -185,44 +214,53 @@ public double VerticalZoomCenter
 	}
 
 	#endregion
-	#region DependencyProperty: ViewPortWidth
 
-	public static DependencyProperty ViewPortWidthProperty { get; } = DependencyProperty.Register(
-		nameof(ViewPortWidth),
+	#region DependencyProperty: ViewportWidth
+
+	/// Identifies the ViewportWidth dependency property.
+	public static DependencyProperty ViewportWidthProperty { get; } = DependencyProperty.Register(
+		nameof(ViewportWidth),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
-	public double ViewPortWidth
+	/// Gets or sets the width of the viewport.
+	public double ViewportWidth
 	{
-		get => (double)GetValue(ViewPortWidthProperty);
-		set => SetValue(ViewPortWidthProperty, value);
+		get => (double)GetValue(ViewportWidthProperty);
+		set => SetValue(ViewportWidthProperty, value);
 	}
 
 	#endregion
-	#region DependencyProperty: ViewPortHeight
 
-	public static DependencyProperty ViewPortHeightProperty { get; } = DependencyProperty.Register(
-		nameof(ViewPortHeight),
+	#region DependencyProperty: ViewportHeight
+
+	/// Identifies the ViewportHeight dependency property.
+	public static DependencyProperty ViewportHeightProperty { get; } = DependencyProperty.Register(
+		nameof(ViewportHeight),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
-	public double ViewPortHeight
+	/// Gets or sets the height of the viewport.
+	public double ViewportHeight
 	{
-		get => (double)GetValue(ViewPortHeightProperty);
-		set => SetValue(ViewPortHeightProperty, value);
+		get => (double)GetValue(ViewportHeightProperty);
+		set => SetValue(ViewportHeightProperty, value);
 	}
 
 	#endregion
+
 	#region DependencyProperty: ZoomLevel
 
+	/// Identifies the ZoomLevel dependency property.
 	public static DependencyProperty ZoomLevelProperty { get; } = DependencyProperty.Register(
 		nameof(ZoomLevel),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(1d, OnZoomLevelChanged));
 
+	/// Gets or sets the current zoom level.
 	public double ZoomLevel
 	{
 		get => (double)GetValue(ZoomLevelProperty);
@@ -230,14 +268,17 @@ public double ZoomLevel
 	}
 
 	#endregion
+
 	#region DependencyProperty: MinZoomLevel
 
+	/// Identifies the MinZoomLevel dependency property.
 	public static DependencyProperty MinZoomLevelProperty { get; } = DependencyProperty.Register(
 		nameof(MinZoomLevel),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double), OnMinZoomLevelChanged));
 
+	/// Gets or sets the minimum zoom level allowed.
 	public double MinZoomLevel
 	{
 		get => (double)GetValue(MinZoomLevelProperty);
@@ -245,14 +286,17 @@ public double MinZoomLevel
 	}
 
 	#endregion
+
 	#region DependencyProperty: MaxZoomLevel
 
+	/// Identifies the MaxZoomLevel dependency property.
 	public static DependencyProperty MaxZoomLevelProperty { get; } = DependencyProperty.Register(
 		nameof(MaxZoomLevel),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(500d, OnMaxZoomLevelChanged));
 
+	/// Gets or sets the maximum zoom level allowed.
 	public double MaxZoomLevel
 	{
 		get => (double)GetValue(MaxZoomLevelProperty);
@@ -260,14 +304,17 @@ public double MaxZoomLevel
 	}
 
 	#endregion
+
 	#region DependencyProperty: PanWheelRatio
 
+	/// Identifies the PanWheelRatio dependency property.
 	public static DependencyProperty PanWheelRatioProperty { get; } = DependencyProperty.Register(
 		nameof(PanWheelRatio),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(0.25d));
 
+	/// Gets or sets the ratio used for panning with the mouse wheel.
 	public double PanWheelRatio
 	{
 		get => (double)GetValue(PanWheelRatioProperty);
@@ -275,14 +322,17 @@ public double PanWheelRatio
 	}
 
 	#endregion
+
 	#region DependencyProperty: ScaleWheelRatio
 
+	/// Identifies the ScaleWheelRatio dependency property.
 	public static DependencyProperty ScaleWheelRatioProperty { get; } = DependencyProperty.Register(
 		nameof(ScaleWheelRatio),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(0.0006d));
 
+	/// Gets or sets the ratio used for scaling the zoom level with the mouse wheel.
 	public double ScaleWheelRatio
 	{
 		get => (double)GetValue(ScaleWheelRatioProperty);
@@ -290,14 +340,17 @@ public double ScaleWheelRatio
 	}
 
 	#endregion
+
 	#region DependencyProperty: IsActive
 
+	/// Identifies the IsActive dependency property.
 	public static DependencyProperty IsActiveProperty { get; } = DependencyProperty.Register(
 		nameof(IsActive),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true, OnIsActiveChanged));
 
+	/// Gets or sets a value indicating whether the control is active.
 	public bool IsActive
 	{
 		get => (bool)GetValue(IsActiveProperty);
@@ -305,14 +358,17 @@ public bool IsActive
 	}
 
 	#endregion
+
 	#region DependencyProperty: IsZoomAllowed
 
+	/// Identifies the IsZoomAllowed dependency property.
 	public static DependencyProperty IsZoomAllowedProperty { get; } = DependencyProperty.Register(
 		nameof(IsZoomAllowed),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true));
 
+	/// Gets or sets a value indicating whether zooming is allowed.
 	public bool IsZoomAllowed
 	{
 		get => (bool)GetValue(IsZoomAllowedProperty);
@@ -320,14 +376,17 @@ public bool IsZoomAllowed
 	}
 
 	#endregion
+
 	#region DependencyProperty: IsHorizontalScrollBarVisible
 
+	/// Identifies the IsHorizontalScrollBarVisible dependency property.
 	public static DependencyProperty IsHorizontalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
 		nameof(IsHorizontalScrollBarVisible),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true));
 
+	/// Gets or sets a value indicating whether the horizontal scrollbar is visible.
 	public bool IsHorizontalScrollBarVisible
 	{
 		get => (bool)GetValue(IsHorizontalScrollBarVisibleProperty);
@@ -335,14 +394,17 @@ public bool IsHorizontalScrollBarVisible
 	}
 
 	#endregion
+
 	#region DependencyProperty: IsPanAllowed
 
+	/// Identifies the IsPanAllowed dependency property.
 	public static DependencyProperty IsPanAllowedProperty { get; } = DependencyProperty.Register(
 		nameof(IsPanAllowed),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true));
 
+	/// Gets or sets a value indicating whether panning is allowed.
 	public bool IsPanAllowed
 	{
 		get => (bool)GetValue(IsPanAllowedProperty);
@@ -350,14 +412,17 @@ public bool IsPanAllowed
 	}
 
 	#endregion
+
 	#region DependencyProperty: IsVerticalScrollBarVisible
 
+	/// Identifies the IsVerticalScrollBarVisible dependency property.
 	public static DependencyProperty IsVerticalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
 		nameof(IsVerticalScrollBarVisible),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true));
 
+	/// Gets or sets a value indicating whether the vertical scrollbar is visible.
 	public bool IsVerticalScrollBarVisible
 	{
 		get => (bool)GetValue(IsVerticalScrollBarVisibleProperty);
@@ -365,14 +430,17 @@ public bool IsVerticalScrollBarVisible
 	}
 
 	#endregion
+
 	#region DependencyProperty: AutoZoomToCanvasOnSizeChanged
 
+	/// Identifies the AutoZoomToCanvasOnSizeChanged dependency property.
 	public static DependencyProperty AutoZoomToCanvasOnSizeChangedProperty { get; } = DependencyProperty.Register(
 		nameof(AutoZoomToCanvasOnSizeChanged),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true));
 
+	/// Gets or sets a value indicating whether the control should automatically zoom to fit the canvas when its size changes.
 	public bool AutoZoomToCanvasOnSizeChanged
 	{
 		get => (bool)GetValue(AutoZoomToCanvasOnSizeChangedProperty);
@@ -380,14 +448,17 @@ public bool AutoZoomToCanvasOnSizeChanged
 	}
 
 	#endregion
+
 	#region DependencyProperty: AdditionalMargin
 
+	/// Identifies the AdditionalMargin dependency property.
 	public static DependencyProperty AdditionalMarginProperty { get; } = DependencyProperty.Register(
 		nameof(AdditionalMargin),
 		typeof(Thickness),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(new Thickness(0)));
 
+	/// Gets or sets additional margins around the content.
 	public Thickness AdditionalMargin
 	{
 		get => (Thickness)GetValue(AdditionalMarginProperty);
@@ -395,14 +466,17 @@ public Thickness AdditionalMargin
 	}
 
 	#endregion
+
 	#region DependencyProperty: ContentBoundsVisibility
 
+	/// Identifies the ContentBoundsVisibility dependency property.
 	public static DependencyProperty ContentBoundsVisibilityProperty { get; } = DependencyProperty.Register(
 		nameof(ContentBoundsVisibility),
 		typeof(BoundsVisibilityFlag),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(BoundsVisibilityFlag.None));
 
+	/// Gets or sets the visibility data for the content bounds.
 	public BoundsVisibilityFlag ContentBoundsVisibility
 	{
 		get => (BoundsVisibilityFlag)GetValue(ContentBoundsVisibilityProperty);
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index fd14ccd8e..ca1bc4469 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -72,8 +72,8 @@ public ZoomContentControl()
 	// Events
 	public event EventHandler<EventArgs>? RenderedContentUpdated;
 
-	// Dependency Properties
-	public bool ResetWhenNotActive { get; set; } = true;
+	// Properties
+	private bool ResetZoomAndOffsetWhenInactive { get; set; } = true;
 
 	public Size AvailableSize
 	{
@@ -122,10 +122,10 @@ private void UpdateContentBoundsVisibility()
 			var m = GetPositionMatrix(fe, this);
 
 			var flags = None;
-			if (m.OffsetX >= 0) flags |= Left;
-			if (m.OffsetY >= 0) flags |= Top;
-			if (ActualWidth >= (fe.ActualWidth * ZoomLevel) + m.OffsetX) flags |= Right;
-			if (ActualHeight >= (fe.ActualHeight * ZoomLevel) + m.OffsetY) flags |= Bottom;
+			if (m.OffsetX >= 0) flags |= BoundsVisibilityFlag.Left;
+			if (m.OffsetY >= 0) flags |= BoundsVisibilityFlag.Top;
+			if (ActualWidth >= (fe.ActualWidth * ZoomLevel) + m.OffsetX) flags |= BoundsVisibilityFlag.Right;
+			if (ActualHeight >= (fe.ActualHeight * ZoomLevel) + m.OffsetY) flags |= BoundsVisibilityFlag.Bottom;
 
 			ContentBoundsVisibility = flags;
 		}
@@ -133,8 +133,8 @@ private void UpdateContentBoundsVisibility()
 
 	private void UpdateScrollVisibility()
 	{
-		IsHorizontalScrollBarVisible = !ContentBoundsVisibility.HasFlag(Left | Right);
-		IsVerticalScrollBarVisible = !ContentBoundsVisibility.HasFlag(Top | Bottom);
+		IsHorizontalScrollBarVisible = !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Left | BoundsVisibilityFlag.Right);
+		IsVerticalScrollBarVisible = !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Top | BoundsVisibilityFlag.Bottom);
 	}
 
 	private bool CanMoveIn((bool Horizontal, bool Vertical) _movementDirection)
@@ -153,10 +153,10 @@ private bool CanMoveIn((bool Horizontal, bool Vertical) _movementDirection)
 		return canMove;
 	}
 
-	private bool CanScrollUp() => !ContentBoundsVisibility.HasFlag(Top);
-	private bool CanScrollDown() => !ContentBoundsVisibility.HasFlag(Bottom);
-	private bool CanScrollLeft() => !ContentBoundsVisibility.HasFlag(Left);
-	private bool CanScrollRight() => !ContentBoundsVisibility.HasFlag(Right);
+	private bool CanScrollUp() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Top);
+	private bool CanScrollDown() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Bottom);
+	private bool CanScrollLeft() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Left);
+	private bool CanScrollRight() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Right);
 
 	private async void UpdateVerticalScrollBarValue()
 	{
@@ -172,7 +172,7 @@ private async void UpdateHorizontalScrollBarValue()
 
 	private void IsActiveChanged()
 	{
-		if (ResetWhenNotActive && !IsActive)
+		if (ResetZoomAndOffsetWhenInactive && !IsActive)
 		{
 			RemoveOffset();
 			ResetZoom();
@@ -191,8 +191,8 @@ private void UpdateScrollLimits()
 	{
 		if (_presenter?.Content is FrameworkElement fe)
 		{
-			var verticalScroll = Math.Max(0, (fe.ActualHeight * ZoomLevel) - ViewPortHeight);
-			var horizontalScroll = Math.Max(0, (fe.ActualWidth * ZoomLevel) - ViewPortWidth);
+			var verticalScroll = Math.Max(0, (fe.ActualHeight * ZoomLevel) - ViewportHeight);
+			var horizontalScroll = Math.Max(0, (fe.ActualWidth * ZoomLevel) - ViewportWidth);
 
 			HorizontalMaxScroll = horizontalScroll / 2;
 			VerticalMaxScroll = verticalScroll / 2;
@@ -246,8 +246,8 @@ private void RegisterToControlEvents()
 		{
 			fe.LayoutUpdated += (s, e) =>
 			{
-				ViewPortWidth = fe.ActualWidth;
-				ViewPortHeight = fe.ActualHeight;
+				ViewportWidth = fe.ActualWidth;
+				ViewportHeight = fe.ActualHeight;
 
 				UpdateScrollLimits();
 			};
@@ -428,25 +428,19 @@ private void TryUpdateOffsets(double deltaX, double deltaY)
 	// Public methods
 	public void Initialize()
 	{
-		if (_presenter?.Content is FrameworkElement { } fe)
-		{
-			fe.UpdateLayout();
-		}
-
 		ResetZoom();
 		ResetOffset();
 		CenterContent();
 	}
 
-	public void ResetZoom() => ZoomLevel = 1;
-
-	public void ResetOffset()
+	internal void ResetZoom() => ZoomLevel = 1;
+	private void ResetOffset()
 	{
 		HorizontalOffset = AdditionalMargin.Left;
 		VerticalOffset = AdditionalMargin.Top;
 	}
 
-	public void RemoveOffset()
+	private void RemoveOffset()
 	{
 		HorizontalOffset = 0;
 		VerticalOffset = 0;
@@ -465,8 +459,8 @@ public void FitToCanvas()
 	{
 		if (IsActive)
 		{
-			var vZoom = (ActualHeight - AdditionalMargin.Top - AdditionalMargin.Bottom) / ViewPortHeight;
-			var hZoom = (ActualWidth - AdditionalMargin.Left - AdditionalMargin.Right) / ViewPortWidth;
+			var vZoom = (ActualHeight - AdditionalMargin.Top - AdditionalMargin.Bottom) / ViewportHeight;
+			var hZoom = (ActualWidth - AdditionalMargin.Left - AdditionalMargin.Right) / ViewportWidth;
 			var zoomLevel = Math.Min(vZoom, hZoom);
 			ZoomLevel = Math.Clamp(zoomLevel, MinZoomLevel, MaxZoomLevel);
 			CenterContent();
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
index 440cae3c1..ecb1bad7e 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
@@ -57,7 +57,7 @@
 								   Orientation="Vertical"
 								   SmallChange="1"
 								   Visibility="{TemplateBinding IsVerticalScrollBarVisible}"
-								   ViewportSize="{TemplateBinding ViewPortHeight}"
+								   ViewportSize="{TemplateBinding ViewportHeight}"
 								   Value="{TemplateBinding VerticalScrollValue}" />
 						<!-- Horizontal ScrollBar -->
 						<ScrollBar x:Name="PART_ScrollH"
@@ -72,7 +72,7 @@
 								   Orientation="Horizontal"
 								   SmallChange="1"
 								   Visibility="{TemplateBinding IsHorizontalScrollBarVisible}"
-								   ViewportSize="{TemplateBinding ViewPortWidth}"
+								   ViewportSize="{TemplateBinding ViewportWidth}"
 								   Value="{TemplateBinding HorizontalScrollValue}" />
 					</Grid>
 				</ControlTemplate>

From 94a3a0aa78ce28f51e803759059fda3b2aa8296f Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Thu, 10 Oct 2024 14:09:05 -0400
Subject: [PATCH 18/30] chore: xml comments for HorizontalScrollValue

---
 .../Controls/ZoomContentControl/ZoomContentControl.Properties.cs | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
index 270b8e06b..2385d3740 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
@@ -63,6 +63,7 @@ public double HorizontalOffset
 		new PropertyMetadata(default(double)));
 
 	/// Gets or sets the value of the horizontal scrollbar.
+	/// It's used to represent the scroll position within the scroll bar UI
 	public double HorizontalScrollValue
 	{
 		get => (double)GetValue(HorizontalScrollValueProperty);

From fc2af3b4b9431131c9bf3c64089e32de558e0613 Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Sun, 13 Oct 2024 19:44:46 -0400
Subject: [PATCH 19/30] chore: removed VerticalScrollValue

---
 .../ZoomContentControl.Properties.cs           | 18 ------------------
 .../ZoomContentControl/ZoomContentControl.cs   | 10 ++--------
 2 files changed, 2 insertions(+), 26 deletions(-)

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
index 2385d3740..830e5be49 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
@@ -144,24 +144,6 @@ public double VerticalOffset
 
 	#endregion
 
-	#region DependencyProperty: VerticalScrollValue
-
-	/// Identifies the VerticalScrollValue dependency property.
-	public static DependencyProperty VerticalScrollValueProperty { get; } = DependencyProperty.Register(
-		nameof(VerticalScrollValue),
-		typeof(double),
-		typeof(ZoomContentControl),
-		new PropertyMetadata(default(double)));
-
-	/// Gets or sets the value of the vertical scrollbar.
-	public double VerticalScrollValue
-	{
-		get => (double)GetValue(VerticalScrollValueProperty);
-		set => SetValue(VerticalScrollValueProperty, value);
-	}
-
-	#endregion
-
 	#region DependencyProperty: VerticalMaxScroll
 
 	/// Identifies the VerticalMaxScroll dependency property.
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index ca1bc4469..3857e44ad 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -92,11 +92,11 @@ private async Task RaiseRenderedContentUpdated()
 		RenderedContentUpdated?.Invoke(this, EventArgs.Empty);
 	}
 
-	private void OnVerticalOffsetChanged()
+	private async void OnVerticalOffsetChanged()
 	{
 		UpdateContentBoundsVisibility();
 		UpdateScrollVisibility();
-		UpdateVerticalScrollBarValue();
+		await RaiseRenderedContentUpdated();
 	}
 
 	private void OnHorizontalOffsetChanged()
@@ -158,12 +158,6 @@ private bool CanMoveIn((bool Horizontal, bool Vertical) _movementDirection)
 	private bool CanScrollLeft() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Left);
 	private bool CanScrollRight() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Right);
 
-	private async void UpdateVerticalScrollBarValue()
-	{
-		VerticalScrollValue = VerticalOffset;
-		await RaiseRenderedContentUpdated();
-	}
-
 	private async void UpdateHorizontalScrollBarValue()
 	{
 		HorizontalScrollValue = -1 * HorizontalOffset;

From 073320d92b7062786615f965bd2a7671bd1982fd Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Mon, 14 Oct 2024 15:48:17 -0400
Subject: [PATCH 20/30] fix: VerticalScrollValue and tests

---
 .../Tests/ZoomContentControlTest.cs           | 60 +++++++++++++++++--
 .../ZoomContentControl.xaml                   |  2 +-
 2 files changed, 56 insertions(+), 6 deletions(-)

diff --git a/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs b/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs
index df77f434f..1128a7818 100644
--- a/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs
+++ b/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs
@@ -83,7 +83,7 @@ public async Task When_ZoomOut_ShouldDecreaseZoomLevel()
 
 			SUT.ZoomLevel -= 0.5;
 			SUT.ZoomLevel.Should().Be(2.5);
-			
+
 			// should be coerce back to MinZoomLevel of 1
 			SUT.ZoomLevel = 0.5;
 			SUT.ZoomLevel.Should().Be(1.0);
@@ -139,8 +139,59 @@ public async Task When_ContentBounds_ShouldHideScrollBars()
 			SUT.IsVerticalScrollBarVisible.Should().BeTrue();
 		}
 
-		// FindFirstDescendent is not available in UWP
-#if !IS_UWP
+		[TestMethod]
+		public async Task When_VerticalOffset_ShouldUpdateCorrectly()
+		{
+			var SUT = new ZoomContentControl()
+			{
+				Width = 400,
+				Height = 300,
+				VerticalOffset = 50,
+				IsPanAllowed = true,
+			};
+
+			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
+
+			// Set vertical offset
+			SUT.VerticalOffset = 100;
+			SUT.VerticalOffset.Should().Be(100);
+
+			// Verify the content is scrolled correctly
+			var presenter = SUT.FindFirstDescendant<ContentPresenter>("PART_Presenter");
+			var translation = (presenter?.RenderTransform as TransformGroup)?.Children[1] as TranslateTransform
+				?? throw new Exception("Failed to find PART_Presenter's TranslateTransform");
+
+			translation.Y.Should().Be(100); // Verify that the content's Y translation is in sync with the vertical offset
+		}
+
+		[TestMethod]
+		public async Task When_VerticalOffset_ExceedsLimits_ShouldShowScrollBars()
+		{
+			var SUT = new ZoomContentControl()
+			{
+				Width = 400,
+				Height = 300,
+				VerticalOffset = 0,
+				IsPanAllowed = true,
+				IsVerticalScrollBarVisible = true,
+				Content = new Border
+				{
+					Width = 400 - 20, // Smaller content width
+					Height = 500, // Larger content height
+					Background = new SolidColorBrush(Colors.Blue),
+				}
+			};
+
+			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
+
+			// Simulate setting a large VerticalOffset
+			SUT.VerticalOffset = 200;
+			SUT.VerticalOffset.Should().Be(200);
+
+			// Ensure scrollbar is shown when the content exceeds the bounds
+			SUT.IsVerticalScrollBarVisible.Should().BeTrue();
+		}
+
 		[TestMethod]
 		public async Task When_Pan_ShouldUpdateOffsets()
 		{
@@ -156,7 +207,7 @@ public async Task When_Pan_ShouldUpdateOffsets()
  
 			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
  
-			var presenter = SUT.FindFirstDescendant<ContentPresenter>("PART_Presenter");
+			var presenter = SUT.GetFirstDescendant<ContentPresenter>(x => x.Name == "PART_Presenter");
 			var translation = (presenter?.RenderTransform as TransformGroup)?.Children[1] as TranslateTransform
 				?? throw new Exception("Failed to find PART_Presenter's TranslateTransform");
  
@@ -168,6 +219,5 @@ public async Task When_Pan_ShouldUpdateOffsets()
 			translation.X.Should().Be(50);
 			translation.Y.Should().Be(50);
 		}
-#endif
 	}
 }
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
index ecb1bad7e..9280a281b 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
@@ -58,7 +58,7 @@
 								   SmallChange="1"
 								   Visibility="{TemplateBinding IsVerticalScrollBarVisible}"
 								   ViewportSize="{TemplateBinding ViewportHeight}"
-								   Value="{TemplateBinding VerticalScrollValue}" />
+								   Value="{TemplateBinding VerticalOffset}" />
 						<!-- Horizontal ScrollBar -->
 						<ScrollBar x:Name="PART_ScrollH"
 								   Grid.Row="1"

From dce93dad57938ca8946b4d0c086e253cfa57539d Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Mon, 14 Oct 2024 16:19:54 -0400
Subject: [PATCH 21/30] chore: resolving comments

---
 doc/controls/ZoomContentControl.md            |  2 -
 .../ZoomContentControl.Properties.cs          | 97 +++++++++----------
 .../ZoomContentControl/ZoomContentControl.cs  | 18 +---
 3 files changed, 52 insertions(+), 65 deletions(-)

diff --git a/doc/controls/ZoomContentControl.md b/doc/controls/ZoomContentControl.md
index 3ca2e89ba..b7eec9a20 100644
--- a/doc/controls/ZoomContentControl.md
+++ b/doc/controls/ZoomContentControl.md
@@ -68,7 +68,5 @@ xmlns:utu="using:Uno.Toolkit.UI"
 
 | Method| Return Type| Description|
 |-----------------------|------------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| `ResetZoom()`| `void`| Resets the zoom level to its default value.|
-| `ResetOffset()`| `void`| Resets the horizontal and vertical offset to its default value. |
 | `FitToCanvas()`| `void`| Adjust the zoom level so that the content fits within the available space.|
 | `CenterContent()`| `void`| Centers the content within the available space.|
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
index 830e5be49..96c0b215d 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
@@ -37,14 +37,14 @@ public partial class ZoomContentControl
 {
 	#region DependencyProperty: HorizontalOffset
 
-	/// Identifies the HorizontalOffset dependency property.
+	/// <summary>Identifies the HorizontalOffset dependency property.</summary>
 	public static DependencyProperty HorizontalOffsetProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalOffset),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double), OnHorizontalOffsetChanged));
 
-	/// Gets or sets the horizontal offset for panning the content.
+	/// <summary>Gets or sets the horizontal offset for panning the content.</summary>
 	public double HorizontalOffset
 	{
 		get => (double)GetValue(HorizontalOffsetProperty);
@@ -55,15 +55,14 @@ public double HorizontalOffset
 
 	#region DependencyProperty: HorizontalScrollValue
 
-	/// Identifies the HorizontalScrollValue dependency property.
+	/// <summary>Identifies the HorizontalScrollValue dependency property.</summary>
 	public static DependencyProperty HorizontalScrollValueProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalScrollValue),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
-	/// Gets or sets the value of the horizontal scrollbar.
-	/// It's used to represent the scroll position within the scroll bar UI
+	/// <summary>Gets or sets the value of the horizontal scrollbar. It's used to represent the scroll position within the scroll bar UI.</summary>
 	public double HorizontalScrollValue
 	{
 		get => (double)GetValue(HorizontalScrollValueProperty);
@@ -74,14 +73,14 @@ public double HorizontalScrollValue
 
 	#region DependencyProperty: HorizontalMinScroll
 
-	/// Identifies the HorizontalMinScroll dependency property.
+	/// <summary>Identifies the HorizontalMinScroll dependency property.</summary>
 	public static DependencyProperty HorizontalMinScrollProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalMinScroll),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
-	/// Gets or sets the minimum horizontal scroll limit.
+	/// <summary>Gets or sets the minimum horizontal scroll limit.</summary>
 	public double HorizontalMinScroll
 	{
 		get => (double)GetValue(HorizontalMinScrollProperty);
@@ -92,14 +91,14 @@ public double HorizontalMinScroll
 
 	#region DependencyProperty: HorizontalMaxScroll
 
-	/// Identifies the HorizontalMaxScroll dependency property.
+	/// <summary>Identifies the HorizontalMaxScroll dependency property.</summary>
 	public static DependencyProperty HorizontalMaxScrollProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalMaxScroll),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
-	/// Gets or sets the maximum horizontal scroll limit.
+	/// <summary>Gets or sets the maximum horizontal scroll limit.</summary>
 	public double HorizontalMaxScroll
 	{
 		get => (double)GetValue(HorizontalMaxScrollProperty);
@@ -110,14 +109,14 @@ public double HorizontalMaxScroll
 
 	#region DependencyProperty: HorizontalZoomCenter
 
-	/// Identifies the HorizontalZoomCenter dependency property.
+	/// <summary>Identifies the HorizontalZoomCenter dependency property.</summary>
 	public static DependencyProperty HorizontalZoomCenterProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalZoomCenter),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
-	/// Gets or sets the horizontal center point for zooming.
+	/// <summary>Gets or sets the horizontal center point for zooming.</summary>
 	public double HorizontalZoomCenter
 	{
 		get => (double)GetValue(HorizontalZoomCenterProperty);
@@ -128,14 +127,14 @@ public double HorizontalZoomCenter
 
 	#region DependencyProperty: VerticalOffset
 
-	/// Identifies the VerticalOffset dependency property.
+	/// <summary>Identifies the VerticalOffset dependency property.</summary>
 	public static DependencyProperty VerticalOffsetProperty { get; } = DependencyProperty.Register(
 		nameof(VerticalOffset),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double), OnVerticalOffsetChanged));
 
-	/// Gets or sets the vertical offset for panning the content.
+	/// <summary>Gets or sets the vertical offset for panning the content.</summary>
 	public double VerticalOffset
 	{
 		get => (double)GetValue(VerticalOffsetProperty);
@@ -146,14 +145,14 @@ public double VerticalOffset
 
 	#region DependencyProperty: VerticalMaxScroll
 
-	/// Identifies the VerticalMaxScroll dependency property.
+	/// <summary>Identifies the VerticalMaxScroll dependency property.</summary>
 	public static DependencyProperty VerticalMaxScrollProperty { get; } = DependencyProperty.Register(
 		nameof(VerticalMaxScroll),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
-	/// Gets or sets the maximum vertical scroll limit.
+	/// <summary>Gets or sets the maximum vertical scroll limit.</summary>
 	public double VerticalMaxScroll
 	{
 		get => (double)GetValue(VerticalMaxScrollProperty);
@@ -164,14 +163,14 @@ public double VerticalMaxScroll
 
 	#region DependencyProperty: VerticalMinScroll
 
-	/// Identifies the VerticalMinScroll dependency property.
+	/// <summary>Identifies the VerticalMinScroll dependency property.</summary>
 	public static DependencyProperty VerticalMinScrollProperty { get; } = DependencyProperty.Register(
 		nameof(VerticalMinScroll),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
-	/// Gets or sets the minimum vertical scroll limit.
+	/// <summary>Gets or sets the minimum vertical scroll limit.</summary>
 	public double VerticalMinScroll
 	{
 		get => (double)GetValue(VerticalMinScrollProperty);
@@ -182,14 +181,14 @@ public double VerticalMinScroll
 
 	#region DependencyProperty: VerticalZoomCenter
 
-	/// Identifies the VerticalZoomCenter dependency property.
+	/// <summary>Identifies the VerticalZoomCenter dependency property.</summary>
 	public static DependencyProperty VerticalZoomCenterProperty { get; } = DependencyProperty.Register(
 		nameof(VerticalZoomCenter),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
-	/// Gets or sets the vertical center point for zooming.
+	/// <summary>Gets or sets the vertical center point for zooming.</summary>
 	public double VerticalZoomCenter
 	{
 		get => (double)GetValue(VerticalZoomCenterProperty);
@@ -200,14 +199,14 @@ public double VerticalZoomCenter
 
 	#region DependencyProperty: ViewportWidth
 
-	/// Identifies the ViewportWidth dependency property.
+	/// <summary>Identifies the ViewportWidth dependency property.</summary>
 	public static DependencyProperty ViewportWidthProperty { get; } = DependencyProperty.Register(
 		nameof(ViewportWidth),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
-	/// Gets or sets the width of the viewport.
+	/// <summary>Gets or sets the width of the viewport.</summary>
 	public double ViewportWidth
 	{
 		get => (double)GetValue(ViewportWidthProperty);
@@ -218,14 +217,14 @@ public double ViewportWidth
 
 	#region DependencyProperty: ViewportHeight
 
-	/// Identifies the ViewportHeight dependency property.
+	/// <summary>Identifies the ViewportHeight dependency property.</summary>
 	public static DependencyProperty ViewportHeightProperty { get; } = DependencyProperty.Register(
 		nameof(ViewportHeight),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
-	/// Gets or sets the height of the viewport.
+	/// <summary>Gets or sets the height of the viewport.</summary>
 	public double ViewportHeight
 	{
 		get => (double)GetValue(ViewportHeightProperty);
@@ -236,14 +235,14 @@ public double ViewportHeight
 
 	#region DependencyProperty: ZoomLevel
 
-	/// Identifies the ZoomLevel dependency property.
+	/// <summary>Identifies the ZoomLevel dependency property.</summary>
 	public static DependencyProperty ZoomLevelProperty { get; } = DependencyProperty.Register(
 		nameof(ZoomLevel),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(1d, OnZoomLevelChanged));
 
-	/// Gets or sets the current zoom level.
+	/// <summary>Gets or sets the current zoom level.</summary>
 	public double ZoomLevel
 	{
 		get => (double)GetValue(ZoomLevelProperty);
@@ -254,14 +253,14 @@ public double ZoomLevel
 
 	#region DependencyProperty: MinZoomLevel
 
-	/// Identifies the MinZoomLevel dependency property.
+	/// <summary>Identifies the MinZoomLevel dependency property.</summary>
 	public static DependencyProperty MinZoomLevelProperty { get; } = DependencyProperty.Register(
 		nameof(MinZoomLevel),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double), OnMinZoomLevelChanged));
 
-	/// Gets or sets the minimum zoom level allowed.
+	/// <summary>Gets or sets the minimum zoom level allowed.</summary>
 	public double MinZoomLevel
 	{
 		get => (double)GetValue(MinZoomLevelProperty);
@@ -272,14 +271,14 @@ public double MinZoomLevel
 
 	#region DependencyProperty: MaxZoomLevel
 
-	/// Identifies the MaxZoomLevel dependency property.
+	/// <summary>Identifies the MaxZoomLevel dependency property.</summary>
 	public static DependencyProperty MaxZoomLevelProperty { get; } = DependencyProperty.Register(
 		nameof(MaxZoomLevel),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(500d, OnMaxZoomLevelChanged));
 
-	/// Gets or sets the maximum zoom level allowed.
+	/// <summary>Gets or sets the maximum zoom level allowed.</summary>
 	public double MaxZoomLevel
 	{
 		get => (double)GetValue(MaxZoomLevelProperty);
@@ -290,14 +289,14 @@ public double MaxZoomLevel
 
 	#region DependencyProperty: PanWheelRatio
 
-	/// Identifies the PanWheelRatio dependency property.
+	/// <summary>Identifies the PanWheelRatio dependency property.</summary>
 	public static DependencyProperty PanWheelRatioProperty { get; } = DependencyProperty.Register(
 		nameof(PanWheelRatio),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(0.25d));
 
-	/// Gets or sets the ratio used for panning with the mouse wheel.
+	/// <summary>Gets or sets the ratio used for panning with the mouse wheel.</summary>
 	public double PanWheelRatio
 	{
 		get => (double)GetValue(PanWheelRatioProperty);
@@ -308,14 +307,14 @@ public double PanWheelRatio
 
 	#region DependencyProperty: ScaleWheelRatio
 
-	/// Identifies the ScaleWheelRatio dependency property.
+	/// <summary>Identifies the ScaleWheelRatio dependency property.</summary>
 	public static DependencyProperty ScaleWheelRatioProperty { get; } = DependencyProperty.Register(
 		nameof(ScaleWheelRatio),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(0.0006d));
 
-	/// Gets or sets the ratio used for scaling the zoom level with the mouse wheel.
+	/// <summary>Gets or sets the ratio used for scaling the zoom level with the mouse wheel.</summary>
 	public double ScaleWheelRatio
 	{
 		get => (double)GetValue(ScaleWheelRatioProperty);
@@ -326,14 +325,14 @@ public double ScaleWheelRatio
 
 	#region DependencyProperty: IsActive
 
-	/// Identifies the IsActive dependency property.
+	/// <summary>Identifies the IsActive dependency property.</summary>
 	public static DependencyProperty IsActiveProperty { get; } = DependencyProperty.Register(
 		nameof(IsActive),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true, OnIsActiveChanged));
 
-	/// Gets or sets a value indicating whether the control is active.
+	/// <summary>Gets or sets a value indicating whether the control is active.</summary>
 	public bool IsActive
 	{
 		get => (bool)GetValue(IsActiveProperty);
@@ -344,14 +343,14 @@ public bool IsActive
 
 	#region DependencyProperty: IsZoomAllowed
 
-	/// Identifies the IsZoomAllowed dependency property.
+	/// <summary>Identifies the IsZoomAllowed dependency property.</summary>
 	public static DependencyProperty IsZoomAllowedProperty { get; } = DependencyProperty.Register(
 		nameof(IsZoomAllowed),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true));
 
-	/// Gets or sets a value indicating whether zooming is allowed.
+	/// <summary>Gets or sets a value indicating whether zooming is allowed.</summary>
 	public bool IsZoomAllowed
 	{
 		get => (bool)GetValue(IsZoomAllowedProperty);
@@ -362,14 +361,14 @@ public bool IsZoomAllowed
 
 	#region DependencyProperty: IsHorizontalScrollBarVisible
 
-	/// Identifies the IsHorizontalScrollBarVisible dependency property.
+	/// <summary>Identifies the IsHorizontalScrollBarVisible dependency property.</summary>
 	public static DependencyProperty IsHorizontalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
 		nameof(IsHorizontalScrollBarVisible),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true));
 
-	/// Gets or sets a value indicating whether the horizontal scrollbar is visible.
+	/// <summary>Gets or sets a value indicating whether the horizontal scrollbar is visible.</summary>
 	public bool IsHorizontalScrollBarVisible
 	{
 		get => (bool)GetValue(IsHorizontalScrollBarVisibleProperty);
@@ -380,14 +379,14 @@ public bool IsHorizontalScrollBarVisible
 
 	#region DependencyProperty: IsPanAllowed
 
-	/// Identifies the IsPanAllowed dependency property.
+	/// <summary>Identifies the IsPanAllowed dependency property.</summary>
 	public static DependencyProperty IsPanAllowedProperty { get; } = DependencyProperty.Register(
 		nameof(IsPanAllowed),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true));
 
-	/// Gets or sets a value indicating whether panning is allowed.
+	/// <summary>Gets or sets a value indicating whether panning is allowed.</summary>
 	public bool IsPanAllowed
 	{
 		get => (bool)GetValue(IsPanAllowedProperty);
@@ -398,14 +397,14 @@ public bool IsPanAllowed
 
 	#region DependencyProperty: IsVerticalScrollBarVisible
 
-	/// Identifies the IsVerticalScrollBarVisible dependency property.
+	/// <summary>Identifies the IsVerticalScrollBarVisible dependency property.</summary>
 	public static DependencyProperty IsVerticalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
 		nameof(IsVerticalScrollBarVisible),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true));
 
-	/// Gets or sets a value indicating whether the vertical scrollbar is visible.
+	/// <summary>Gets or sets a value indicating whether the vertical scrollbar is visible.</summary>
 	public bool IsVerticalScrollBarVisible
 	{
 		get => (bool)GetValue(IsVerticalScrollBarVisibleProperty);
@@ -416,14 +415,14 @@ public bool IsVerticalScrollBarVisible
 
 	#region DependencyProperty: AutoZoomToCanvasOnSizeChanged
 
-	/// Identifies the AutoZoomToCanvasOnSizeChanged dependency property.
+	/// <summary>Identifies the AutoZoomToCanvasOnSizeChanged dependency property.</summary>
 	public static DependencyProperty AutoZoomToCanvasOnSizeChangedProperty { get; } = DependencyProperty.Register(
 		nameof(AutoZoomToCanvasOnSizeChanged),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true));
 
-	/// Gets or sets a value indicating whether the control should automatically zoom to fit the canvas when its size changes.
+	/// <summary>Gets or sets a value indicating whether the control should automatically zoom to fit the canvas when its size changes.</summary>
 	public bool AutoZoomToCanvasOnSizeChanged
 	{
 		get => (bool)GetValue(AutoZoomToCanvasOnSizeChangedProperty);
@@ -434,14 +433,14 @@ public bool AutoZoomToCanvasOnSizeChanged
 
 	#region DependencyProperty: AdditionalMargin
 
-	/// Identifies the AdditionalMargin dependency property.
+	/// <summary>Identifies the AdditionalMargin dependency property.</summary>
 	public static DependencyProperty AdditionalMarginProperty { get; } = DependencyProperty.Register(
 		nameof(AdditionalMargin),
 		typeof(Thickness),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(new Thickness(0)));
 
-	/// Gets or sets additional margins around the content.
+	/// <summary>Gets or sets additional margins around the content.</summary>
 	public Thickness AdditionalMargin
 	{
 		get => (Thickness)GetValue(AdditionalMarginProperty);
@@ -452,14 +451,14 @@ public Thickness AdditionalMargin
 
 	#region DependencyProperty: ContentBoundsVisibility
 
-	/// Identifies the ContentBoundsVisibility dependency property.
+	/// <summary>Identifies the ContentBoundsVisibility dependency property.</summary>
 	public static DependencyProperty ContentBoundsVisibilityProperty { get; } = DependencyProperty.Register(
 		nameof(ContentBoundsVisibility),
 		typeof(BoundsVisibilityFlag),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(BoundsVisibilityFlag.None));
 
-	/// Gets or sets the visibility data for the content bounds.
+	/// <summary>Gets or sets the visibility data for the content bounds.</summary>
 	public BoundsVisibilityFlag ContentBoundsVisibility
 	{
 		get => (BoundsVisibilityFlag)GetValue(ContentBoundsVisibilityProperty);
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index 3857e44ad..a74da89c9 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -67,6 +67,10 @@ public ZoomContentControl()
 		DefaultStyleKey = typeof(ZoomContentControl);
 		Loaded += OnLoaded;
 		SizeChanged += OnSizeChanged;
+		PointerPressed += OnPointerPressed;
+		PointerReleased += OnPointerReleased;
+		PointerMoved += OnPointerMoved;
+		PointerWheelChanged += OnPointerWheelChanged;
 	}
 
 	// Events
@@ -216,7 +220,6 @@ T FindTemplatePart<T>(string name) where T : class =>
 		ResetZoom();
 
 		RegisterToControlEvents();
-		RegisterPointerHandlers();
 	}
 
 	// Event handlers
@@ -258,19 +261,6 @@ private void RegisterToControlEvents()
 		}
 	}
 
-	private void RegisterPointerHandlers()
-	{
-		PointerPressed -= OnPointerPressed;
-		PointerReleased -= OnPointerReleased;
-		PointerMoved -= OnPointerMoved;
-		PointerWheelChanged -= OnPointerWheelChanged;
-
-		PointerPressed += OnPointerPressed;
-		PointerReleased += OnPointerReleased;
-		PointerMoved += OnPointerMoved;
-		PointerWheelChanged += OnPointerWheelChanged;
-	}
-
 	private void ScrollV_Scroll(object sender, ScrollEventArgs e)
 	{
 		if ((_previousVerticalScrollValue > e.NewValue && !CanScrollUp()) ||

From ce59cfbdf20a3044cb7e94f20a878ab56ab4ae7d Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Tue, 15 Oct 2024 16:35:11 -0400
Subject: [PATCH 22/30] chore: resolving comments

---
 .../ZoomContentControl/ZoomContentControl.Properties.cs     | 2 +-
 .../Controls/ZoomContentControl/ZoomContentControl.cs       | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
index 96c0b215d..1572a0e3f 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
@@ -462,7 +462,7 @@ public Thickness AdditionalMargin
 	public BoundsVisibilityFlag ContentBoundsVisibility
 	{
 		get => (BoundsVisibilityFlag)GetValue(ContentBoundsVisibilityProperty);
-		set => SetValue(ContentBoundsVisibilityProperty, value);
+		private set => SetValue(ContentBoundsVisibilityProperty, value);
 	}
 
 	#endregion
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index a74da89c9..58a3a4c5b 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -77,8 +77,6 @@ public ZoomContentControl()
 	public event EventHandler<EventArgs>? RenderedContentUpdated;
 
 	// Properties
-	private bool ResetZoomAndOffsetWhenInactive { get; set; } = true;
-
 	public Size AvailableSize
 	{
 		get
@@ -170,7 +168,7 @@ private async void UpdateHorizontalScrollBarValue()
 
 	private void IsActiveChanged()
 	{
-		if (ResetZoomAndOffsetWhenInactive && !IsActive)
+		if (!IsActive)
 		{
 			RemoveOffset();
 			ResetZoom();
@@ -208,6 +206,8 @@ private void CoerceZoomLevel()
 	// Template handling
 	protected override void OnApplyTemplate()
 	{
+		base.OnApplyTemplate();
+
 		T FindTemplatePart<T>(string name) where T : class =>
 			(GetTemplateChild(name) ?? throw new Exception($"Expected template part not found: {name}"))
 			as T ?? throw new Exception($"Expected template part '{name}' to be of type: {typeof(T)}");

From 0be5c7abff143cb8291721cf19d7e6bcdfbf80f1 Mon Sep 17 00:00:00 2001
From: xiaoy312 <xiaoyao312@gmail.com>
Date: Thu, 17 Oct 2024 16:56:32 -0400
Subject: [PATCH 23/30] chore: set default MaxZoomLevel to 10

---
 .../ZoomContentControl/ZoomContentControl.Properties.cs         | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
index 1572a0e3f..59d7f6f51 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
@@ -276,7 +276,7 @@ public double MinZoomLevel
 		nameof(MaxZoomLevel),
 		typeof(double),
 		typeof(ZoomContentControl),
-		new PropertyMetadata(500d, OnMaxZoomLevelChanged));
+		new PropertyMetadata(10d, OnMaxZoomLevelChanged));
 
 	/// <summary>Gets or sets the maximum zoom level allowed.</summary>
 	public double MaxZoomLevel

From f8e4153b01e9aeb681e7a4f6b8a91a74f5919d78 Mon Sep 17 00:00:00 2001
From: xiaoy312 <xiaoyao312@gmail.com>
Date: Thu, 17 Oct 2024 17:05:07 -0400
Subject: [PATCH 24/30] chore: minor refactor

---
 .../ZoomContentControlSamplePage.xaml.cs      |   2 +-
 .../ZoomContentControl.Properties.cs          |  88 ++++++-------
 .../ZoomContentControl/ZoomContentControl.cs  | 118 ++++++++----------
 3 files changed, 90 insertions(+), 118 deletions(-)

diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
index f1f3f494f..5b66d1313 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml.cs
@@ -72,6 +72,6 @@ private void OnZoomOutClick(object sender, RoutedEventArgs e)
 
 	private void OnResetClick(object sender, RoutedEventArgs e)
 	{
-		zoomControl.Initialize();
+		zoomControl.ResetViewport();
 	}
 }
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
index 59d7f6f51..f6eb8862a 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
@@ -52,7 +52,6 @@ public double HorizontalOffset
 	}
 
 	#endregion
-
 	#region DependencyProperty: HorizontalScrollValue
 
 	/// <summary>Identifies the HorizontalScrollValue dependency property.</summary>
@@ -70,7 +69,6 @@ public double HorizontalScrollValue
 	}
 
 	#endregion
-
 	#region DependencyProperty: HorizontalMinScroll
 
 	/// <summary>Identifies the HorizontalMinScroll dependency property.</summary>
@@ -88,7 +86,6 @@ public double HorizontalMinScroll
 	}
 
 	#endregion
-
 	#region DependencyProperty: HorizontalMaxScroll
 
 	/// <summary>Identifies the HorizontalMaxScroll dependency property.</summary>
@@ -106,7 +103,6 @@ public double HorizontalMaxScroll
 	}
 
 	#endregion
-
 	#region DependencyProperty: HorizontalZoomCenter
 
 	/// <summary>Identifies the HorizontalZoomCenter dependency property.</summary>
@@ -142,7 +138,6 @@ public double VerticalOffset
 	}
 
 	#endregion
-
 	#region DependencyProperty: VerticalMaxScroll
 
 	/// <summary>Identifies the VerticalMaxScroll dependency property.</summary>
@@ -160,7 +155,6 @@ public double VerticalMaxScroll
 	}
 
 	#endregion
-
 	#region DependencyProperty: VerticalMinScroll
 
 	/// <summary>Identifies the VerticalMinScroll dependency property.</summary>
@@ -178,7 +172,6 @@ public double VerticalMinScroll
 	}
 
 	#endregion
-
 	#region DependencyProperty: VerticalZoomCenter
 
 	/// <summary>Identifies the VerticalZoomCenter dependency property.</summary>
@@ -197,42 +190,6 @@ public double VerticalZoomCenter
 
 	#endregion
 
-	#region DependencyProperty: ViewportWidth
-
-	/// <summary>Identifies the ViewportWidth dependency property.</summary>
-	public static DependencyProperty ViewportWidthProperty { get; } = DependencyProperty.Register(
-		nameof(ViewportWidth),
-		typeof(double),
-		typeof(ZoomContentControl),
-		new PropertyMetadata(default(double)));
-
-	/// <summary>Gets or sets the width of the viewport.</summary>
-	public double ViewportWidth
-	{
-		get => (double)GetValue(ViewportWidthProperty);
-		set => SetValue(ViewportWidthProperty, value);
-	}
-
-	#endregion
-
-	#region DependencyProperty: ViewportHeight
-
-	/// <summary>Identifies the ViewportHeight dependency property.</summary>
-	public static DependencyProperty ViewportHeightProperty { get; } = DependencyProperty.Register(
-		nameof(ViewportHeight),
-		typeof(double),
-		typeof(ZoomContentControl),
-		new PropertyMetadata(default(double)));
-
-	/// <summary>Gets or sets the height of the viewport.</summary>
-	public double ViewportHeight
-	{
-		get => (double)GetValue(ViewportHeightProperty);
-		set => SetValue(ViewportHeightProperty, value);
-	}
-
-	#endregion
-
 	#region DependencyProperty: ZoomLevel
 
 	/// <summary>Identifies the ZoomLevel dependency property.</summary>
@@ -250,7 +207,6 @@ public double ZoomLevel
 	}
 
 	#endregion
-
 	#region DependencyProperty: MinZoomLevel
 
 	/// <summary>Identifies the MinZoomLevel dependency property.</summary>
@@ -268,7 +224,6 @@ public double MinZoomLevel
 	}
 
 	#endregion
-
 	#region DependencyProperty: MaxZoomLevel
 
 	/// <summary>Identifies the MaxZoomLevel dependency property.</summary>
@@ -304,7 +259,6 @@ public double PanWheelRatio
 	}
 
 	#endregion
-
 	#region DependencyProperty: ScaleWheelRatio
 
 	/// <summary>Identifies the ScaleWheelRatio dependency property.</summary>
@@ -323,6 +277,41 @@ public double ScaleWheelRatio
 
 	#endregion
 
+	#region DependencyProperty: ViewportWidth
+
+	/// <summary>Identifies the ViewportWidth dependency property.</summary>
+	public static DependencyProperty ViewportWidthProperty { get; } = DependencyProperty.Register(
+		nameof(ViewportWidth),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double)));
+
+	/// <summary>Gets or sets the width of the viewport.</summary>
+	public double ViewportWidth
+	{
+		get => (double)GetValue(ViewportWidthProperty);
+		set => SetValue(ViewportWidthProperty, value);
+	}
+
+	#endregion
+	#region DependencyProperty: ViewportHeight
+
+	/// <summary>Identifies the ViewportHeight dependency property.</summary>
+	public static DependencyProperty ViewportHeightProperty { get; } = DependencyProperty.Register(
+		nameof(ViewportHeight),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(default(double)));
+
+	/// <summary>Gets or sets the height of the viewport.</summary>
+	public double ViewportHeight
+	{
+		get => (double)GetValue(ViewportHeightProperty);
+		set => SetValue(ViewportHeightProperty, value);
+	}
+
+	#endregion
+
 	#region DependencyProperty: IsActive
 
 	/// <summary>Identifies the IsActive dependency property.</summary>
@@ -340,7 +329,6 @@ public bool IsActive
 	}
 
 	#endregion
-
 	#region DependencyProperty: IsZoomAllowed
 
 	/// <summary>Identifies the IsZoomAllowed dependency property.</summary>
@@ -358,7 +346,6 @@ public bool IsZoomAllowed
 	}
 
 	#endregion
-
 	#region DependencyProperty: IsHorizontalScrollBarVisible
 
 	/// <summary>Identifies the IsHorizontalScrollBarVisible dependency property.</summary>
@@ -376,7 +363,6 @@ public bool IsHorizontalScrollBarVisible
 	}
 
 	#endregion
-
 	#region DependencyProperty: IsPanAllowed
 
 	/// <summary>Identifies the IsPanAllowed dependency property.</summary>
@@ -394,7 +380,6 @@ public bool IsPanAllowed
 	}
 
 	#endregion
-
 	#region DependencyProperty: IsVerticalScrollBarVisible
 
 	/// <summary>Identifies the IsVerticalScrollBarVisible dependency property.</summary>
@@ -412,7 +397,6 @@ public bool IsVerticalScrollBarVisible
 	}
 
 	#endregion
-
 	#region DependencyProperty: AutoZoomToCanvasOnSizeChanged
 
 	/// <summary>Identifies the AutoZoomToCanvasOnSizeChanged dependency property.</summary>
@@ -430,7 +414,6 @@ public bool AutoZoomToCanvasOnSizeChanged
 	}
 
 	#endregion
-
 	#region DependencyProperty: AdditionalMargin
 
 	/// <summary>Identifies the AdditionalMargin dependency property.</summary>
@@ -448,7 +431,6 @@ public Thickness AdditionalMargin
 	}
 
 	#endregion
-
 	#region DependencyProperty: ContentBoundsVisibility
 
 	/// <summary>Identifies the ContentBoundsVisibility dependency property.</summary>
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index 58a3a4c5b..c656c4fc6 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -49,6 +49,9 @@ private static class TemplateParts
 		public const string VerticalScrollBar = "PART_ScrollV";
 	}
 
+	// Events
+	public event EventHandler<EventArgs>? RenderedContentUpdated;
+
 	// Fields
 	private ContentPresenter? _presenter;
 	private ScrollBar? _scrollV;
@@ -61,7 +64,17 @@ private static class TemplateParts
 	private uint _capturedPointerId;
 	private Point _referencePosition;
 
-	// Constructor
+	// Properties
+	public Size AvailableSize
+	{
+		get
+		{
+			var vOffset = (AdditionalMargin.Top + AdditionalMargin.Bottom);
+			var hOffset = (AdditionalMargin.Left + AdditionalMargin.Right);
+			return new Size(ActualWidth - hOffset, ActualHeight - vOffset);
+		}
+	}
+
 	public ZoomContentControl()
 	{
 		DefaultStyleKey = typeof(ZoomContentControl);
@@ -73,21 +86,43 @@ public ZoomContentControl()
 		PointerWheelChanged += OnPointerWheelChanged;
 	}
 
-	// Events
-	public event EventHandler<EventArgs>? RenderedContentUpdated;
-
-	// Properties
-	public Size AvailableSize
+	protected override void OnApplyTemplate()
 	{
-		get
+		base.OnApplyTemplate();
+
+		T FindTemplatePart<T>(string name) where T : class =>
+			(GetTemplateChild(name) ?? throw new Exception($"Expected template part not found: {name}"))
+			as T ?? throw new Exception($"Expected template part '{name}' to be of type: {typeof(T)}");
+
+		_presenter = FindTemplatePart<ContentPresenter>(TemplateParts.Presenter);
+		_scrollV = FindTemplatePart<ScrollBar>(TemplateParts.VerticalScrollBar);
+		_scrollH = FindTemplatePart<ScrollBar>(TemplateParts.HorizontalScrollBar);
+
+		ResetOffset();
+		ResetZoom();
+
+		if (_presenter?.Content is FrameworkElement { } fe)
 		{
-			var vOffset = (AdditionalMargin.Top + AdditionalMargin.Bottom);
-			var hOffset = (AdditionalMargin.Left + AdditionalMargin.Right);
-			return new Size(ActualWidth - hOffset, ActualHeight - vOffset);
+			fe.LayoutUpdated += (s, e) =>
+			{
+				ViewportWidth = fe.ActualWidth;
+				ViewportHeight = fe.ActualHeight;
+
+				UpdateScrollLimits();
+			};
+		}
+
+		if (_scrollV is not null)
+		{
+			_scrollV.Scroll += ScrollV_Scroll;
+		}
+
+		if (_scrollH is not null)
+		{
+			_scrollH.Scroll += ScrollH_Scroll;
 		}
 	}
 
-	// Methods
 	private async Task RaiseRenderedContentUpdated()
 	{
 		await Task.Yield();
@@ -155,11 +190,6 @@ private bool CanMoveIn((bool Horizontal, bool Vertical) _movementDirection)
 		return canMove;
 	}
 
-	private bool CanScrollUp() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Top);
-	private bool CanScrollDown() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Bottom);
-	private bool CanScrollLeft() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Left);
-	private bool CanScrollRight() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Right);
-
 	private async void UpdateHorizontalScrollBarValue()
 	{
 		HorizontalScrollValue = -1 * HorizontalOffset;
@@ -203,26 +233,6 @@ private void CoerceZoomLevel()
 		ZoomLevel = Math.Clamp(ZoomLevel, MinZoomLevel, MaxZoomLevel);
 	}
 
-	// Template handling
-	protected override void OnApplyTemplate()
-	{
-		base.OnApplyTemplate();
-
-		T FindTemplatePart<T>(string name) where T : class =>
-			(GetTemplateChild(name) ?? throw new Exception($"Expected template part not found: {name}"))
-			as T ?? throw new Exception($"Expected template part '{name}' to be of type: {typeof(T)}");
-
-		_presenter = FindTemplatePart<ContentPresenter>(TemplateParts.Presenter);
-		_scrollV = FindTemplatePart<ScrollBar>(TemplateParts.VerticalScrollBar);
-		_scrollH = FindTemplatePart<ScrollBar>(TemplateParts.HorizontalScrollBar);
-
-		ResetOffset();
-		ResetZoom();
-
-		RegisterToControlEvents();
-	}
-
-	// Event handlers
 	private void OnLoaded(object sender, RoutedEventArgs e)
 	{
 		CenterContent();
@@ -237,30 +247,6 @@ private void OnSizeChanged(object sender, SizeChangedEventArgs args)
 		}
 	}
 
-	private void RegisterToControlEvents()
-	{
-		if (_presenter?.Content is FrameworkElement { } fe)
-		{
-			fe.LayoutUpdated += (s, e) =>
-			{
-				ViewportWidth = fe.ActualWidth;
-				ViewportHeight = fe.ActualHeight;
-
-				UpdateScrollLimits();
-			};
-		}
-
-		if (_scrollV is not null)
-		{
-			_scrollV.Scroll += ScrollV_Scroll;
-		}
-
-		if (_scrollH is not null)
-		{
-			_scrollH.Scroll += ScrollH_Scroll;
-		}
-	}
-
 	private void ScrollV_Scroll(object sender, ScrollEventArgs e)
 	{
 		if ((_previousVerticalScrollValue > e.NewValue && !CanScrollUp()) ||
@@ -285,7 +271,6 @@ private void ScrollH_Scroll(object sender, ScrollEventArgs e)
 		_previousHorizontalScrollValue = e.NewValue;
 	}
 
-	// Additional private methods for pointer handling
 	private void OnPointerPressed(object sender, PointerRoutedEventArgs e)
 	{
 		if (!IsAllowedToWork) return;
@@ -409,8 +394,7 @@ private void TryUpdateOffsets(double deltaX, double deltaY)
 		}
 	}
 
-	// Public methods
-	public void Initialize()
+	public void ResetViewport()
 	{
 		ResetZoom();
 		ResetOffset();
@@ -418,6 +402,7 @@ public void Initialize()
 	}
 
 	internal void ResetZoom() => ZoomLevel = 1;
+
 	private void ResetOffset()
 	{
 		HorizontalOffset = AdditionalMargin.Left;
@@ -451,7 +436,12 @@ public void FitToCanvas()
 		}
 	}
 
-	// Static helper
+	// Helper
+	private bool CanScrollUp() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Top);
+	private bool CanScrollDown() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Bottom);
+	private bool CanScrollLeft() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Left);
+	private bool CanScrollRight() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Right);
+
 	private static Matrix GetPositionMatrix(FrameworkElement element, FrameworkElement rootElement)
 		=> ((MatrixTransform)element.TransformToVisual(rootElement)).Matrix;
 }

From 3b554cd599e3a579a7b4ab5da61763ac74bc94df Mon Sep 17 00:00:00 2001
From: xiaoy312 <xiaoyao312@gmail.com>
Date: Tue, 22 Oct 2024 17:00:36 -0400
Subject: [PATCH 25/30] chore: ZoomContentControl refactor/cleanup

---
 .../Tests/ZoomContentControlTest.cs           |   2 +
 .../BoundsVisibilityFlag.cs                   |  15 -
 .../ZoomContentControl.Properties.cs          | 241 +++++-------
 .../ZoomContentControl/ZoomContentControl.cs  | 361 +++++++-----------
 .../ZoomContentControl.xaml                   |  39 +-
 5 files changed, 250 insertions(+), 408 deletions(-)
 delete mode 100644 src/Uno.Toolkit.UI/Controls/ZoomContentControl/BoundsVisibilityFlag.cs

diff --git a/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs b/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs
index 1128a7818..775cc6700 100644
--- a/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs
+++ b/src/Uno.Toolkit.RuntimeTests/Tests/ZoomContentControlTest.cs
@@ -27,6 +27,7 @@
 
 namespace Uno.Toolkit.RuntimeTests.Tests
 {
+#if false
 	[TestClass]
 	[RunsOnUIThread]
 	internal class ZoomContentControlTest
@@ -220,4 +221,5 @@ public async Task When_Pan_ShouldUpdateOffsets()
 			translation.Y.Should().Be(50);
 		}
 	}
+#endif
 }
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/BoundsVisibilityFlag.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/BoundsVisibilityFlag.cs
deleted file mode 100644
index 6e480c5a6..000000000
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/BoundsVisibilityFlag.cs
+++ /dev/null
@@ -1,15 +0,0 @@
-using System;
-
-namespace Uno.Toolkit.UI;
-
-[Flags]
-public enum BoundsVisibilityFlag
-{
-	Left = 1 << 0,
-	Top = 1 << 1,
-	Right = 1 << 2,
-	Bottom = 1 << 3,
-
-	None = 0,
-	All = Left | Top | Right | Bottom,
-}
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
index f6eb8862a..cd4be8368 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
@@ -35,33 +35,14 @@ namespace Uno.Toolkit.UI;
 
 public partial class ZoomContentControl
 {
-	#region DependencyProperty: HorizontalOffset
-
-	/// <summary>Identifies the HorizontalOffset dependency property.</summary>
-	public static DependencyProperty HorizontalOffsetProperty { get; } = DependencyProperty.Register(
-		nameof(HorizontalOffset),
-		typeof(double),
-		typeof(ZoomContentControl),
-		new PropertyMetadata(default(double), OnHorizontalOffsetChanged));
-
-	/// <summary>Gets or sets the horizontal offset for panning the content.</summary>
-	public double HorizontalOffset
-	{
-		get => (double)GetValue(HorizontalOffsetProperty);
-		set => SetValue(HorizontalOffsetProperty, value);
-	}
-
-	#endregion
 	#region DependencyProperty: HorizontalScrollValue
 
-	/// <summary>Identifies the HorizontalScrollValue dependency property.</summary>
 	public static DependencyProperty HorizontalScrollValueProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalScrollValue),
 		typeof(double),
 		typeof(ZoomContentControl),
-		new PropertyMetadata(default(double)));
+		new PropertyMetadata(default(double), OnHorizontalScrollValueChanged));
 
-	/// <summary>Gets or sets the value of the horizontal scrollbar. It's used to represent the scroll position within the scroll bar UI.</summary>
 	public double HorizontalScrollValue
 	{
 		get => (double)GetValue(HorizontalScrollValueProperty);
@@ -119,22 +100,37 @@ public double HorizontalZoomCenter
 		set => SetValue(HorizontalZoomCenterProperty, value);
 	}
 
+	#endregion
+	#region DependencyProperty: IsHorizontalScrollBarVisible
+
+	/// <summary>Identifies the IsHorizontalScrollBarVisible dependency property.</summary>
+	public static DependencyProperty IsHorizontalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
+		nameof(IsHorizontalScrollBarVisible),
+		typeof(bool),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(true));
+
+	/// <summary>Gets or sets a value indicating whether the horizontal scrollbar is visible.</summary>
+	public bool IsHorizontalScrollBarVisible
+	{
+		get => (bool)GetValue(IsHorizontalScrollBarVisibleProperty);
+		set => SetValue(IsHorizontalScrollBarVisibleProperty, value);
+	}
+
 	#endregion
 
-	#region DependencyProperty: VerticalOffset
+	#region DependencyProperty: VerticalScrollValue
 
-	/// <summary>Identifies the VerticalOffset dependency property.</summary>
-	public static DependencyProperty VerticalOffsetProperty { get; } = DependencyProperty.Register(
-		nameof(VerticalOffset),
+	public static DependencyProperty VerticalScrollValueProperty { get; } = DependencyProperty.Register(
+		nameof(VerticalScrollValue),
 		typeof(double),
 		typeof(ZoomContentControl),
-		new PropertyMetadata(default(double), OnVerticalOffsetChanged));
+		new PropertyMetadata(default(double), OnVerticalScrollValueChanged));
 
-	/// <summary>Gets or sets the vertical offset for panning the content.</summary>
-	public double VerticalOffset
+	public double VerticalScrollValue
 	{
-		get => (double)GetValue(VerticalOffsetProperty);
-		set => SetValue(VerticalOffsetProperty, value);
+		get => (double)GetValue(VerticalScrollValueProperty);
+		set => SetValue(VerticalScrollValueProperty, value);
 	}
 
 	#endregion
@@ -188,6 +184,23 @@ public double VerticalZoomCenter
 		set => SetValue(VerticalZoomCenterProperty, value);
 	}
 
+	#endregion
+	#region DependencyProperty: IsVerticalScrollBarVisible
+
+	/// <summary>Identifies the IsVerticalScrollBarVisible dependency property.</summary>
+	public static DependencyProperty IsVerticalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
+		nameof(IsVerticalScrollBarVisible),
+		typeof(bool),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(true));
+
+	/// <summary>Gets or sets a value indicating whether the vertical scrollbar is visible.</summary>
+	public bool IsVerticalScrollBarVisible
+	{
+		get => (bool)GetValue(IsVerticalScrollBarVisibleProperty);
+		set => SetValue(IsVerticalScrollBarVisibleProperty, value);
+	}
+
 	#endregion
 
 	#region DependencyProperty: ZoomLevel
@@ -241,7 +254,41 @@ public double MaxZoomLevel
 	}
 
 	#endregion
+	#region DependencyProperty: IsZoomAllowed
 
+	/// <summary>Identifies the IsZoomAllowed dependency property.</summary>
+	public static DependencyProperty IsZoomAllowedProperty { get; } = DependencyProperty.Register(
+		nameof(IsZoomAllowed),
+		typeof(bool),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(true));
+
+	/// <summary>Gets or sets a value indicating whether zooming is allowed.</summary>
+	public bool IsZoomAllowed
+	{
+		get => (bool)GetValue(IsZoomAllowedProperty);
+		set => SetValue(IsZoomAllowedProperty, value);
+	}
+
+	#endregion
+
+	#region DependencyProperty: ScaleWheelRatio
+
+	/// <summary>Identifies the ScaleWheelRatio dependency property.</summary>
+	public static DependencyProperty ScaleWheelRatioProperty { get; } = DependencyProperty.Register(
+		nameof(ScaleWheelRatio),
+		typeof(double),
+		typeof(ZoomContentControl),
+		new PropertyMetadata(0.0006d));
+
+	/// <summary>Gets or sets the ratio used for scaling the zoom level with the mouse wheel.</summary>
+	public double ScaleWheelRatio
+	{
+		get => (double)GetValue(ScaleWheelRatioProperty);
+		set => SetValue(ScaleWheelRatioProperty, value);
+	}
+
+	#endregion
 	#region DependencyProperty: PanWheelRatio
 
 	/// <summary>Identifies the PanWheelRatio dependency property.</summary>
@@ -259,20 +306,20 @@ public double PanWheelRatio
 	}
 
 	#endregion
-	#region DependencyProperty: ScaleWheelRatio
+	#region DependencyProperty: IsPanAllowed
 
-	/// <summary>Identifies the ScaleWheelRatio dependency property.</summary>
-	public static DependencyProperty ScaleWheelRatioProperty { get; } = DependencyProperty.Register(
-		nameof(ScaleWheelRatio),
-		typeof(double),
+	/// <summary>Identifies the IsPanAllowed dependency property.</summary>
+	public static DependencyProperty IsPanAllowedProperty { get; } = DependencyProperty.Register(
+		nameof(IsPanAllowed),
+		typeof(bool),
 		typeof(ZoomContentControl),
-		new PropertyMetadata(0.0006d));
+		new PropertyMetadata(true));
 
-	/// <summary>Gets or sets the ratio used for scaling the zoom level with the mouse wheel.</summary>
-	public double ScaleWheelRatio
+	/// <summary>Gets or sets a value indicating whether panning is allowed.</summary>
+	public bool IsPanAllowed
 	{
-		get => (double)GetValue(ScaleWheelRatioProperty);
-		set => SetValue(ScaleWheelRatioProperty, value);
+		get => (bool)GetValue(IsPanAllowedProperty);
+		set => SetValue(IsPanAllowedProperty, value);
 	}
 
 	#endregion
@@ -281,13 +328,13 @@ public double ScaleWheelRatio
 
 	/// <summary>Identifies the ViewportWidth dependency property.</summary>
 	public static DependencyProperty ViewportWidthProperty { get; } = DependencyProperty.Register(
-		nameof(ViewportWidth),
+		nameof(ContentWidth),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
 	/// <summary>Gets or sets the width of the viewport.</summary>
-	public double ViewportWidth
+	public double ContentWidth
 	{
 		get => (double)GetValue(ViewportWidthProperty);
 		set => SetValue(ViewportWidthProperty, value);
@@ -298,13 +345,13 @@ public double ViewportWidth
 
 	/// <summary>Identifies the ViewportHeight dependency property.</summary>
 	public static DependencyProperty ViewportHeightProperty { get; } = DependencyProperty.Register(
-		nameof(ViewportHeight),
+		nameof(ContentHeight),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
 	/// <summary>Gets or sets the height of the viewport.</summary>
-	public double ViewportHeight
+	public double ContentHeight
 	{
 		get => (double)GetValue(ViewportHeightProperty);
 		set => SetValue(ViewportHeightProperty, value);
@@ -329,88 +376,18 @@ public bool IsActive
 	}
 
 	#endregion
-	#region DependencyProperty: IsZoomAllowed
-
-	/// <summary>Identifies the IsZoomAllowed dependency property.</summary>
-	public static DependencyProperty IsZoomAllowedProperty { get; } = DependencyProperty.Register(
-		nameof(IsZoomAllowed),
-		typeof(bool),
-		typeof(ZoomContentControl),
-		new PropertyMetadata(true));
-
-	/// <summary>Gets or sets a value indicating whether zooming is allowed.</summary>
-	public bool IsZoomAllowed
-	{
-		get => (bool)GetValue(IsZoomAllowedProperty);
-		set => SetValue(IsZoomAllowedProperty, value);
-	}
-
-	#endregion
-	#region DependencyProperty: IsHorizontalScrollBarVisible
-
-	/// <summary>Identifies the IsHorizontalScrollBarVisible dependency property.</summary>
-	public static DependencyProperty IsHorizontalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
-		nameof(IsHorizontalScrollBarVisible),
-		typeof(bool),
-		typeof(ZoomContentControl),
-		new PropertyMetadata(true));
-
-	/// <summary>Gets or sets a value indicating whether the horizontal scrollbar is visible.</summary>
-	public bool IsHorizontalScrollBarVisible
-	{
-		get => (bool)GetValue(IsHorizontalScrollBarVisibleProperty);
-		set => SetValue(IsHorizontalScrollBarVisibleProperty, value);
-	}
-
-	#endregion
-	#region DependencyProperty: IsPanAllowed
+	#region DependencyProperty: AutoFitToCanvas
 
-	/// <summary>Identifies the IsPanAllowed dependency property.</summary>
-	public static DependencyProperty IsPanAllowedProperty { get; } = DependencyProperty.Register(
-		nameof(IsPanAllowed),
+	public static DependencyProperty AutoFitToCanvasProperty { get; } = DependencyProperty.Register(
+		nameof(AutoFitToCanvas),
 		typeof(bool),
 		typeof(ZoomContentControl),
-		new PropertyMetadata(true));
+		new PropertyMetadata(default(bool)));
 
-	/// <summary>Gets or sets a value indicating whether panning is allowed.</summary>
-	public bool IsPanAllowed
+	public bool AutoFitToCanvas
 	{
-		get => (bool)GetValue(IsPanAllowedProperty);
-		set => SetValue(IsPanAllowedProperty, value);
-	}
-
-	#endregion
-	#region DependencyProperty: IsVerticalScrollBarVisible
-
-	/// <summary>Identifies the IsVerticalScrollBarVisible dependency property.</summary>
-	public static DependencyProperty IsVerticalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
-		nameof(IsVerticalScrollBarVisible),
-		typeof(bool),
-		typeof(ZoomContentControl),
-		new PropertyMetadata(true));
-
-	/// <summary>Gets or sets a value indicating whether the vertical scrollbar is visible.</summary>
-	public bool IsVerticalScrollBarVisible
-	{
-		get => (bool)GetValue(IsVerticalScrollBarVisibleProperty);
-		set => SetValue(IsVerticalScrollBarVisibleProperty, value);
-	}
-
-	#endregion
-	#region DependencyProperty: AutoZoomToCanvasOnSizeChanged
-
-	/// <summary>Identifies the AutoZoomToCanvasOnSizeChanged dependency property.</summary>
-	public static DependencyProperty AutoZoomToCanvasOnSizeChangedProperty { get; } = DependencyProperty.Register(
-		nameof(AutoZoomToCanvasOnSizeChanged),
-		typeof(bool),
-		typeof(ZoomContentControl),
-		new PropertyMetadata(true));
-
-	/// <summary>Gets or sets a value indicating whether the control should automatically zoom to fit the canvas when its size changes.</summary>
-	public bool AutoZoomToCanvasOnSizeChanged
-	{
-		get => (bool)GetValue(AutoZoomToCanvasOnSizeChangedProperty);
-		set => SetValue(AutoZoomToCanvasOnSizeChangedProperty, value);
+		get => (bool)GetValue(AutoFitToCanvasProperty);
+		set => SetValue(AutoFitToCanvasProperty, value);
 	}
 
 	#endregion
@@ -421,7 +398,7 @@ public bool AutoZoomToCanvasOnSizeChanged
 		nameof(AdditionalMargin),
 		typeof(Thickness),
 		typeof(ZoomContentControl),
-		new PropertyMetadata(new Thickness(0)));
+		new PropertyMetadata(new Thickness(0), OnAdditionalMarginChanged));
 
 	/// <summary>Gets or sets additional margins around the content.</summary>
 	public Thickness AdditionalMargin
@@ -430,29 +407,13 @@ public Thickness AdditionalMargin
 		set => SetValue(AdditionalMarginProperty, value);
 	}
 
-	#endregion
-	#region DependencyProperty: ContentBoundsVisibility
-
-	/// <summary>Identifies the ContentBoundsVisibility dependency property.</summary>
-	public static DependencyProperty ContentBoundsVisibilityProperty { get; } = DependencyProperty.Register(
-		nameof(ContentBoundsVisibility),
-		typeof(BoundsVisibilityFlag),
-		typeof(ZoomContentControl),
-		new PropertyMetadata(BoundsVisibilityFlag.None));
-
-	/// <summary>Gets or sets the visibility data for the content bounds.</summary>
-	public BoundsVisibilityFlag ContentBoundsVisibility
-	{
-		get => (BoundsVisibilityFlag)GetValue(ContentBoundsVisibilityProperty);
-		private set => SetValue(ContentBoundsVisibilityProperty, value);
-	}
-
 	#endregion
 
-	private static void OnHorizontalOffsetChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).OnHorizontalOffsetChanged();
-	private static void OnVerticalOffsetChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).OnVerticalOffsetChanged();
+	private static void OnHorizontalScrollValueChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).OnHorizontalScrollValueChanged();
+	private static void OnVerticalScrollValueChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).OnVerticalScrollValueChanged();
 	private static void OnZoomLevelChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).OnZoomLevelChanged();
 	private static void OnMinZoomLevelChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).CoerceZoomLevel();
 	private static void OnMaxZoomLevelChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).CoerceZoomLevel();
 	private static void OnIsActiveChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).IsActiveChanged();
+	private static void OnAdditionalMarginChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e) => ((ZoomContentControl)sender).OnAdditionalMarginChanged();
 }
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index c656c4fc6..576dfc5fe 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -31,54 +31,41 @@
 using Windows.Devices.Input;
 #endif
 
-using static Uno.Toolkit.UI.BoundsVisibilityFlag;
-
 namespace Uno.Toolkit.UI;
 
 [TemplatePart(Name = TemplateParts.RootGrid, Type = typeof(Grid))]
-[TemplatePart(Name = TemplateParts.Presenter, Type = typeof(ContentPresenter))]
+[TemplatePart(Name = TemplateParts.ContentGrid, Type = typeof(Grid))]
+[TemplatePart(Name = TemplateParts.ContentPresenter, Type = typeof(ContentPresenter))]
 [TemplatePart(Name = TemplateParts.VerticalScrollBar, Type = typeof(ScrollBar))]
 [TemplatePart(Name = TemplateParts.HorizontalScrollBar, Type = typeof(ScrollBar))]
+[TemplatePart(Name = TemplateParts.TranslateTransform, Type = typeof(TranslateTransform))]
 public partial class ZoomContentControl : ContentControl
 {
 	private static class TemplateParts
 	{
 		public const string RootGrid = "PART_RootGrid";
-		public const string Presenter = "PART_Presenter";
+		public const string ContentGrid = "PART_ContentGrid";
+		public const string ContentPresenter = "PART_ContentPresenter";
 		public const string HorizontalScrollBar = "PART_ScrollH";
 		public const string VerticalScrollBar = "PART_ScrollV";
+		public const string TranslateTransform = "PART_TranslateTransform";
 	}
 
-	// Events
 	public event EventHandler<EventArgs>? RenderedContentUpdated;
 
-	// Fields
-	private ContentPresenter? _presenter;
+	private Grid? _contentGrid;
+	private ContentPresenter? _contentPresenter;
 	private ScrollBar? _scrollV;
 	private ScrollBar? _scrollH;
-	private Point _lastPosition = new Point(0, 0);
-	private (bool Horizontal, bool Vertical) _movementDirection = (false, false);
-	private bool IsAllowedToWork => (IsEnabled && IsActive && _presenter is not null);
-	private double _previousVerticalScrollValue = double.MinValue;
-	private double _previousHorizontalScrollValue = double.MinValue;
-	private uint _capturedPointerId;
-	private Point _referencePosition;
-
-	// Properties
-	public Size AvailableSize
-	{
-		get
-		{
-			var vOffset = (AdditionalMargin.Top + AdditionalMargin.Bottom);
-			var hOffset = (AdditionalMargin.Left + AdditionalMargin.Right);
-			return new Size(ActualWidth - hOffset, ActualHeight - vOffset);
-		}
-	}
+	private TranslateTransform? _translation;
+
+	private (uint Id, Point Position, Point ScrollOffset)? _capturedPointerContext;
+	private SerialDisposable _contentSubscriptions = new();
 
 	public ZoomContentControl()
 	{
 		DefaultStyleKey = typeof(ZoomContentControl);
-		Loaded += OnLoaded;
+
 		SizeChanged += OnSizeChanged;
 		PointerPressed += OnPointerPressed;
 		PointerReleased += OnPointerReleased;
@@ -94,32 +81,44 @@ T FindTemplatePart<T>(string name) where T : class =>
 			(GetTemplateChild(name) ?? throw new Exception($"Expected template part not found: {name}"))
 			as T ?? throw new Exception($"Expected template part '{name}' to be of type: {typeof(T)}");
 
-		_presenter = FindTemplatePart<ContentPresenter>(TemplateParts.Presenter);
+		_contentGrid = FindTemplatePart<Grid>(TemplateParts.ContentGrid);
+		_contentPresenter = FindTemplatePart<ContentPresenter>(TemplateParts.ContentPresenter);
 		_scrollV = FindTemplatePart<ScrollBar>(TemplateParts.VerticalScrollBar);
 		_scrollH = FindTemplatePart<ScrollBar>(TemplateParts.HorizontalScrollBar);
+		_translation = FindTemplatePart<TranslateTransform>(TemplateParts.TranslateTransform);
 
-		ResetOffset();
-		ResetZoom();
+		ResetViewport();
+	}
 
-		if (_presenter?.Content is FrameworkElement { } fe)
+	protected override void OnContentChanged(object oldContent, object newContent)
+	{
+		_contentSubscriptions.Disposable = null;
+		if (newContent is FrameworkElement { } fe)
 		{
-			fe.LayoutUpdated += (s, e) =>
+			fe.Loaded += OnContentLoaded;
+			fe.SizeChanged += OnContentSizeChanged;
+			_contentSubscriptions.Disposable = Disposable.Create(() =>
 			{
-				ViewportWidth = fe.ActualWidth;
-				ViewportHeight = fe.ActualHeight;
-
-				UpdateScrollLimits();
-			};
+				fe.Loaded -= OnContentLoaded;
+				fe.SizeChanged -= OnContentSizeChanged;
+			});
 		}
 
-		if (_scrollV is not null)
+		void OnContentLoaded(object sender, RoutedEventArgs e)
 		{
-			_scrollV.Scroll += ScrollV_Scroll;
+			if (AutoFitToCanvas)
+			{
+				FitToCanvas();
+			}
 		}
-
-		if (_scrollH is not null)
+		void OnContentSizeChanged(object sender, SizeChangedEventArgs e)
 		{
-			_scrollH.Scroll += ScrollH_Scroll;
+			ContentWidth = fe.ActualWidth;
+			ContentHeight = fe.ActualHeight;
+			HorizontalZoomCenter = ContentWidth / 2;
+			VerticalZoomCenter = ContentHeight / 2;
+
+			UpdateScrollBars();
 		}
 	}
 
@@ -129,78 +128,43 @@ private async Task RaiseRenderedContentUpdated()
 		RenderedContentUpdated?.Invoke(this, EventArgs.Empty);
 	}
 
-	private async void OnVerticalOffsetChanged()
+	private void OnHorizontalScrollValueChanged()
 	{
-		UpdateContentBoundsVisibility();
-		UpdateScrollVisibility();
-		await RaiseRenderedContentUpdated();
+		UpdateTranslation();
 	}
 
-	private void OnHorizontalOffsetChanged()
+	private void OnVerticalScrollValueChanged()
 	{
-		UpdateContentBoundsVisibility();
-		UpdateScrollVisibility();
-		UpdateHorizontalScrollBarValue();
+		UpdateTranslation();
+	}
+
+	private void OnAdditionalMarginChanged()
+	{
+		_contentPresenter?.ToString();
 	}
 
 	private async void OnZoomLevelChanged()
 	{
 		CoerceZoomLevel();
-		UpdateScrollLimits();
-		UpdateContentBoundsVisibility();
+		UpdateScrollBars();
 		UpdateScrollVisibility();
 		await RaiseRenderedContentUpdated();
 	}
 
-	private void UpdateContentBoundsVisibility()
-	{
-		if (_presenter?.Content is FrameworkElement fe)
-		{
-			var m = GetPositionMatrix(fe, this);
-
-			var flags = None;
-			if (m.OffsetX >= 0) flags |= BoundsVisibilityFlag.Left;
-			if (m.OffsetY >= 0) flags |= BoundsVisibilityFlag.Top;
-			if (ActualWidth >= (fe.ActualWidth * ZoomLevel) + m.OffsetX) flags |= BoundsVisibilityFlag.Right;
-			if (ActualHeight >= (fe.ActualHeight * ZoomLevel) + m.OffsetY) flags |= BoundsVisibilityFlag.Bottom;
-
-			ContentBoundsVisibility = flags;
-		}
-	}
-
 	private void UpdateScrollVisibility()
 	{
-		IsHorizontalScrollBarVisible = !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Left | BoundsVisibilityFlag.Right);
-		IsVerticalScrollBarVisible = !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Top | BoundsVisibilityFlag.Bottom);
-	}
-
-	private bool CanMoveIn((bool Horizontal, bool Vertical) _movementDirection)
-	{
-		if (ContentBoundsVisibility.HasFlag(All))
+		if (Viewport is { } vp)
 		{
-			return false;
+			IsHorizontalScrollBarVisible = vp.ActualWidth < ScrollExtentWidth;
+			IsVerticalScrollBarVisible = vp.ActualHeight < ScrollExtentHeight;
 		}
-
-		var canMove = false;
-		canMove |= CanScrollLeft() && _movementDirection.Horizontal is true;
-		canMove |= CanScrollRight() && _movementDirection.Horizontal is false;
-		canMove |= CanScrollUp() && _movementDirection.Vertical is true;
-		canMove |= CanScrollDown() && _movementDirection.Vertical is false;
-
-		return canMove;
-	}
-
-	private async void UpdateHorizontalScrollBarValue()
-	{
-		HorizontalScrollValue = -1 * HorizontalOffset;
-		await RaiseRenderedContentUpdated();
 	}
 
 	private void IsActiveChanged()
 	{
 		if (!IsActive)
 		{
-			RemoveOffset();
+			ResetOffset();
 			ResetZoom();
 		}
 		if (_scrollH is not null)
@@ -213,18 +177,25 @@ private void IsActiveChanged()
 		}
 	}
 
-	private void UpdateScrollLimits()
+	private void UpdateTranslation()
 	{
-		if (_presenter?.Content is FrameworkElement fe)
+		if (_translation is { })
 		{
-			var verticalScroll = Math.Max(0, (fe.ActualHeight * ZoomLevel) - ViewportHeight);
-			var horizontalScroll = Math.Max(0, (fe.ActualWidth * ZoomLevel) - ViewportWidth);
+			_translation.X = HorizontalScrollValue;
+			_translation.Y = VerticalScrollValue * -1; // Having a -1 here aligned the scroll direction with content translation
+		}
+	}
 
-			HorizontalMaxScroll = horizontalScroll / 2;
-			VerticalMaxScroll = verticalScroll / 2;
+	private void UpdateScrollBars()
+	{
+		if (Viewport is { } vp)
+		{
+			HorizontalMinScroll = VerticalMinScroll = 0;
 
-			HorizontalMinScroll = -1 * HorizontalMaxScroll;
-			VerticalMinScroll = -1 * VerticalMaxScroll;
+			HorizontalMaxScroll = Math.Max(0, ScrollExtentWidth - vp.ActualWidth);
+			VerticalMaxScroll = Math.Max(0, ScrollExtentHeight - vp.ActualHeight);
+			if (_scrollH is { }) _scrollH.ViewportSize = vp.ActualWidth;
+			if (_scrollV is { }) _scrollV.ViewportSize = vp.ActualHeight;
 		}
 	}
 
@@ -233,47 +204,17 @@ private void CoerceZoomLevel()
 		ZoomLevel = Math.Clamp(ZoomLevel, MinZoomLevel, MaxZoomLevel);
 	}
 
-	private void OnLoaded(object sender, RoutedEventArgs e)
-	{
-		CenterContent();
-	}
-
 	private void OnSizeChanged(object sender, SizeChangedEventArgs args)
 	{
-		UpdateContentBoundsVisibility();
-		if (IsLoaded && AutoZoomToCanvasOnSizeChanged)
+		if (IsLoaded && AutoFitToCanvas)
 		{
 			FitToCanvas();
 		}
 	}
 
-	private void ScrollV_Scroll(object sender, ScrollEventArgs e)
-	{
-		if ((_previousVerticalScrollValue > e.NewValue && !CanScrollUp()) ||
-			(_previousVerticalScrollValue < e.NewValue && !CanScrollDown()))
-		{
-			return;
-		}
-
-		VerticalOffset = -1 * e.NewValue;
-		_previousVerticalScrollValue = e.NewValue;
-	}
-
-	private void ScrollH_Scroll(object sender, ScrollEventArgs e)
-	{
-		if ((_previousHorizontalScrollValue < e.NewValue && !CanScrollRight()) ||
-			(_previousHorizontalScrollValue > e.NewValue && !CanScrollLeft()))
-		{
-			return;
-		}
-
-		HorizontalOffset = -1 * e.NewValue;
-		_previousHorizontalScrollValue = e.NewValue;
-	}
-
 	private void OnPointerPressed(object sender, PointerRoutedEventArgs e)
 	{
-		if (!IsAllowedToWork) return;
+		if (!IsAllowedToWork || _translation is null) return;
 		var pointerPoint = e.GetCurrentPoint(this);
 		var pointerProperties = pointerPoint.Properties;
 
@@ -289,9 +230,15 @@ private void OnPointerPressed(object sender, PointerRoutedEventArgs e)
 			var captured = CapturePointer(e.Pointer);
 			if (captured)
 			{
-				_capturedPointerId = e.Pointer.PointerId;
-				_referencePosition = pointerPoint.Position;
-				_lastPosition = _referencePosition;
+				_capturedPointerContext = (
+					e.Pointer.PointerId,
+					pointerPoint.Position,
+					ScrollValue
+				);
+			}
+			else
+			{
+				_capturedPointerContext = default;
 			}
 		}
 	}
@@ -299,98 +246,55 @@ private void OnPointerPressed(object sender, PointerRoutedEventArgs e)
 	private void OnPointerReleased(object sender, PointerRoutedEventArgs e)
 	{
 		ReleasePointerCaptures();
-		_capturedPointerId = default;
+		_capturedPointerContext = default;
 	}
 
 	private void OnPointerMoved(object sender, PointerRoutedEventArgs e)
 	{
-		if (!(IsAllowedToWork && _capturedPointerId > 0 && IsPanAllowed)) return;
-
-		var currentPosition = e.GetCurrentPoint(this).Position;
-		_movementDirection = (currentPosition.X > _lastPosition.X, currentPosition.Y > _lastPosition.Y);
-		_lastPosition = currentPosition;
+		if (!IsAllowedToWork ||!IsPanAllowed) return;
 
-		if (CanMoveIn(_movementDirection))
+		if (_capturedPointerContext is { } context)
 		{
-			e.Handled = true;
-			var pointerPoint = e.GetCurrentPoint(this);
-			var position = pointerPoint.Position;
-			var deltaX = position.X - _referencePosition.X;
-			var deltaY = position.Y - _referencePosition.Y;
-			TryUpdateOffsets(deltaX, deltaY);
-			_referencePosition = position;
+			var position = e.GetCurrentPoint(this).Position;
+			var delta = context.Position - position;
+			delta.X *= -1;
+
+			ScrollValue = context.ScrollOffset + delta;
 		}
 	}
 
 	private void OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
 	{
 		if (!IsAllowedToWork) return;
+		if (Viewport is not { } vp) return;
 
-		var pointerPoint = e.GetCurrentPoint(this);
-		var pointerProperties = pointerPoint.Properties;
-
-		var changeRatio = GetZoomDelta(pointerProperties);
-
+		var p = e.GetCurrentPoint(vp);
 		if (
 #if IS_WINUI
-			pointerPoint.PointerDeviceType == PointerDeviceType.Mouse &&
+			p.PointerDeviceType != PointerDeviceType.Mouse
 #else
-			pointerPoint.PointerDevice.PointerDeviceType == PointerDeviceType.Mouse &&
+			p.PointerDevice.PointerDeviceType != PointerDeviceType.Mouse
 #endif
-			e.KeyModifiers.HasFlag(Windows.System.VirtualKeyModifiers.Control) &&
-			IsZoomAllowed)
-		{
-			e.Handled = true;
-
-			var relativeX = (pointerPoint.Position.X - HorizontalOffset) / ZoomLevel;
-			var relativeY = (pointerPoint.Position.Y - VerticalOffset) / ZoomLevel;
+		) return;
 
-			ZoomLevel *= changeRatio;
 
-			HorizontalOffset = pointerPoint.Position.X - (relativeX * ZoomLevel);
-			VerticalOffset = pointerPoint.Position.Y - (relativeY * ZoomLevel);
-			return;
-		}
-
-		if (e.KeyModifiers.HasFlag(Windows.System.VirtualKeyModifiers.Shift))
+		// MouseWheel + Ctrl: Zoom
+		if (e.KeyModifiers.HasFlag(Windows.System.VirtualKeyModifiers.Control))
 		{
-			var deltaX = GetPanDelta(pointerProperties);
-			TryUpdateOffsets(deltaX, 0);
-			return;
-		}
-
-		var deltaY = GetPanDelta(pointerProperties);
-		TryUpdateOffsets(0, deltaY);
-	}
-
-	private double GetZoomDelta(PointerPointProperties pointerProperties)
-	{
-		var delta = pointerProperties.MouseWheelDelta * ScaleWheelRatio;
-		return 1 + delta;
-	}
-
-	private double GetPanDelta(PointerPointProperties pointerProperties)
-	{
-		var delta = pointerProperties.MouseWheelDelta * PanWheelRatio;
-		return delta;
-	}
+			if (!IsZoomAllowed) return;
 
-	private void TryUpdateOffsets(double deltaX, double deltaY)
-	{
-		if ((deltaX > 0 && CanScrollLeft()) ||
-			(deltaX < 0 && CanScrollRight()))
-		{
-			var offset = HorizontalOffset + deltaX;
-			var max = HorizontalMaxScroll * ZoomLevel;
-			HorizontalOffset = Math.Clamp(offset, 0, max);
+			return; // todo
 		}
-
-		if ((deltaY > 0 && CanScrollUp()) ||
-			(deltaY < 0 && CanScrollDown()))
+		// MouseWheel + Shift: Scroll Horizontally
+		// MouseWheel: Scroll Vertically
+		else
 		{
-			var offset = VerticalOffset + deltaY;
-			var max = VerticalMaxScroll * ZoomLevel;
-			VerticalOffset = Math.Clamp(offset, 0, max);
+			var delta = p.Properties.MouseWheelDelta * PanWheelRatio;
+			ScrollValue += e.KeyModifiers.HasFlag(Windows.System.VirtualKeyModifiers.Shift)
+				? new (delta, 0)
+				: new (0, -delta);
+
+			e.Handled = true;
 		}
 	}
 
@@ -398,50 +302,47 @@ public void ResetViewport()
 	{
 		ResetZoom();
 		ResetOffset();
-		CenterContent();
 	}
 
 	internal void ResetZoom() => ZoomLevel = 1;
 
 	private void ResetOffset()
 	{
-		HorizontalOffset = AdditionalMargin.Left;
-		VerticalOffset = AdditionalMargin.Top;
-	}
-
-	private void RemoveOffset()
-	{
-		HorizontalOffset = 0;
-		VerticalOffset = 0;
-	}
-
-	public void CenterContent()
-	{
-		if (IsActive && _presenter?.Content is FrameworkElement { } content)
-		{
-			HorizontalOffset = ((AvailableSize.Width - (content.ActualWidth * ZoomLevel)) / 2) + AdditionalMargin.Left;
-			VerticalOffset = ((AvailableSize.Height - (content.ActualHeight * ZoomLevel)) / 2) + AdditionalMargin.Top;
-		}
+		HorizontalScrollValue = 0;
+		VerticalScrollValue = 0;
 	}
 
 	public void FitToCanvas()
 	{
-		if (IsActive)
+		if (IsActive && Viewport is { } vp)
 		{
-			var vZoom = (ActualHeight - AdditionalMargin.Top - AdditionalMargin.Bottom) / ViewportHeight;
-			var hZoom = (ActualWidth - AdditionalMargin.Left - AdditionalMargin.Right) / ViewportWidth;
+			var hZoom = (vp.ActualWidth) / ScrollExtentWidth;
+			var vZoom = (vp.ActualHeight) / ScrollExtentHeight;
 			var zoomLevel = Math.Min(vZoom, hZoom);
+
 			ZoomLevel = Math.Clamp(zoomLevel, MinZoomLevel, MaxZoomLevel);
-			CenterContent();
+			ResetOffset();
 		}
 	}
 
 	// Helper
-	private bool CanScrollUp() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Top);
-	private bool CanScrollDown() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Bottom);
-	private bool CanScrollLeft() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Left);
-	private bool CanScrollRight() => !ContentBoundsVisibility.HasFlag(BoundsVisibilityFlag.Right);
 
-	private static Matrix GetPositionMatrix(FrameworkElement element, FrameworkElement rootElement)
-		=> ((MatrixTransform)element.TransformToVisual(rootElement)).Matrix;
+	private bool IsAllowedToWork => (IsLoaded && IsActive && _contentPresenter is not null);
+
+	private FrameworkElement? PresenterContent => _contentPresenter?.Content as FrameworkElement;
+
+	private FrameworkElement? Viewport => _contentGrid;
+
+	private Point ScrollValue
+	{
+		get => new Point(HorizontalScrollValue, VerticalScrollValue);
+		set
+		{
+			HorizontalScrollValue = Math.Clamp(value.X, HorizontalMinScroll, HorizontalMaxScroll);
+			VerticalScrollValue = Math.Clamp(value.Y, VerticalMinScroll, VerticalMaxScroll);
+		}
+	}
+
+	private double ScrollExtentWidth => (ContentWidth + AdditionalMargin.Left + AdditionalMargin.Right) * ZoomLevel;
+	private double ScrollExtentHeight => (ContentHeight + AdditionalMargin.Top + AdditionalMargin.Bottom) * ZoomLevel;
 }
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
index 9280a281b..22b61e151 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
@@ -1,11 +1,9 @@
-<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 					xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 					xmlns:utu="using:Uno.Toolkit.UI">
 
-	<Style x:Key="DefaultZoomContentControlStyle"
-		   TargetType="utu:ZoomContentControl">
-		<Setter Property="Background"
-				Value="Transparent" />
+	<Style x:Key="DefaultZoomContentControlStyle" TargetType="utu:ZoomContentControl">
+		<Setter Property="Background" Value="Transparent" />
 		<Setter Property="Template">
 			<Setter.Value>
 				<ControlTemplate TargetType="utu:ZoomContentControl">
@@ -21,12 +19,13 @@
 							<ColumnDefinition Width="*" />
 							<ColumnDefinition Width="Auto" />
 						</Grid.ColumnDefinitions>
-						<Canvas x:Name="PART_Canvas">
-							<ContentPresenter x:Name="PART_Presenter"
-											  Grid.Row="0"
-											  Grid.Column="0"
+						
+						<Grid x:Name="PART_ContentGrid"
+								Grid.Row="0"
+								Grid.Column="0">
+							<ContentPresenter x:Name="PART_ContentPresenter"
 											  Margin="0"
-											  Padding="0"
+											  Padding="{TemplateBinding AdditionalMargin}"
 											  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
 											  VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
 											  Content="{TemplateBinding Content}"
@@ -34,17 +33,13 @@
 											  ContentTemplateSelector="{TemplateBinding ContentTemplateSelector}">
 								<ContentPresenter.RenderTransform>
 									<TransformGroup>
-										<ScaleTransform CenterX="{TemplateBinding HorizontalZoomCenter}"
-														CenterY="{TemplateBinding VerticalZoomCenter}"
-														ScaleX="{TemplateBinding ZoomLevel}"
-														ScaleY="{TemplateBinding ZoomLevel}" />
-										<TranslateTransform X="{TemplateBinding HorizontalOffset}"
-															Y="{TemplateBinding VerticalOffset}" />
+										<ScaleTransform CenterX="{TemplateBinding HorizontalZoomCenter}" CenterY="{TemplateBinding VerticalZoomCenter}" ScaleX="{TemplateBinding ZoomLevel}" ScaleY="{TemplateBinding ZoomLevel}" />
+										<TranslateTransform x:Name="PART_TranslateTransform" />
 									</TransformGroup>
 								</ContentPresenter.RenderTransform>
 							</ContentPresenter>
-						</Canvas>
-						<!-- Vertical ScrollBar -->
+						</Grid>
+
 						<ScrollBar x:Name="PART_ScrollV"
 								   Grid.Row="0"
 								   Grid.Column="1"
@@ -58,8 +53,7 @@
 								   SmallChange="1"
 								   Visibility="{TemplateBinding IsVerticalScrollBarVisible}"
 								   ViewportSize="{TemplateBinding ViewportHeight}"
-								   Value="{TemplateBinding VerticalOffset}" />
-						<!-- Horizontal ScrollBar -->
+								   Value="{Binding VerticalScrollValue, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}" />
 						<ScrollBar x:Name="PART_ScrollH"
 								   Grid.Row="1"
 								   Grid.Column="0"
@@ -73,14 +67,13 @@
 								   SmallChange="1"
 								   Visibility="{TemplateBinding IsHorizontalScrollBarVisible}"
 								   ViewportSize="{TemplateBinding ViewportWidth}"
-								   Value="{TemplateBinding HorizontalScrollValue}" />
+								   Value="{Binding HorizontalScrollValue, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}" />
 					</Grid>
 				</ControlTemplate>
 			</Setter.Value>
 		</Setter>
 	</Style>
 
-	<Style BasedOn="{StaticResource DefaultZoomContentControlStyle}"
-		   TargetType="utu:ZoomContentControl" />
+	<Style BasedOn="{StaticResource DefaultZoomContentControlStyle}" TargetType="utu:ZoomContentControl" />
 
 </ResourceDictionary>

From 14a373e5df26138aa2e80aac650d9830310ac0a5 Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Tue, 22 Oct 2024 17:59:18 -0400
Subject: [PATCH 26/30] chore: update docs and private properties

---
 doc/controls/ZoomContentControl.md            | 17 ++--
 .../ZoomContentControl.Properties.cs          | 78 +++++++++----------
 2 files changed, 45 insertions(+), 50 deletions(-)

diff --git a/doc/controls/ZoomContentControl.md b/doc/controls/ZoomContentControl.md
index b7eec9a20..c501da467 100644
--- a/doc/controls/ZoomContentControl.md
+++ b/doc/controls/ZoomContentControl.md
@@ -49,24 +49,19 @@ xmlns:utu="using:Uno.Toolkit.UI"
 
 | Property| Type | Description |
 |-|-|-|
-| `ZoomLevel` | `double` | Gets or sets the current zoom level for the content. |
-| `MinZoomLevel` | `double` | Gets or sets the minimum zoom level allowed for the content. |
-| `MaxZoomLevel` | `double` | Gets or sets the maximum zoom level allowed for the content. |
 | `IsZoomAllowed` | `bool` | Gets or sets a value indicating whether zooming is allowed. |
-| `IsPanAllowed` | `bool` | Gets or sets a value indicating whether panning is allowed. |
-| `HorizontalOffest` | `double` | Gets or sets the horizontal offset for panning. |
-| `VerticalOffset` | `double` | Gets or sets the vertical offset for panning. |
-| `HorizontalZoomCenter` | `double` | Gets or sets the horizontal center point of the zooming operation. |
-| `VerticalZoomCenter` | `double` | Gets or sets the vertical center point of the zooming operation. |
 | `ScaleWheelRatio` | `double` | Gets or sets the ratio for scaling zoom level when using a mouse wheel. |
 | `PanWheelRatio` | `double` | Gets or sets the ratio for panning when using a mouse wheel. |
-| `ResetWhenNotActive` | `bool` | Gets or sets a value indicating whether the zoom and pan should reset when the control is not active. |
-| `AutoZoomToCanvasOnSizeChanged` | `bool` | Gets or sets a value indicating whether the control should automatically adjust zoom when resized. |
+| `IsPanAllowed` | `bool` | Gets or sets a value indicating whether panning is allowed. |
+| `ViewportWidth` | `bool` | Gets or sets the width of the content's viewport. |
+| `ViewportHeight` | `bool` | Gets or sets the height of the content's viewport. |
 | `IsActive` | `bool` | Gets or sets a value indicating whether the control is active. |
+| `AutoFitToCanvas` | `bool` | Determines if the content should automatically fit into the available canvas when the control resizes. |
+| `AdditionalMargin` | `Thickness` | Gets or sets additional margins around the content. |
 
 ### Methods
 
 | Method| Return Type| Description|
 |-----------------------|------------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
 | `FitToCanvas()`| `void`| Adjust the zoom level so that the content fits within the available space.|
-| `CenterContent()`| `void`| Centers the content within the available space.|
+| `ResetViewport()`| `void`| Resets the zoom level and panning offset to their default values and centers the content.|
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
index cd4be8368..88fb70b62 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
@@ -35,83 +35,83 @@ namespace Uno.Toolkit.UI;
 
 public partial class ZoomContentControl
 {
-	#region DependencyProperty: HorizontalScrollValue
+	#region DependencyProperty: [Private] HorizontalScrollValue
 
-	public static DependencyProperty HorizontalScrollValueProperty { get; } = DependencyProperty.Register(
+	private static DependencyProperty HorizontalScrollValueProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalScrollValue),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double), OnHorizontalScrollValueChanged));
 
-	public double HorizontalScrollValue
+	private double HorizontalScrollValue
 	{
 		get => (double)GetValue(HorizontalScrollValueProperty);
 		set => SetValue(HorizontalScrollValueProperty, value);
 	}
 
 	#endregion
-	#region DependencyProperty: HorizontalMinScroll
+	#region DependencyProperty: [Private] HorizontalMinScroll
 
 	/// <summary>Identifies the HorizontalMinScroll dependency property.</summary>
-	public static DependencyProperty HorizontalMinScrollProperty { get; } = DependencyProperty.Register(
+	private static DependencyProperty HorizontalMinScrollProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalMinScroll),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
 	/// <summary>Gets or sets the minimum horizontal scroll limit.</summary>
-	public double HorizontalMinScroll
+	private double HorizontalMinScroll
 	{
 		get => (double)GetValue(HorizontalMinScrollProperty);
 		set => SetValue(HorizontalMinScrollProperty, value);
 	}
 
 	#endregion
-	#region DependencyProperty: HorizontalMaxScroll
+	#region DependencyProperty: [Private] HorizontalMaxScroll
 
 	/// <summary>Identifies the HorizontalMaxScroll dependency property.</summary>
-	public static DependencyProperty HorizontalMaxScrollProperty { get; } = DependencyProperty.Register(
+	private static DependencyProperty HorizontalMaxScrollProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalMaxScroll),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
 	/// <summary>Gets or sets the maximum horizontal scroll limit.</summary>
-	public double HorizontalMaxScroll
+	private double HorizontalMaxScroll
 	{
 		get => (double)GetValue(HorizontalMaxScrollProperty);
 		set => SetValue(HorizontalMaxScrollProperty, value);
 	}
 
 	#endregion
-	#region DependencyProperty: HorizontalZoomCenter
+	#region DependencyProperty: [Private] HorizontalZoomCenter
 
 	/// <summary>Identifies the HorizontalZoomCenter dependency property.</summary>
-	public static DependencyProperty HorizontalZoomCenterProperty { get; } = DependencyProperty.Register(
+	private static DependencyProperty HorizontalZoomCenterProperty { get; } = DependencyProperty.Register(
 		nameof(HorizontalZoomCenter),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
 	/// <summary>Gets or sets the horizontal center point for zooming.</summary>
-	public double HorizontalZoomCenter
+	private double HorizontalZoomCenter
 	{
 		get => (double)GetValue(HorizontalZoomCenterProperty);
 		set => SetValue(HorizontalZoomCenterProperty, value);
 	}
 
 	#endregion
-	#region DependencyProperty: IsHorizontalScrollBarVisible
+	#region DependencyProperty: [Private] IsHorizontalScrollBarVisible
 
 	/// <summary>Identifies the IsHorizontalScrollBarVisible dependency property.</summary>
-	public static DependencyProperty IsHorizontalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
+	private static DependencyProperty IsHorizontalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
 		nameof(IsHorizontalScrollBarVisible),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true));
 
 	/// <summary>Gets or sets a value indicating whether the horizontal scrollbar is visible.</summary>
-	public bool IsHorizontalScrollBarVisible
+	private bool IsHorizontalScrollBarVisible
 	{
 		get => (bool)GetValue(IsHorizontalScrollBarVisibleProperty);
 		set => SetValue(IsHorizontalScrollBarVisibleProperty, value);
@@ -119,83 +119,83 @@ public bool IsHorizontalScrollBarVisible
 
 	#endregion
 
-	#region DependencyProperty: VerticalScrollValue
+	#region DependencyProperty: [Private] VerticalScrollValue
 
-	public static DependencyProperty VerticalScrollValueProperty { get; } = DependencyProperty.Register(
+	private static DependencyProperty VerticalScrollValueProperty { get; } = DependencyProperty.Register(
 		nameof(VerticalScrollValue),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double), OnVerticalScrollValueChanged));
 
-	public double VerticalScrollValue
+	private double VerticalScrollValue
 	{
 		get => (double)GetValue(VerticalScrollValueProperty);
 		set => SetValue(VerticalScrollValueProperty, value);
 	}
 
 	#endregion
-	#region DependencyProperty: VerticalMaxScroll
+	#region DependencyProperty: [Private] VerticalMaxScroll
 
 	/// <summary>Identifies the VerticalMaxScroll dependency property.</summary>
-	public static DependencyProperty VerticalMaxScrollProperty { get; } = DependencyProperty.Register(
+	private static DependencyProperty VerticalMaxScrollProperty { get; } = DependencyProperty.Register(
 		nameof(VerticalMaxScroll),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
 	/// <summary>Gets or sets the maximum vertical scroll limit.</summary>
-	public double VerticalMaxScroll
+	private double VerticalMaxScroll
 	{
 		get => (double)GetValue(VerticalMaxScrollProperty);
 		set => SetValue(VerticalMaxScrollProperty, value);
 	}
 
 	#endregion
-	#region DependencyProperty: VerticalMinScroll
+	#region DependencyProperty: [Private] VerticalMinScroll
 
 	/// <summary>Identifies the VerticalMinScroll dependency property.</summary>
-	public static DependencyProperty VerticalMinScrollProperty { get; } = DependencyProperty.Register(
+	private static DependencyProperty VerticalMinScrollProperty { get; } = DependencyProperty.Register(
 		nameof(VerticalMinScroll),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
 	/// <summary>Gets or sets the minimum vertical scroll limit.</summary>
-	public double VerticalMinScroll
+	private double VerticalMinScroll
 	{
 		get => (double)GetValue(VerticalMinScrollProperty);
 		set => SetValue(VerticalMinScrollProperty, value);
 	}
 
 	#endregion
-	#region DependencyProperty: VerticalZoomCenter
+	#region DependencyProperty: [Private] VerticalZoomCenter
 
 	/// <summary>Identifies the VerticalZoomCenter dependency property.</summary>
-	public static DependencyProperty VerticalZoomCenterProperty { get; } = DependencyProperty.Register(
+	private static DependencyProperty VerticalZoomCenterProperty { get; } = DependencyProperty.Register(
 		nameof(VerticalZoomCenter),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double)));
 
 	/// <summary>Gets or sets the vertical center point for zooming.</summary>
-	public double VerticalZoomCenter
+	private double VerticalZoomCenter
 	{
 		get => (double)GetValue(VerticalZoomCenterProperty);
 		set => SetValue(VerticalZoomCenterProperty, value);
 	}
 
 	#endregion
-	#region DependencyProperty: IsVerticalScrollBarVisible
+	#region DependencyProperty: [Private] IsVerticalScrollBarVisible
 
 	/// <summary>Identifies the IsVerticalScrollBarVisible dependency property.</summary>
-	public static DependencyProperty IsVerticalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
+	private static DependencyProperty IsVerticalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
 		nameof(IsVerticalScrollBarVisible),
 		typeof(bool),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(true));
 
 	/// <summary>Gets or sets a value indicating whether the vertical scrollbar is visible.</summary>
-	public bool IsVerticalScrollBarVisible
+	private bool IsVerticalScrollBarVisible
 	{
 		get => (bool)GetValue(IsVerticalScrollBarVisibleProperty);
 		set => SetValue(IsVerticalScrollBarVisibleProperty, value);
@@ -203,51 +203,51 @@ public bool IsVerticalScrollBarVisible
 
 	#endregion
 
-	#region DependencyProperty: ZoomLevel
+	#region DependencyProperty: [Private] ZoomLevel
 
 	/// <summary>Identifies the ZoomLevel dependency property.</summary>
-	public static DependencyProperty ZoomLevelProperty { get; } = DependencyProperty.Register(
+	private static DependencyProperty ZoomLevelProperty { get; } = DependencyProperty.Register(
 		nameof(ZoomLevel),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(1d, OnZoomLevelChanged));
 
 	/// <summary>Gets or sets the current zoom level.</summary>
-	public double ZoomLevel
+	private double ZoomLevel
 	{
 		get => (double)GetValue(ZoomLevelProperty);
 		set => SetValue(ZoomLevelProperty, value);
 	}
 
 	#endregion
-	#region DependencyProperty: MinZoomLevel
+	#region DependencyProperty: [Private] MinZoomLevel
 
 	/// <summary>Identifies the MinZoomLevel dependency property.</summary>
-	public static DependencyProperty MinZoomLevelProperty { get; } = DependencyProperty.Register(
+	private static DependencyProperty MinZoomLevelProperty { get; } = DependencyProperty.Register(
 		nameof(MinZoomLevel),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(default(double), OnMinZoomLevelChanged));
 
 	/// <summary>Gets or sets the minimum zoom level allowed.</summary>
-	public double MinZoomLevel
+	private double MinZoomLevel
 	{
 		get => (double)GetValue(MinZoomLevelProperty);
 		set => SetValue(MinZoomLevelProperty, value);
 	}
 
 	#endregion
-	#region DependencyProperty: MaxZoomLevel
+	#region DependencyProperty: [Private] MaxZoomLevel
 
 	/// <summary>Identifies the MaxZoomLevel dependency property.</summary>
-	public static DependencyProperty MaxZoomLevelProperty { get; } = DependencyProperty.Register(
+	private static DependencyProperty MaxZoomLevelProperty { get; } = DependencyProperty.Register(
 		nameof(MaxZoomLevel),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(10d, OnMaxZoomLevelChanged));
 
 	/// <summary>Gets or sets the maximum zoom level allowed.</summary>
-	public double MaxZoomLevel
+	private double MaxZoomLevel
 	{
 		get => (double)GetValue(MaxZoomLevelProperty);
 		set => SetValue(MaxZoomLevelProperty, value);

From 19aaee623dbcbfb2322372eda27839b70b811fa4 Mon Sep 17 00:00:00 2001
From: vatsashah45 <vatsashah45@gmail.com>
Date: Tue, 22 Oct 2024 18:06:06 -0400
Subject: [PATCH 27/30] fix: RaiseRenderedContentUpdated being called twice

---
 .../ZoomContentControl/ZoomContentControl.cs   | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index 576dfc5fe..78a2d47d5 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -145,7 +145,11 @@ private void OnAdditionalMarginChanged()
 
 	private async void OnZoomLevelChanged()
 	{
-		CoerceZoomLevel();
+		if (CoerceZoomLevel())
+		{
+			return;
+		}
+
 		UpdateScrollBars();
 		UpdateScrollVisibility();
 		await RaiseRenderedContentUpdated();
@@ -199,9 +203,17 @@ private void UpdateScrollBars()
 		}
 	}
 
-	private void CoerceZoomLevel()
+	private bool CoerceZoomLevel()
 	{
-		ZoomLevel = Math.Clamp(ZoomLevel, MinZoomLevel, MaxZoomLevel);
+		var zoomLevel = ZoomLevel;
+		var coercedZoomLevel = Math.Clamp(zoomLevel, MinZoomLevel, MaxZoomLevel);
+		if (coercedZoomLevel != zoomLevel)
+		{
+			ZoomLevel = coercedZoomLevel;
+			return true;
+		}
+
+		return false;
 	}
 
 	private void OnSizeChanged(object sender, SizeChangedEventArgs args)

From 3fbb235f9f441371fb6534dc3c7f7b82e14016f3 Mon Sep 17 00:00:00 2001
From: xiaoy312 <xiaoyao312@gmail.com>
Date: Tue, 22 Oct 2024 21:01:37 -0400
Subject: [PATCH 28/30] chore: add mouse wheel zooming

---
 .../ZoomContentControl.Properties.cs          | 34 ---------
 .../ZoomContentControl/ZoomContentControl.cs  | 72 ++++++++++++++-----
 .../ZoomContentControl.xaml                   |  6 +-
 .../Extensions/TwoDExtensions.cs              | 29 ++++++++
 4 files changed, 85 insertions(+), 56 deletions(-)
 create mode 100644 src/Uno.Toolkit.UI/Extensions/TwoDExtensions.cs

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
index 88fb70b62..c84848c82 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
@@ -100,23 +100,6 @@ private double HorizontalZoomCenter
 		set => SetValue(HorizontalZoomCenterProperty, value);
 	}
 
-	#endregion
-	#region DependencyProperty: [Private] IsHorizontalScrollBarVisible
-
-	/// <summary>Identifies the IsHorizontalScrollBarVisible dependency property.</summary>
-	private static DependencyProperty IsHorizontalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
-		nameof(IsHorizontalScrollBarVisible),
-		typeof(bool),
-		typeof(ZoomContentControl),
-		new PropertyMetadata(true));
-
-	/// <summary>Gets or sets a value indicating whether the horizontal scrollbar is visible.</summary>
-	private bool IsHorizontalScrollBarVisible
-	{
-		get => (bool)GetValue(IsHorizontalScrollBarVisibleProperty);
-		set => SetValue(IsHorizontalScrollBarVisibleProperty, value);
-	}
-
 	#endregion
 
 	#region DependencyProperty: [Private] VerticalScrollValue
@@ -184,23 +167,6 @@ private double VerticalZoomCenter
 		set => SetValue(VerticalZoomCenterProperty, value);
 	}
 
-	#endregion
-	#region DependencyProperty: [Private] IsVerticalScrollBarVisible
-
-	/// <summary>Identifies the IsVerticalScrollBarVisible dependency property.</summary>
-	private static DependencyProperty IsVerticalScrollBarVisibleProperty { get; } = DependencyProperty.Register(
-		nameof(IsVerticalScrollBarVisible),
-		typeof(bool),
-		typeof(ZoomContentControl),
-		new PropertyMetadata(true));
-
-	/// <summary>Gets or sets a value indicating whether the vertical scrollbar is visible.</summary>
-	private bool IsVerticalScrollBarVisible
-	{
-		get => (bool)GetValue(IsVerticalScrollBarVisibleProperty);
-		set => SetValue(IsVerticalScrollBarVisibleProperty, value);
-	}
-
 	#endregion
 
 	#region DependencyProperty: [Private] ZoomLevel
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index 78a2d47d5..90a76e83d 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -159,8 +159,20 @@ private void UpdateScrollVisibility()
 	{
 		if (Viewport is { } vp)
 		{
-			IsHorizontalScrollBarVisible = vp.ActualWidth < ScrollExtentWidth;
-			IsVerticalScrollBarVisible = vp.ActualHeight < ScrollExtentHeight;
+			ToggleScrollBarVisibility(_scrollH, vp.ActualWidth < ScrollExtentWidth);
+			ToggleScrollBarVisibility(_scrollV, vp.ActualWidth < ScrollExtentWidth);
+		}
+
+		void ToggleScrollBarVisibility(ScrollBar? sb, bool value)
+		{
+			if (sb is null) return;
+
+			// Showing/hiding the ScrollBar(s)could cause the ContentPresenter to move as it re-centers.
+			// This adds unnecessary complexity for the zooming logics as we need to preserve the focal point
+			// under the cursor position or the pinch center point after zooming.
+			// To avoid all that, we just make them permanently there for layout calculation.
+			sb.IsEnabled = value;
+			sb.Opacity = value ? 1 : 0;
 		}
 	}
 
@@ -271,7 +283,7 @@ private void OnPointerMoved(object sender, PointerRoutedEventArgs e)
 			var delta = context.Position - position;
 			delta.X *= -1;
 
-			ScrollValue = context.ScrollOffset + delta;
+			SetScrollValue(context.ScrollOffset + delta);
 		}
 	}
 
@@ -289,23 +301,41 @@ private void OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
 #endif
 		) return;
 
-
 		// MouseWheel + Ctrl: Zoom
 		if (e.KeyModifiers.HasFlag(Windows.System.VirtualKeyModifiers.Control))
 		{
 			if (!IsZoomAllowed) return;
 
-			return; // todo
+			var oldPosition = (p.Position - vp.ActualSize.ToPoint().DivideBy(2)) - ScrollValue.MultiplyBy(1, -1);
+			var basePosition = oldPosition.DivideBy(ZoomLevel);
+
+			var newZoom = ZoomLevel * (1 + p.Properties.MouseWheelDelta * ScaleWheelRatio);
+			//var newZoom = ZoomLevel + Math.Sign(p.Properties.MouseWheelDelta);
+			newZoom = Math.Clamp(newZoom, MinZoomLevel, MaxZoomLevel);
+
+			var newPosition = basePosition.MultiplyBy(newZoom);
+			var delta = (newPosition - oldPosition).MultiplyBy(-1, 1);
+			var offset = ScrollValue + delta;
+
+			// note: updating ZoomLevel can have side effects on ScrollValue:
+			// ZoomLevel --UpdateScrollBars-> ScrollBar.Maximum --clamp-> ScrollBar.Value --bound-> H/VScrollValue
+			// before we set the ZoomLevel, make sure to snapshot ScrollValue or finish the calculation using ScrollValue
+			ZoomLevel = newZoom;
+			SetScrollValue(offset, shouldClamp: false);
+
+			e.Handled = true;
 		}
 		// MouseWheel + Shift: Scroll Horizontally
 		// MouseWheel: Scroll Vertically
 		else
 		{
-			var delta = p.Properties.MouseWheelDelta * PanWheelRatio;
-			ScrollValue += e.KeyModifiers.HasFlag(Windows.System.VirtualKeyModifiers.Shift)
-				? new (delta, 0)
-				: new (0, -delta);
+			var magnitude = p.Properties.MouseWheelDelta * PanWheelRatio;
+			var delta = e.KeyModifiers.HasFlag(Windows.System.VirtualKeyModifiers.Shift)
+				? new Point(magnitude, 0)
+				: new Point(0, -magnitude);
+			var offset = ScrollValue + delta;
 
+			SetScrollValue(offset);
 			e.Handled = true;
 		}
 	}
@@ -337,6 +367,20 @@ public void FitToCanvas()
 		}
 	}
 
+	private void SetScrollValue(Point value, bool shouldClamp = true)
+	{
+		// we allow unconstrained panning for MouseWheelZoom(desktop) and PinchToZoom(mobile)
+		// where the focal point should remain stationary after zooming.
+		if (shouldClamp)
+		{
+			value.X = Math.Clamp(value.X, HorizontalMinScroll, HorizontalMaxScroll);
+			value.Y = Math.Clamp(value.Y, VerticalMinScroll, VerticalMaxScroll);
+		}
+
+		HorizontalScrollValue = value.X;
+		VerticalScrollValue = value.Y;
+	}
+
 	// Helper
 
 	private bool IsAllowedToWork => (IsLoaded && IsActive && _contentPresenter is not null);
@@ -345,15 +389,7 @@ public void FitToCanvas()
 
 	private FrameworkElement? Viewport => _contentGrid;
 
-	private Point ScrollValue
-	{
-		get => new Point(HorizontalScrollValue, VerticalScrollValue);
-		set
-		{
-			HorizontalScrollValue = Math.Clamp(value.X, HorizontalMinScroll, HorizontalMaxScroll);
-			VerticalScrollValue = Math.Clamp(value.Y, VerticalMinScroll, VerticalMaxScroll);
-		}
-	}
+	private Point ScrollValue => new Point(HorizontalScrollValue, VerticalScrollValue);
 
 	private double ScrollExtentWidth => (ContentWidth + AdditionalMargin.Left + AdditionalMargin.Right) * ZoomLevel;
 	private double ScrollExtentHeight => (ContentHeight + AdditionalMargin.Top + AdditionalMargin.Bottom) * ZoomLevel;
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
index 22b61e151..ad874f0f2 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
@@ -1,4 +1,4 @@
-<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 					xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 					xmlns:utu="using:Uno.Toolkit.UI">
 
@@ -19,7 +19,7 @@
 							<ColumnDefinition Width="*" />
 							<ColumnDefinition Width="Auto" />
 						</Grid.ColumnDefinitions>
-						
+
 						<Grid x:Name="PART_ContentGrid"
 								Grid.Row="0"
 								Grid.Column="0">
@@ -51,7 +51,6 @@
 								   Minimum="{TemplateBinding VerticalMinScroll}"
 								   Orientation="Vertical"
 								   SmallChange="1"
-								   Visibility="{TemplateBinding IsVerticalScrollBarVisible}"
 								   ViewportSize="{TemplateBinding ViewportHeight}"
 								   Value="{Binding VerticalScrollValue, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}" />
 						<ScrollBar x:Name="PART_ScrollH"
@@ -65,7 +64,6 @@
 								   Minimum="{TemplateBinding HorizontalMinScroll}"
 								   Orientation="Horizontal"
 								   SmallChange="1"
-								   Visibility="{TemplateBinding IsHorizontalScrollBarVisible}"
 								   ViewportSize="{TemplateBinding ViewportWidth}"
 								   Value="{Binding HorizontalScrollValue, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}" />
 					</Grid>
diff --git a/src/Uno.Toolkit.UI/Extensions/TwoDExtensions.cs b/src/Uno.Toolkit.UI/Extensions/TwoDExtensions.cs
new file mode 100644
index 000000000..4033cf7f8
--- /dev/null
+++ b/src/Uno.Toolkit.UI/Extensions/TwoDExtensions.cs
@@ -0,0 +1,29 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Numerics;
+using System.Text;
+using System.Threading.Tasks;
+using Windows.Foundation;
+using Windows.UI.WebUI;
+
+namespace Uno.Toolkit.UI;
+
+internal static partial class TwoDExtensions // Point Mathematics
+{
+	public static Point ToPoint(this Size x) => new Point(x.Width, x.Height);
+	public static Point ToPoint(this Vector2 x) => new Point(x.X, x.Y);
+
+	public static Point MultiplyBy(this Point x, double scale) => new Point(x.X * scale, x.Y * scale);
+	public static Point MultiplyBy(this Point x, double scaleX, double scaleY) => new Point(x.X * scaleX, x.Y * scaleY);
+	public static Point DivideBy(this Point x, double scale) => new Point(x.X / scale, x.Y / scale);
+}
+
+internal static partial class TwoDExtensions // Size Mathematics
+{
+	public static Size ToSize(this Point x) => new Size(x.X, x.Y);
+	public static Size ToSize(this Vector2 x) => new Size(x.X, x.Y);
+
+	public static Size MultiplyBy(this Size x, double scale) => new Size(x.Width * scale, x.Height * scale);
+	public static Size DivideBy(this Size x, double scale) => new Size(x.Width / scale, x.Height / scale);
+}

From beb4d12a44eb6ee1d0a45ec2b3b771a7f2098c6b Mon Sep 17 00:00:00 2001
From: xiaoy312 <xiaoyao312@gmail.com>
Date: Tue, 22 Oct 2024 21:37:45 -0400
Subject: [PATCH 29/30] chore: bugfixes

---
 doc/controls/ZoomContentControl.md            | 37 +++++++------
 .../ZoomContentControlSamplePage.xaml         |  4 +-
 .../ZoomContentControl.Properties.cs          | 55 ++++---------------
 .../ZoomContentControl/ZoomContentControl.cs  | 31 +++++++----
 .../ZoomContentControl.xaml                   |  2 -
 5 files changed, 51 insertions(+), 78 deletions(-)

diff --git a/doc/controls/ZoomContentControl.md b/doc/controls/ZoomContentControl.md
index c501da467..b8c95813e 100644
--- a/doc/controls/ZoomContentControl.md
+++ b/doc/controls/ZoomContentControl.md
@@ -41,27 +41,28 @@ xmlns:utu="using:Uno.Toolkit.UI"
 
 ### Constructors
 
-| Constructor| Description|
-|----------------|-------------------------------------------------------|
-| `ZoomContentControl()`|Initializes a new instance of the `ZoomContentControl` class.|
+| Constructor            | Description                                                   |
+| ---------------------- | ------------------------------------------------------------- |
+| `ZoomContentControl()` | Initializes a new instance of the `ZoomContentControl` class. |
 
 ### Properties
 
-| Property| Type | Description |
-|-|-|-|
-| `IsZoomAllowed` | `bool` | Gets or sets a value indicating whether zooming is allowed. |
-| `ScaleWheelRatio` | `double` | Gets or sets the ratio for scaling zoom level when using a mouse wheel. |
-| `PanWheelRatio` | `double` | Gets or sets the ratio for panning when using a mouse wheel. |
-| `IsPanAllowed` | `bool` | Gets or sets a value indicating whether panning is allowed. |
-| `ViewportWidth` | `bool` | Gets or sets the width of the content's viewport. |
-| `ViewportHeight` | `bool` | Gets or sets the height of the content's viewport. |
-| `IsActive` | `bool` | Gets or sets a value indicating whether the control is active. |
-| `AutoFitToCanvas` | `bool` | Determines if the content should automatically fit into the available canvas when the control resizes. |
-| `AdditionalMargin` | `Thickness` | Gets or sets additional margins around the content. |
+| Property           | Type        | Description                                                                                            |
+| ------------------ | ----------- | ------------------------------------------------------------------------------------------------------ |
+| `ZoomLevel`        | `double`    | Gets or sets the current zoom level for the content.                                                   |
+| `MinZoomLevel`     | `double`    | Gets or sets the minimum zoom level allowed for the content.                                           |
+| `MaxZoomLevel`     | `double`    | Gets or sets the maximum zoom level allowed for the content.                                           |
+| `IsZoomAllowed`    | `bool`      | Gets or sets a value indicating whether zooming is allowed.                                            |
+| `ScaleWheelRatio`  | `double`    | Gets or sets the ratio for scaling zoom level when using a mouse wheel.                                |
+| `PanWheelRatio`    | `double`    | Gets or sets the ratio for panning when using a mouse wheel.                                           |
+| `IsPanAllowed`     | `bool`      | Gets or sets a value indicating whether panning is allowed.                                            |
+| `IsActive`         | `bool`      | Gets or sets a value indicating whether the control is active.                                         |
+| `AutoFitToCanvas`  | `bool`      | Determines if the content should automatically fit into the available canvas when the control resizes. |
+| `AdditionalMargin` | `Thickness` | Gets or sets additional margins around the content.                                                    |
 
 ### Methods
 
-| Method| Return Type| Description|
-|-----------------------|------------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| `FitToCanvas()`| `void`| Adjust the zoom level so that the content fits within the available space.|
-| `ResetViewport()`| `void`| Resets the zoom level and panning offset to their default values and centers the content.|
+| Method            | Return Type | Description                                                                               |
+| ----------------- | ----------- | ----------------------------------------------------------------------------------------- |
+| `FitToCanvas()`   | `void`      | Adjust the zoom level so that the content fits within the available space.                |
+| `ResetViewport()` | `void`      | Resets the zoom level and panning offset to their default values and centers the content. |
diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
index ebe4b8310..b0bdca11c 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/ZoomContentControlSamplePage.xaml
@@ -20,9 +20,9 @@
 												Height="300"
 												HorizontalAlignment="Center"
 												VerticalAlignment="Center"
-												ZoomLevel="1.5"
+												ZoomLevel="1"
 												MinZoomLevel="0.5"
-												MaxZoomLevel="3.0"
+												MaxZoomLevel="10"
 												IsZoomAllowed="True"
 												IsPanAllowed="True">
 								<Border BorderThickness="2"
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
index c84848c82..2e39473db 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.Properties.cs
@@ -169,51 +169,51 @@ private double VerticalZoomCenter
 
 	#endregion
 
-	#region DependencyProperty: [Private] ZoomLevel
+	#region DependencyProperty: ZoomLevel
 
 	/// <summary>Identifies the ZoomLevel dependency property.</summary>
-	private static DependencyProperty ZoomLevelProperty { get; } = DependencyProperty.Register(
+	public static DependencyProperty ZoomLevelProperty { get; } = DependencyProperty.Register(
 		nameof(ZoomLevel),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(1d, OnZoomLevelChanged));
 
 	/// <summary>Gets or sets the current zoom level.</summary>
-	private double ZoomLevel
+	public double ZoomLevel
 	{
 		get => (double)GetValue(ZoomLevelProperty);
 		set => SetValue(ZoomLevelProperty, value);
 	}
 
 	#endregion
-	#region DependencyProperty: [Private] MinZoomLevel
+	#region DependencyProperty: MinZoomLevel
 
 	/// <summary>Identifies the MinZoomLevel dependency property.</summary>
-	private static DependencyProperty MinZoomLevelProperty { get; } = DependencyProperty.Register(
+	public static DependencyProperty MinZoomLevelProperty { get; } = DependencyProperty.Register(
 		nameof(MinZoomLevel),
 		typeof(double),
 		typeof(ZoomContentControl),
-		new PropertyMetadata(default(double), OnMinZoomLevelChanged));
+		new PropertyMetadata(1d, OnMinZoomLevelChanged));
 
 	/// <summary>Gets or sets the minimum zoom level allowed.</summary>
-	private double MinZoomLevel
+	public double MinZoomLevel
 	{
 		get => (double)GetValue(MinZoomLevelProperty);
 		set => SetValue(MinZoomLevelProperty, value);
 	}
 
 	#endregion
-	#region DependencyProperty: [Private] MaxZoomLevel
+	#region DependencyProperty: MaxZoomLevel
 
 	/// <summary>Identifies the MaxZoomLevel dependency property.</summary>
-	private static DependencyProperty MaxZoomLevelProperty { get; } = DependencyProperty.Register(
+	public static DependencyProperty MaxZoomLevelProperty { get; } = DependencyProperty.Register(
 		nameof(MaxZoomLevel),
 		typeof(double),
 		typeof(ZoomContentControl),
 		new PropertyMetadata(10d, OnMaxZoomLevelChanged));
 
 	/// <summary>Gets or sets the maximum zoom level allowed.</summary>
-	private double MaxZoomLevel
+	public double MaxZoomLevel
 	{
 		get => (double)GetValue(MaxZoomLevelProperty);
 		set => SetValue(MaxZoomLevelProperty, value);
@@ -290,41 +290,6 @@ public bool IsPanAllowed
 
 	#endregion
 
-	#region DependencyProperty: ViewportWidth
-
-	/// <summary>Identifies the ViewportWidth dependency property.</summary>
-	public static DependencyProperty ViewportWidthProperty { get; } = DependencyProperty.Register(
-		nameof(ContentWidth),
-		typeof(double),
-		typeof(ZoomContentControl),
-		new PropertyMetadata(default(double)));
-
-	/// <summary>Gets or sets the width of the viewport.</summary>
-	public double ContentWidth
-	{
-		get => (double)GetValue(ViewportWidthProperty);
-		set => SetValue(ViewportWidthProperty, value);
-	}
-
-	#endregion
-	#region DependencyProperty: ViewportHeight
-
-	/// <summary>Identifies the ViewportHeight dependency property.</summary>
-	public static DependencyProperty ViewportHeightProperty { get; } = DependencyProperty.Register(
-		nameof(ContentHeight),
-		typeof(double),
-		typeof(ZoomContentControl),
-		new PropertyMetadata(default(double)));
-
-	/// <summary>Gets or sets the height of the viewport.</summary>
-	public double ContentHeight
-	{
-		get => (double)GetValue(ViewportHeightProperty);
-		set => SetValue(ViewportHeightProperty, value);
-	}
-
-	#endregion
-
 	#region DependencyProperty: IsActive
 
 	/// <summary>Identifies the IsActive dependency property.</summary>
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index 90a76e83d..f2a77770e 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -61,6 +61,7 @@ private static class TemplateParts
 
 	private (uint Id, Point Position, Point ScrollOffset)? _capturedPointerContext;
 	private SerialDisposable _contentSubscriptions = new();
+	private Size _contentSize;
 
 	public ZoomContentControl()
 	{
@@ -113,12 +114,12 @@ void OnContentLoaded(object sender, RoutedEventArgs e)
 		}
 		void OnContentSizeChanged(object sender, SizeChangedEventArgs e)
 		{
-			ContentWidth = fe.ActualWidth;
-			ContentHeight = fe.ActualHeight;
-			HorizontalZoomCenter = ContentWidth / 2;
-			VerticalZoomCenter = ContentHeight / 2;
+			_contentSize = new Size(fe.ActualWidth, fe.ActualHeight);
+			HorizontalZoomCenter = _contentSize.Width / 2;
+			VerticalZoomCenter = _contentSize.Height / 2;
 
 			UpdateScrollBars();
+			UpdateScrollVisibility();
 		}
 	}
 
@@ -160,7 +161,7 @@ private void UpdateScrollVisibility()
 		if (Viewport is { } vp)
 		{
 			ToggleScrollBarVisibility(_scrollH, vp.ActualWidth < ScrollExtentWidth);
-			ToggleScrollBarVisibility(_scrollV, vp.ActualWidth < ScrollExtentWidth);
+			ToggleScrollBarVisibility(_scrollV, vp.ActualHeight < ScrollExtentHeight);
 		}
 
 		void ToggleScrollBarVisibility(ScrollBar? sb, bool value)
@@ -206,10 +207,18 @@ private void UpdateScrollBars()
 	{
 		if (Viewport is { } vp)
 		{
-			HorizontalMinScroll = VerticalMinScroll = 0;
-
-			HorizontalMaxScroll = Math.Max(0, ScrollExtentWidth - vp.ActualWidth);
-			VerticalMaxScroll = Math.Max(0, ScrollExtentHeight - vp.ActualHeight);
+			var scrollableWidth = Math.Max(0, ScrollExtentWidth - vp.ActualWidth);
+			var scrollableHeight = Math.Max(0, ScrollExtentHeight - vp.ActualHeight);
+
+			// since the content is always centered, we need to able to scroll both way equally:
+			// [Content-Content-Content]
+			// [=======[Viewport]======]
+			HorizontalMaxScroll = scrollableWidth / 2;
+			HorizontalMinScroll = -HorizontalMaxScroll;
+			VerticalMaxScroll = scrollableHeight / 2;
+			VerticalMinScroll = -VerticalMaxScroll;
+
+			// update size of thumb
 			if (_scrollH is { }) _scrollH.ViewportSize = vp.ActualWidth;
 			if (_scrollV is { }) _scrollV.ViewportSize = vp.ActualHeight;
 		}
@@ -391,6 +400,6 @@ private void SetScrollValue(Point value, bool shouldClamp = true)
 
 	private Point ScrollValue => new Point(HorizontalScrollValue, VerticalScrollValue);
 
-	private double ScrollExtentWidth => (ContentWidth + AdditionalMargin.Left + AdditionalMargin.Right) * ZoomLevel;
-	private double ScrollExtentHeight => (ContentHeight + AdditionalMargin.Top + AdditionalMargin.Bottom) * ZoomLevel;
+	private double ScrollExtentWidth => (_contentSize.Width + AdditionalMargin.Left + AdditionalMargin.Right) * ZoomLevel;
+	private double ScrollExtentHeight => (_contentSize.Height + AdditionalMargin.Top + AdditionalMargin.Bottom) * ZoomLevel;
 }
diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
index ad874f0f2..ed43d5201 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.xaml
@@ -51,7 +51,6 @@
 								   Minimum="{TemplateBinding VerticalMinScroll}"
 								   Orientation="Vertical"
 								   SmallChange="1"
-								   ViewportSize="{TemplateBinding ViewportHeight}"
 								   Value="{Binding VerticalScrollValue, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}" />
 						<ScrollBar x:Name="PART_ScrollH"
 								   Grid.Row="1"
@@ -64,7 +63,6 @@
 								   Minimum="{TemplateBinding HorizontalMinScroll}"
 								   Orientation="Horizontal"
 								   SmallChange="1"
-								   ViewportSize="{TemplateBinding ViewportWidth}"
 								   Value="{Binding HorizontalScrollValue, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}" />
 					</Grid>
 				</ControlTemplate>

From 4f68669c2d32232786acb289875f7cc36dee9b19 Mon Sep 17 00:00:00 2001
From: xiaoy312 <xiaoyao312@gmail.com>
Date: Wed, 23 Oct 2024 16:42:02 -0400
Subject: [PATCH 30/30] chore: fix build

---
 .../ZoomContentControl/ZoomContentControl.cs       | 14 ++++++++------
 src/Uno.Toolkit.UI/Extensions/TwoDExtensions.cs    | 14 +++++++++++++-
 2 files changed, 21 insertions(+), 7 deletions(-)

diff --git a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
index f2a77770e..064627e0b 100644
--- a/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
+++ b/src/Uno.Toolkit.UI/Controls/ZoomContentControl/ZoomContentControl.cs
@@ -289,10 +289,10 @@ private void OnPointerMoved(object sender, PointerRoutedEventArgs e)
 		if (_capturedPointerContext is { } context)
 		{
 			var position = e.GetCurrentPoint(this).Position;
-			var delta = context.Position - position;
+			var delta = context.Position.Subtract(position);
 			delta.X *= -1;
 
-			SetScrollValue(context.ScrollOffset + delta);
+			SetScrollValue(context.ScrollOffset.Add(delta));
 		}
 	}
 
@@ -315,7 +315,9 @@ private void OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
 		{
 			if (!IsZoomAllowed) return;
 
-			var oldPosition = (p.Position - vp.ActualSize.ToPoint().DivideBy(2)) - ScrollValue.MultiplyBy(1, -1);
+			var oldPosition = p.Position
+				.Subtract(vp.ActualSize.ToPoint().DivideBy(2))
+				.Subtract(ScrollValue.MultiplyBy(1, -1));
 			var basePosition = oldPosition.DivideBy(ZoomLevel);
 
 			var newZoom = ZoomLevel * (1 + p.Properties.MouseWheelDelta * ScaleWheelRatio);
@@ -323,8 +325,8 @@ private void OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
 			newZoom = Math.Clamp(newZoom, MinZoomLevel, MaxZoomLevel);
 
 			var newPosition = basePosition.MultiplyBy(newZoom);
-			var delta = (newPosition - oldPosition).MultiplyBy(-1, 1);
-			var offset = ScrollValue + delta;
+			var delta = (newPosition.Subtract(oldPosition)).MultiplyBy(-1, 1);
+			var offset = ScrollValue.Add(delta);
 
 			// note: updating ZoomLevel can have side effects on ScrollValue:
 			// ZoomLevel --UpdateScrollBars-> ScrollBar.Maximum --clamp-> ScrollBar.Value --bound-> H/VScrollValue
@@ -342,7 +344,7 @@ private void OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
 			var delta = e.KeyModifiers.HasFlag(Windows.System.VirtualKeyModifiers.Shift)
 				? new Point(magnitude, 0)
 				: new Point(0, -magnitude);
-			var offset = ScrollValue + delta;
+			var offset = ScrollValue.Add(delta);
 
 			SetScrollValue(offset);
 			e.Handled = true;
diff --git a/src/Uno.Toolkit.UI/Extensions/TwoDExtensions.cs b/src/Uno.Toolkit.UI/Extensions/TwoDExtensions.cs
index 4033cf7f8..855975380 100644
--- a/src/Uno.Toolkit.UI/Extensions/TwoDExtensions.cs
+++ b/src/Uno.Toolkit.UI/Extensions/TwoDExtensions.cs
@@ -1,4 +1,8 @@
-using System;
+#if !HAS_UNO
+#define MISSING_POINT_ARITHMETICS
+#endif
+
+using System;
 using System.Collections.Generic;
 using System.Linq;
 using System.Numerics;
@@ -14,6 +18,13 @@ internal static partial class TwoDExtensions // Point Mathematics
 	public static Point ToPoint(this Size x) => new Point(x.Width, x.Height);
 	public static Point ToPoint(this Vector2 x) => new Point(x.X, x.Y);
 
+#if MISSING_POINT_ARITHMETICS
+	public static Point Add(this Point x, Point y) => new Point(x.X + y.X, x.Y + y.Y);
+	public static Point Subtract(this Point x, Point y) => new Point(x.X - y.X, x.Y - y.Y);
+#else
+	public static Point Add(this Point x, Point y) => x + y;
+	public static Point Subtract(this Point x, Point y) => x - y;
+#endif
 	public static Point MultiplyBy(this Point x, double scale) => new Point(x.X * scale, x.Y * scale);
 	public static Point MultiplyBy(this Point x, double scaleX, double scaleY) => new Point(x.X * scaleX, x.Y * scaleY);
 	public static Point DivideBy(this Point x, double scale) => new Point(x.X / scale, x.Y / scale);
@@ -25,5 +36,6 @@ internal static partial class TwoDExtensions // Size Mathematics
 	public static Size ToSize(this Vector2 x) => new Size(x.X, x.Y);
 
 	public static Size MultiplyBy(this Size x, double scale) => new Size(x.Width * scale, x.Height * scale);
+	public static Size MultiplyBy(this Size x, double scaleX, double scaleY) => new Size(x.Width * scaleX, x.Width * scaleY);
 	public static Size DivideBy(this Size x, double scale) => new Size(x.Width / scale, x.Height / scale);
 }