Fancy Zones - Multiple Layouts Available while holding shift

[zurie]

Description of the new feature / enhancement

When using fancy zones you are locked into one specific layout. You can obviously drag and drop in the gutter of a layout to access both (like if you had a ultra wide with a 4 column view you could access 2 of the 4 columns with the gutter) but what is missing is other specific layouts like (4 square grid) or 25 / 75, etc... What would be nice is to be able to drag to a specific area (like the very top bar of the screen) and a sidebar (topbar) slides down which has your layouts where you can mouse over and it changes to that layout (while still holding shift), which opens up basically "every" layout without having to let go of the window and without having to individually go back in and select a new layout. Would be nice to be able to do this while continuing to hold down shift and drag the window so you don't need any additional input or any additional toggles. It should all work based on hover and time over the button.

Example:

Hold shift, grab a window. Fancy zones shows up with a layout.
while holding shift, drag the window to the very top of the screen, hold for a few seconds, and the top pane slides down showing your multiple custom views. while holding shift, mouse over one of those layouts and pause for a few seconds, and that layout loads. while continuing to hold shift, drag the window to the new area and let go and it will snap to that fancy zone..

Scenario when this would be used?

This would be useful when switching workflows. IE: Youtube vs IDE Development. or Game Development vs Web Development. Web or Application Dev would be mostly dual column or triple columns where general desktop (like web, email, teams, etc would be more of a 4 up grid layout).

Supporting information

No response

[similar-issues-ai]

We've found some similar issues:

• [FancyZones] Cycle through multiple layouts when pressing [Shift + 1, 2, 3..]/[Secondary click followed by 1, 2, 3...] #21277 , similarity score: 85%
• Multiple Fancy Zone Layouts, Activated Based on Different Activation Shortcuts #26725 , similarity score: 84%
• FancyZones: while left click dragging window + holding shift to view zones, allow right click to switch between layouts #16754 , similarity score: 82%
• Feature: FancyZones - Grid Snapping - Easily resize windows into pixel-perfect layouts #16644 , similarity score: 82%
• FancyZones layouts #20432 , similarity score: 82%
• FancyZones multiple #20378 , similarity score: 82%
• FancyZones: Layout Switching with a Shortcut #20233 , similarity score: 82%
• FancyZones window position when switching layouts #19289 , similarity score: 82%
• Fancy Zones, iterate through layouts with right click #30621 , similarity score: 82%
• Fancy zones: instant switch of zones request #32304 , similarity score: 81%

If any of the above are duplicates, please consider closing this issue out and adding additional context in the original issue.

Note: You can give me feedback by 👍 or 👎 this comment.

[Samay10]

While I am working on this task, I am sharing the idea that can be used for solving it.

The files to be created for this can be:

1. DragHandler.cs - this will determine the dragging behavior of Windows. It listens for mouse events to determine when a window is being dragged and whether the sidebar should be displayed.
   -- Components:
   --> StartDrag: Begins listening for mouse movements and button releases on the specified window.
   --> OnMouseMove: Checks if the mouse is near the top of the screen and, if so, displays the sidebar.
   --> OnMouseUp: Handles cleanup when the drag operation is complete, such as hiding the sidebar if needed.

2. LayoutSwitcher.cs - manages the available layouts for the application. It provides functionality to switch between different layout configurations.
   -- Components:
   --> Layouts: A list of available layouts that can be switched.
   --> SwitchLayout: A method that implements the logic to change the layout when a specific option is selected. This would interact with the Fancy Zones layout management system.

3. Sidebar.xaml: defining the sidebar UI that appears when dragging a window. It presents a list of available layouts for the user to choose from.
   -- Components:
   --> UserControl: Defines a control that can be reused in different parts of the application.
   --> ListBox: Displays the available layouts, allowing the user to select one.
   --> Visibility: Starts off as collapsed, only showing when the sidebar is activated during a drag operation.

4. Sidebar.xaml.cs: handles the Sidebar user control. It handles user interactions within the sidebar, such as selecting a layout.
   -- Components:
   --> LayoutList_MouseDoubleClick: Responds to double-click events on the layout list, triggering a layout switch via the LayoutSwitcher.
   --> Visibility Management: Hides the sidebar after a layout is selected, maintaining a clean UI.

5. MainWindow.xaml.cs: serves as the main application window's code-behind. It initializes the DragHandler, LayoutSwitcher, and Sidebar, tying everything together.
   -- Components:
   --> Initialization: Sets up the layout manager and sidebar when the main window loads.
   --> Event Handling: Instantiates the DragHandler to manage window dragging and the sidebar display.

This is the way I am thinking. Improving this can sort it out.

[zurie]

new version with the drag and drop toolbar on top is great! If you did work on it, its really nice! thanks!

[p134c0d3]

When dragging a window holding the Shift key, it is not showing my custom layouts in the pop out window on the top, only the default ones. Is it possible to also show the custom layouts a user has created? This is helpful if I am using a default fancy zones layout, but for example, if I switch to a different tab in my browser, and want to use the custom layout I made for it instead.

Or do I need to create a new issue for this?