mirror of
https://github.com/wwiinnddyy/LanMountainDesktop.git
synced 2026-06-20 23:54:26 +08:00
Rebuild the settings window as a Fluent shell: adds a custom 48-DIP titlebar with Back, pane toggle, icon/title, search box, restart/more menu, and caption-button spacer; moves compact pane toggle into the titlebar and preserves FANavigationView as the primary navigation surface. Introduces a SettingsSearchService (with UI AutoComplete integration, search indexing, navigation-by-result, and search result highlighting) plus focused tests for search filtering and theme material normalization. Adds navigation history/back stack, updates SettingsViewModels for new bindings and localization keys, and updates General/Apearance pages to expose new strings and options. Implements an "auto" system material mode: default in AppSettingsSnapshot, new MaterialAuto constants and normalization/resolution logic in ThemeAppearanceValues, WindowMaterialService and MaterialSurfaceService adjustments to prefer Mica on Win11 and Acrylic on Win10 using TransparencyLevelHint. GlassEffectService and AppearanceThemeService updated to use effective material mode and to track live theme state changes. Adds localization entries (en-US, zh-CN), spec/tasks docs, and other UI/style tweaks to support the redesign.
2.9 KiB
2.9 KiB
Settings Window Fluent Shell Design
This document is the authoritative implementation note for the LanMountainDesktop settings window shell.
General visual tokens still come from docs/VISUAL_SPEC.md and docs/CORNER_RADIUS_SPEC.md.
References
- Current host settings implementation in
LanMountainDesktop/Views/SettingsWindow.axaml. - ClassIsland
SettingsWindowNew: titlebar navigation buttons, titlebar pane toggle,NavigationViewwidth, right-side drawer. - SecRandom v3 Avalonia
SettingsView: titlebar search, restart action,NavigationViewcompact toggle, search result highlight. - Awesome Design / Fluent style notes: quiet app surface, token-driven spacing, system material as backdrop instead of decorative panels.
Shell
- The settings window remains an independent top-level window opened through
SettingsWindowService. - The shell uses a 48 DIP custom titlebar and one
FANavigationViewas the main container. - The titlebar left cluster is: Back, pane toggle, app/settings icon, window title.
- The titlebar center is a settings
AutoCompleteBoxsearch field. - The titlebar right cluster is: restart prompt, more options, Windows caption-button spacer.
- The fallback pane toggle belongs in the titlebar, not the navigation footer.
- Content remains unframed: pages render directly in the
FAFrame; drawers are the only side panel.
Navigation And Search
FANavigationView.OpenPaneLengthstays near 283 DIP and may scale within the existing responsive limits.- Navigation history is local to the settings window; using Back does not close the window or affect the desktop shell.
- Search entries always include page-level descriptors.
- Built-in pages are also scanned for
FASettingsExpanderandFASettingsExpanderItemtext. - Selecting a search result navigates to its page, expands parent settings expanders, scrolls/focuses the target, and shows a short accent highlight.
- Plugin and generated pages are searchable at page level unless their controls are already loaded and can be scanned.
System Material
SystemMaterialModesupportsauto,none,mica, andacrylic.- The default is
auto. - The implementation uses Avalonia
Window.TransparencyLevelHint; it does not use WinUI SDK interop or private platform accessors. - Auto mode uses this priority:
- Windows 11:
Mica, thenAcrylicBlur, thenBlur, thenNone. - Windows 10:
AcrylicBlur, thenBlur, thenNone. - Other systems or disabled transparency:
None.
- Windows 11:
- The settings-window root brush remains translucent for material modes so it does not cover the OS backdrop.
Layout Rules
- Settings pages use
ScrollViewer -> StackPanel.settings-page-container -> FASettingsExpander. - Avoid nested surface cards inside the settings content area.
- Use dynamic design tokens for radius and colors.
- Widget root radius rules still follow
DesignCornerRadiusComponent; settings shell internals use the smaller design radius tokens.