返回 Skill 列表
extension
分类: 开发与工程无需 API Key

maui-theming

为.NET MAUI应用程序设置主题的指南—支持明/暗模式,AppThemeBinding,动态资源,ResourceDictionary主题切换以及系统主题检测。使用场景包括:“暗模式”,“明模式”,“主题设置”,“AppThemeBinding”,“主题切换”,“ResourceDictionary主题”,“动态资源”,“系统主题检测”,“配色方案”,“应用程序主题”。不应用于:本地化或语言切换(请使用maui-localization),可访问性视觉调整(请使用maui-accessibility)或应用图标(请使用maui-app-icons-splash)。

person作者: jakexiaohubgithub

.NET MAUI Theming

Choosing your approach

| Approach | Best for | Limitation | |----------|----------|------------| | AppThemeBinding | Auto light/dark with OS — minimal code | Only two themes (light + dark) | | ResourceDictionary swap | Custom branded themes, >2 themes, user preference | More setup, must use DynamicResource everywhere | | Both combined | Auto OS response + custom theme colors | Most flexible but most complex |

Critical gotchas

Android: ConfigChanges.UiMode is REQUIRED

MainActivity must include ConfigChanges.UiMode or theme change events will not fire and the activity restarts instead of handling the change:

[Activity(Theme = "@style/Maui.SplashTheme",
          MainLauncher = true,
          ConfigurationChanges = ConfigChanges.ScreenSize
                               | ConfigChanges.Orientation
                               | ConfigChanges.UiMode  // ← Required for theme detection
                               | ConfigChanges.ScreenLayout
                               | ConfigChanges.SmallestScreenSize
                               | ConfigChanges.Density)]
public class MainActivity : MauiAppCompatActivity { }

Without UiMode, toggling dark mode in Android settings causes a full activity restart — losing navigation state and appearing as a crash to users.

CSS themes cannot be swapped at runtime

MAUI supports CSS styling, but CSS-based themes cannot be swapped dynamically. Use ResourceDictionary theming for runtime switching.

DynamicResource vs StaticResource

When using ResourceDictionary theme switching, you must use DynamicResource:

<!-- ✅ Updates when theme dictionary changes -->
<Label TextColor="{DynamicResource PrimaryTextColor}" />

<!-- ❌ Frozen at first load — won't update on theme switch -->
<Label TextColor="{StaticResource PrimaryTextColor}" />

Quick reference

  • OS light/darkAppThemeBinding markup extension
  • Theme colors in C#SetAppThemeColor(), SetAppTheme<T>()
  • Read OS themeApplication.Current.RequestedTheme
  • Force themeApplication.Current.UserAppTheme = AppTheme.Dark
  • Theme changesRequestedThemeChanged event
  • Custom switching → Swap ResourceDictionary in MergedDictionaries
  • Runtime bindingsDynamicResource (not StaticResource)