Skip to content

[ShortcutGuide] Use TransparentWindow + acrylic card chrome with slide animations#48181

Draft
niels9001 wants to merge 8 commits into
mainfrom
niels9001/shortcutguide-transparent-window
Draft

[ShortcutGuide] Use TransparentWindow + acrylic card chrome with slide animations#48181
niels9001 wants to merge 8 commits into
mainfrom
niels9001/shortcutguide-transparent-window

Conversation

@niels9001
Copy link
Copy Markdown
Collaborator

@niels9001 niels9001 commented May 28, 2026

Summary

Brings the new shared TransparentWindow + acrylic-card chrome (originally built for the CmdPal animated notification in #48176) to ShortcutGuide.

Both SG windows — the main shortcut overlay and the small "numbers" window that floats above the taskbar — now derive from TransparentWindow and share the same look: rounded acrylic card, system stroke + shadow, no native chrome.

What's new

  • MainWindow slides in from the screen edge it's pinned to (left/right) instead of just popping into place.
  • TaskbarWindow slides up from below the taskbar.
  • A 12 DIP transparent inset around each card gives the shadow + slide animation room to breathe without the visible content touching the screen edge.
  • Indicator + key visuals swapped from acrylic-on-acrylic brushes to a solid ControlFillColorDefaultBrush so they read cleanly on top of the new card.

Notes

  • All animations use the Community Toolkit's implicit Show/Hide sets — no code-behind animation orchestration.
  • No changes to the shared Common.UI.Controls library in this PR (already merged via [CmdPal] Animated notification #48176).
  • Behavior of the existing close-on-deactivate / TaskbarWindow activation flow is unchanged.
Screen.Recording.2026-05-28.140721.mp4

niels9001 and others added 6 commits May 28, 2026 11:36
…ontrols

Adds the new PowerToys.Common.UI.Controls library additions (TransparentWindow,
TransparentCard, AlwaysActiveDesktopAcrylicBackdrop) introduced for CmdPal's
toast, and applies a slide-in/out animation to the ShortcutGuide main window.

The page slides in from the same edge the window is pinned to (Left/Right
based on the ShortcutGuideWindowPosition setting) when activated, and slides
back out before closing on Escape, deactivation, or init failure.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
…rylic chrome

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
…nUI TitleBar control

ExtendsContentIntoTitleBar=true already hides the system caption, so the explicit PreferredHeightOption=Collapsed was redundant and crashed derived windows that host a WinUI TitleBar control (e.g. ShortcutGuide).

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
…indow edges

- Reorder App.OnLaunched so TaskBarWindow exists before MainWindow ctor runs (SetWindowPosition needs it).

- Move SetWindowPosition + animation attach + initial Visibility=Collapsed from Window_Activated into the ctor, so the window doesn't flash at default location before sliding in.

- Animate the whole Card (acrylic chrome + content) as one unit instead of just the inner Grid.

- Add 24px Margin around the Card and bump window Width 586 -> 634 to keep visible content the same size while giving shadow + screen-edge breathing room.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
…ition tolerate null TaskBarWindow

TaskbarWindow ctor reads App.MainWindow.AppWindow.Position so MainWindow must be created first. Instead of reordering, allow SetWindowPosition to run while TaskBarWindow is still null - the first call in MainWindow ctor just skips the taskbar-overlap adjustment, which is fine since the taskbar window isn't visible yet anyway.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
…ghten margins

- TaskbarWindow now derives from TransparentWindow, so it shares the
  same acrylic card chrome (rounded border + shadow) as MainWindow.
- Added a vertical slide-up animation tuned to the actual window height
  after the taskbar-button measurement pass.
- Bumped windowHeight and side margin to give the card a 12 DIP inset
  on every edge, matching MainWindow.
- Updated KeyVisual + TaskbarIndicator backgrounds from acrylic-style
  brushes to solid ControlFillColorDefaultBrush since they now sit on
  the acrylic card instead of a plain backdrop.
- Tightened MainWindow chrome margin 24 -> 12 (width 634 -> 610) so the
  visible card sits closer to the screen edge.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Comment thread src/common/Common.UI.Controls/Window/TransparentWindow.cs Fixed
Comment thread src/common/Common.UI.Controls/Window/TransparentWindow.cs Fixed
Comment thread src/common/Common.UI.Controls/Window/TransparentWindow.cs Fixed
Comment thread src/common/Common.UI.Controls/Window/TransparentWindow.cs Fixed
Comment thread src/common/Common.UI.Controls/Window/TransparentWindow.cs Fixed
Comment thread src/common/Common.UI.Controls/Window/TransparentWindow.cs Fixed
Comment thread src/common/Common.UI.Controls/Window/TransparentWindow.cs Fixed
@github-actions

This comment has been minimized.

niels9001 and others added 2 commits May 28, 2026 15:55
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
@niels9001 niels9001 requested a review from a team as a code owner June 1, 2026 08:51
@niels9001 niels9001 marked this pull request as draft June 1, 2026 08:52
Comment on lines +97 to +99
### `ManifestInterpreter.GenerateIndexYmlFile`

This application generates the `index.yml` manifest file.

It is a separate project so that its code can be easier ported to WinGet in the future.
The `index.yml` manifest file is generated in-process by `ManifestInterpreter.GenerateIndexYmlFile` (in `ShortcutGuide.Ui/Helpers/ManifestInterpreter.cs`), called on a background thread from `Program.Main` before the UI loads. It scans the per-user manifest folder and writes the index used by the navigation/lookup code.
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As the description states and as I already texted you, please let this be a separate project, so that it does not get too coupled and can later be transferred to winget.

@niels9001 niels9001 added the Product-Shortcut Guide Refers to the Shortcut Guide PowerToy label Jun 5, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Product-Shortcut Guide Refers to the Shortcut Guide PowerToy

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants