Merge pull request #655 from unoplatform/dev/ICSI/654-Fix-Zoom-Messing-Offset

Fix Zoom

Author: nickrandolph

UI/PhotoViewer/InteractionControls/ZoomContentControl.cs

@@ -7,14 +7,18 @@
 
 namespace InteractionControls;
 
+[TemplatePart(Name = "PART_Grid", Type = typeof(Grid))]
 [TemplatePart(Name = "PART_Presenter", Type = typeof(ContentPresenter))]
 [TemplatePart(Name = "PART_scrollV", Type = typeof(ScrollBar))]
 [TemplatePart(Name = "PART_scrollH", Type = typeof(ScrollBar))]
 public partial class ZoomContentControl : ContentControl
 {
+    private Grid? _grid;
     private ContentPresenter? _presenter;
     private ScrollBar? _scrollV;
     private ScrollBar? _scrollH;
+    private Canvas _canvas = new Canvas();
+
     private bool IsAllowedToWork => (IsEnabled && IsActive && _presenter is not null);
 
     public bool ResetWhenNotActive { get; set; } = true;
@@ -157,16 +161,19 @@ 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);
@@ -190,6 +197,7 @@ public double ViewPortHeight
         get => (double)GetValue(ViewPortHeightProperty);
         set => SetValue(ViewPortHeightProperty, value);
     }
+
     public double ViewPortWidth
     {
         get => (double)GetValue(ViewPortWidthProperty);
@@ -205,7 +213,7 @@ private void RegisterPropertyHandlers()
         RegisterPropertyChangedCallback(MinZoomLevelProperty, CoerceZoomLevel);
         RegisterPropertyChangedCallback(MaxZoomLevelProperty, CoerceZoomLevel);
 
-        RegisterPropertyChangedCallback(ZoomLevelProperty, (s, e) => { UpdateScrollLimits(); });
+        RegisterPropertyChangedCallback(ZoomLevelProperty, (s, e) => UpdateScrollLimits());
 
         RegisterPropertyChangedCallback(HorizontalOffsetProperty, UpdateVerticalScrollBarValue);
         RegisterPropertyChangedCallback(VerticalOffsetProperty, UpdateHorizontalScrollBarValue);
@@ -234,6 +242,26 @@ private void IsActiveChanged(DependencyObject sender, DependencyProperty dp)
         {
             _scrollV.Visibility = IsActive ? Visibility.Visible : Visibility.Collapsed;
         }
+
+        if (_grid is not null)
+        {
+            if (IsActive)
+            {
+                _grid.Children.Remove(_presenter);
+                _grid.Children.Add(_canvas);
+                _canvas.Children.Add(_presenter);
+                Grid.SetRow(_canvas, 0);
+                Grid.SetColumn(_canvas, 0);
+            }
+            else
+            {
+                _canvas.Children.Remove(_presenter);
+                _grid.Children.Remove(_canvas);
+                _grid.Children.Add(_presenter);
+                Grid.SetRow(_presenter, 0);
+                Grid.SetColumn(_presenter, 0);
+            }
+        }
     }
 
     private void UpdateScrollLimits()
@@ -273,6 +301,7 @@ public ZoomContentControl()
 
     protected override void OnApplyTemplate()
     {
+        _grid = GetTemplateChild("PART_Grid") as Grid;
         _presenter = GetTemplateChild("PART_Presenter") as ContentPresenter;
         _scrollV = GetTemplateChild("PART_scrollV") as ScrollBar;
         _scrollH = GetTemplateChild("PART_scrollH") as ScrollBar;
@@ -284,31 +313,26 @@ protected override void OnApplyTemplate()
         RegisterPointerHandlers();
     }
     #region ScrollBars Events
+
     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;
+            _scrollV.Scroll += ScrollV_Scroll;
         }
 
         if (_scrollH is not null)
         {
-            _scrollH.Scroll += _scrollH_Scroll;
+            _scrollH.Scroll += ScrollH_Scroll;
         }
     }
 
-    private void _scrollV_Scroll(object sender, ScrollEventArgs e)
-    {
-        //TemplateBinding doesn't support TwoWay mode. We need to manually update the values
-        VerticalOffset = -1 * e.NewValue;
-    }
+    //TemplateBinding doesn't support TwoWay mode. We need to manually update the values
+    private void ScrollV_Scroll(object sender, ScrollEventArgs e) => VerticalOffset = -1 * e.NewValue;
+
+    private void ScrollH_Scroll(object sender, ScrollEventArgs e) => HorizontalOffset = -1 * e.NewValue;
 
-    private void _scrollH_Scroll(object sender, ScrollEventArgs e)
-    {
-        //TemplateBinding doesn't support TwoWay mode. We need to manually update the values
-        HorizontalOffset = -1 * e.NewValue;
-    }
     #endregion
 
     private uint _capturedPointerId;
@@ -390,7 +414,7 @@ private void OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
             return; // Don't handle the event when the control is disabled.
         }
 
-        var pointerPoint = e.GetCurrentPoint(_presenter);
+        var pointerPoint = e.GetCurrentPoint(this);
         var pointerProperties = pointerPoint.Properties;
         var pointerPosition = pointerPoint.Position;
 
@@ -410,14 +434,7 @@ private void OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
         {
             e.Handled = true;
 
-            var hzc = HorizontalZoomCenter;
-            var vzc = VerticalZoomCenter;
-            var newPointerPosX = ((pointerPosition.X - hzc) * changeRatio) + hzc;
-            var newPointerPosY = ((pointerPosition.Y - vzc) * changeRatio) + vzc;
-
             ZoomLevel *= changeRatio;
-            HorizontalOffset += newPointerPosX - pointerPosition.X;
-            VerticalOffset += newPointerPosY - pointerPosition.Y;
             HorizontalZoomCenter = pointerPosition.X;
             VerticalZoomCenter = pointerPosition.Y;
             return;
@@ -451,4 +468,10 @@ public void ResetOffset()
         HorizontalOffset = 0;
         VerticalOffset = 0;
     }
+
+    public void Centralize()
+    {
+        HorizontalOffset = (ActualWidth / 2) - (ViewPortWidth / 2);
+        VerticalOffset = (ActualHeight / 2) - (ViewPortHeight / 2);
+    }
 }

UI/PhotoViewer/InteractionControls/ZoomContentControl.xaml

@@ -7,7 +7,7 @@
 		<Setter Property="Template">
 			<Setter.Value>
 				<ControlTemplate TargetType="ctl:ZoomContentControl">
-					<Grid>
+					<Grid x:Name="PART_Grid">
 						<Grid.RowDefinitions>
 							<RowDefinition Height="*" />
 							<RowDefinition Height="Auto" />
@@ -16,25 +16,23 @@
 							<ColumnDefinition Width="*" />
 							<ColumnDefinition Width="Auto" />
 						</Grid.ColumnDefinitions>
-						<Border
+						<ContentPresenter
+							x:Name="PART_Presenter"
 							Grid.Row="0"
 							Grid.Column="0"
-							Background="{TemplateBinding Background}">
-							<ContentPresenter
-								x:Name="PART_Presenter"
-								Margin="{TemplateBinding Padding}"
-								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>
-						</Border>
+							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>
 						<!--  Vertical ScrollBar  -->
 						<ScrollBar
 							x:Name="PART_scrollV"
@@ -49,6 +47,7 @@
 							Orientation="Vertical"
 							SmallChange="1"
 							ViewportSize="{TemplateBinding ViewPortHeight}"
+							Visibility="{TemplateBinding IsActive}"
 							Value="{TemplateBinding VerticalScrollValue}" />
 						<!--  Horizontal ScrollBar  -->
 						<ScrollBar
@@ -64,6 +63,7 @@
 							Orientation="Horizontal"
 							SmallChange="1"
 							ViewportSize="{TemplateBinding ViewPortWidth}"
+							Visibility="{TemplateBinding IsActive}"
 							Value="{TemplateBinding HorizontalScrollValue}" />
 					</Grid>
 				</ControlTemplate>