[FancyZones] Feature to create zone layouts spanning multiple monitors (#5289)

* Added the setting

* Added a property to Editor Settings

This will be used later

* Fixed a bug in the previous commit

* Simplified a method

* Added snapping points to the editor

* Simplified a method in ZoneSet

* Updated ZoneSet testcases

* Add a method to FancyZones / ZoneWindowHost

* Almost works

* The editor now launches, but FZ does not understand the results

* Refactored some code

* Snapping to a zone by dragging seems to work

* Hotkeys seem to work

* Refresh the work area handler after changing settings

* Fixed zones not snapping to monitor edges when moved

* Remove unused method in FancyZones.h

* Fixed an issue with DPI awareness

* Renamed setting to spanZonesAcrossMonitors

* Renamed a function

* Fixed a bug with the magnetic effect

* Fix restoring window positions on layout changes

src/core/Microsoft.PowerToys.Settings.UI.Lib/FZConfigProperties.cs

@@ -24,6 +24,7 @@ namespace Microsoft.PowerToys.Settings.UI.Lib
             FancyzonesRestoreSize = new BoolProperty();
             UseCursorposEditorStartupscreen = new BoolProperty(ConfigDefaults.DefaultUseCursorposEditorStartupscreen);
             FancyzonesShowOnAllMonitors = new BoolProperty();
+            FancyzonesSpanZonesAcrossMonitors = new BoolProperty();
             FancyzonesZoneHighlightColor = new StringProperty(ConfigDefaults.DefaultFancyZonesZoneHighlightColor);
             FancyzonesHighlightOpacity = new IntProperty(50);
             FancyzonesEditorHotkey = new KeyboardKeysProperty(DefaultHotkeyValue);
@@ -66,6 +67,9 @@ namespace Microsoft.PowerToys.Settings.UI.Lib
         [JsonPropertyName("fancyzones_show_on_all_monitors")]
         public BoolProperty FancyzonesShowOnAllMonitors { get; set; }
 
+        [JsonPropertyName("fancyzones_span_zones_across_monitors")]
+        public BoolProperty FancyzonesSpanZonesAcrossMonitors { get; set; }
+
         [JsonPropertyName("fancyzones_makeDraggedWindowTransparent")]
         public BoolProperty FancyzonesMakeDraggedWindowTransparent { get; set; }
 

src/core/Microsoft.PowerToys.Settings.UI/Strings/en-us/Resources.resw

@@ -417,7 +417,7 @@
   <data name="FileExplorerPreview_ToggleSwitch_Preview_SVG.Header" xml:space="preserve">
     <value>Enable SVG (.svg) preview</value>
   </data>
-    <data name="FileExplorerPreview_ToggleSwitch_SVG_Thumbnail.Header" xml:space="preserve">
+  <data name="FileExplorerPreview_ToggleSwitch_SVG_Thumbnail.Header" xml:space="preserve">
     <value>Enable SVG (.svg) thumbnails</value>
   </data>
   <data name="FileExplorerPreview_Description.Text" xml:space="preserve">
@@ -642,4 +642,7 @@
   <data name="About_PowerToys.Text" xml:space="preserve">
     <value>Microsoft PowerToys is a set of utilities for power users to tune and streamline their Windows experience for greater productivity</value>
   </data>
+  <data name="FancyZones_SpanZonesAcrossMonitorsCheckBoxControl.Content" xml:space="preserve">
+    <value>Allow zones to span across monitors</value>
+  </data>
 </root>

src/core/Microsoft.PowerToys.Settings.UI/ViewModels/FancyZonesViewModel.cs

@@ -45,11 +45,11 @@ namespace Microsoft.PowerToys.Settings.UI.ViewModels
             _restoreSize = Settings.Properties.FancyzonesRestoreSize.Value;
             _useCursorPosEditorStartupScreen = Settings.Properties.UseCursorposEditorStartupscreen.Value;
             _showOnAllMonitors = Settings.Properties.FancyzonesShowOnAllMonitors.Value;
+            _spanZonesAcrossMonitors = Settings.Properties.FancyzonesSpanZonesAcrossMonitors.Value;
             _makeDraggedWindowTransparent = Settings.Properties.FancyzonesMakeDraggedWindowTransparent.Value;
             _highlightOpacity = Settings.Properties.FancyzonesHighlightOpacity.Value;
             _excludedApps = Settings.Properties.FancyzonesExcludedApps.Value;
             EditorHotkey = Settings.Properties.FancyzonesEditorHotkey.Value;
-
             string inactiveColor = Settings.Properties.FancyzonesInActiveColor.Value;
             _zoneInActiveColor = inactiveColor != string.Empty ? inactiveColor.ToColor() : "#F5FCFF".ToColor();
 
@@ -82,6 +82,7 @@ namespace Microsoft.PowerToys.Settings.UI.ViewModels
         private bool _zoneSetChangeMoveWindows;
         private bool _appLastZoneMoveWindows;
         private bool _openWindowOnActiveMonitor;
+        private bool _spanZonesAcrossMonitors;
         private bool _restoreSize;
         private bool _useCursorPosEditorStartupScreen;
         private bool _showOnAllMonitors;
@@ -314,6 +315,24 @@ namespace Microsoft.PowerToys.Settings.UI.ViewModels
             }
         }
 
+        public bool SpanZonesAcrossMonitors
+        {
+            get
+            {
+                return _spanZonesAcrossMonitors;
+            }
+
+            set
+            {
+                if (value != _spanZonesAcrossMonitors)
+                {
+                    _spanZonesAcrossMonitors = value;
+                    Settings.Properties.FancyzonesSpanZonesAcrossMonitors.Value = value;
+                    RaisePropertyChanged();
+                }
+            }
+        }
+
         public bool MakeDraggedWindowsTransparent
         {
             get

src/core/Microsoft.PowerToys.Settings.UI/Views/FancyZonesPage.xaml

@@ -150,6 +150,11 @@
                       Margin="{StaticResource SmallTopMargin}"
                       IsEnabled="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled}"/>
 
+            <CheckBox x:Uid="FancyZones_SpanZonesAcrossMonitorsCheckBoxControl"
+                      IsChecked="{x:Bind Mode=TwoWay, Path=ViewModel.SpanZonesAcrossMonitors}"
+                      Margin="{StaticResource SmallTopMargin}"
+                      IsEnabled="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled}"/>
+
             <CheckBox x:Uid="FancyZones_MakeDraggedWindowTransparentCheckBoxControl"
                       IsChecked="{x:Bind Mode=TwoWay, Path=ViewModel.MakeDraggedWindowsTransparent}"
                       Margin="{StaticResource SmallTopMargin}"

src/core/Microsoft.PowerToys.Settings.UnitTest/ViewModelTests/FancyZones.cs

@@ -266,6 +266,24 @@ namespace ViewModelTests
             viewModel.ShowOnAllMonitors = true;
         }
 
+        [TestMethod]
+        public void SpanZonesAcrossMonitors_ShouldSetValue2True_WhenSuccessful()
+        {
+            // arrange
+            FancyZonesViewModel viewModel = new FancyZonesViewModel();
+            Assert.IsFalse(viewModel.SpanZonesAcrossMonitors); // check if value was initialized to false.
+
+            // Assert
+            ShellPage.DefaultSndMSGCallback = msg =>
+            {
+                FancyZonesSettingsIPCMessage snd = JsonSerializer.Deserialize<FancyZonesSettingsIPCMessage>(msg);
+                Assert.IsTrue(snd.Powertoys.FancyZones.Properties.FancyzonesSpanZonesAcrossMonitors.Value);
+            };
+
+            // act
+            viewModel.SpanZonesAcrossMonitors = true;
+        }
+
         [TestMethod]
         public void ZoneHighlightColor_ShouldSetColorValue2White_WhenSuccessful()
         {