MAUI怎么实现一个设置页面 MAUI Settings Page实战

MAUI设置页推荐用NavigationPage+ContentPage实现导航，CollectionView展示设置项，Preferences/SecureStorage持久化数据，PushAsync或Shell跳转子页，并通过MessagingCenter同步状态。

MAUI 实现设置页面不难，关键是用对组件、理清导航逻辑、保证数据持久化。下面直接上实用方案，不绕弯。

用 NavigationPage + ContentPage 搭建设置主界面

MAUI 默认不强制用 NavigationPage，但设置页通常需要返回上级，推荐显式启用：

• 在 App.xaml.cs 的 MainPage 初始化时，用 new NavigationPage(new SettingsPage())
• SettingsPage 继承 ContentPage，顶部自动带返回按钮（Android/iOS 都兼容）
• 避免用 Shell 当主容器再嵌套 SettingsPage——容易导致路由混乱和状态丢失

用 CollectionView 做可点击的设置项列表

比 ListView 更现代、更轻量，支持模板、分组、下拉刷新（虽然设置页一般不用刷新）：

• 绑定一个 IEnumerable 数据源，比如：主题切换、通知开关、语言选择
• 每个 SettingItem 包含 Title、Icon、IsToggled（布尔）、Command（跳转或触发动作）
• 模板中用 Switch 或 CheckBox 控件绑定 IsToggled，用 TapGestureRecognizer 响应点击
• 示例：点击“深色模式”项 → 触发命令 → 切换 App.Current.RequestedTheme 并保存到 Preferences

用 Preferences 和 SecureStorage 存储设置项

MAUI 内置 Microsoft.Maui.Storage，够用且跨平台：

Quicktools Background Remover

Picsart推出的图片背景移除工具

31

查看详情

• Preferences.Set("theme_mode", "dark") —— 存普通设置（字符串/布尔/数字）
• SecureStorage.Default.SetAsync("api_token", token) —— 存敏感信息（如登录令牌）
• 首次进入 SettingsPage 时，用 Preferences.Get("theme_mode", "light") 初始化 UI 状态
• 注意：SecureStorage 在 iOS 模拟器可能报错，真机或 Android 模拟器测试更稳

跳转子设置页（比如“关于”“帮助”）用 Shell 或 PushAsync

简单场景用 PushAsync 更直接：

• 点击“关于” → await Navigation.PushAsync(new AboutPage())
• AboutPage 同样继承 ContentPage，自带返回按钮
• 如果整个 App 已用 Shell，可在 AppShell.xaml 中注册路由：Routing.RegisterRoute("about", typeof(AboutPage))，然后用 Shell.Current.GoToAsync("about")
• 避免在 SettingsPage 里写太多业务逻辑——把每个子页拆成独立 Page，职责清晰

基本上就这些。不复杂但容易忽略的是状态同步：比如用户在设置页关了通知，回到主页后要立刻响应变化。可以用 MessagingCenter 或 CommunityToolkit.Mvvm 的 ObservableObject + OnPropertyChanged 主动通知，而不是等重启才生效。

以上就是MAUI怎么实现一个设置页面 MAUI Settings Page实战的详细内容，更多请关注php中文网其它相关文章！