仅用 WithTheme 包裹标题栏，并在 CustomColors 中为 fontOnPrimary 提供与品牌背景对比度好的文本色；colorMode 可固定 SYSTEM，这样深浅色切换时系统其它 token 走各自资源（如 dark.json），而标题栏颜色稳定使用你的品牌色 + 对应的 fontOnPrimary。

把 每个 Tab 的内容页 单独用 WithTheme 包裹，而不是把整个 Tab 容器包裹；这样外层 TabBar/背景保持系统 token。

不会，只要复用主题对象（避免每次渲染都 new），并把 WithTheme 放在每个卡片的根部。下面示例用静态单例复用主题对象，滑动稳定。 {代码...}

用 @State 保存 mode 与 themeIndex，把需要切换的 UI 放到 WithTheme({ theme, colorMode }) 中；切换时只重建该子树。

定义实现了 CustomColors 的品牌色类，再定义一个实现 CustomTheme 的外壳类；在 BrandScope 里接收 colorMode 和 colors，内部用 WithTheme({ theme, colorMode }) 包裹 children。

仅用 WithTheme 包裹标题栏那一段 UI，正文不包裹即可。这样标题区域走自定义主题，正文仍按系统 token 渲染，二者互不干扰。 {代码...}

内层优先。最近的 WithTheme 作用域会覆盖外层的 colorMode 与 theme。下面代码中：外层强制深色，内层又强制浅色并改品牌色——内层区域应呈现浅色 + 自定义颜色，外层仍是深色。

把需要切换的部分单独放进 WithTheme 作用域，切换时仅重建该子树即可；外层页面未包裹 WithTheme，不会受影响。下面用按钮切换 @State themeIndex 来动态替换 WithTheme({ theme: themes[themeIndex] })。

可以。实现 CustomColors 并只定义你需要用到的颜色 token（其余未覆盖的仍走系统默认）。然后 WithTheme({ theme: new PageCustomTheme(new BrandColors()) }) 包裹该区域即可。

使用 WithTheme({ colorMode: ThemeColorMode.DARK }) { / 局部 / } 包裹局部区域即可。它只作用于自身作用域内的子组件，不影响外层页面。注意：若要让系统 token 的深浅色切换生效，需要在资源里提供 dark.json。

据我所知，单列的确用 Column 更轻量。但 GridRow 的优势是 响应式布局，可以在不同屏幕断点下调整列数，还能配合 offset、gutter 做更复杂的栅格化排列。比如：

据我所知，你写的没问题，只是 Text 内容固定写了“左/右”，视觉上会误导。RowReverse 是会调换渲染顺序的，你可以试试改成不同背景色就能看出来：

据我所知，你的写法没错，只是 span=1 在 3 列里会比较小。如果你想平均分，可以改成 span:1 和 columns:4，或者直接算比例。比如：

据我所知，offset + span 的和如果超过 columns，就会换行。你写的 span:2 + offset:2 已经等于 4，再加上前面已经有 2 个 span，所以放不下了。改成这样就行：

据我所知，breakpoints 数组必须是单调递增的，并且数量不能超过支持的 5 个（xs~xl）。你这样写是没问题的，只是断点范围比较窄，看起来不明显。可以写 4 个值更清晰：

据我所知，GridRow 只支持 Row 和 RowReverse，不支持 Column。如果要纵向排列，直接用 Column 容器。比如：

据我所知，可以用 alignItems(ItemAlign.Center) 设置整个 GridRow 的对齐方式。示例： {代码...} 这样两列都会在垂直方向居中。

据我所知，需要配合 breakpoints 参数才会触发，而且最好用 @State 把值展示出来。例子： {代码...} 这样窗口尺寸变化时，currentBp 会更新。

据我所知，gutter 可以写成对象形式，比如 {x:10, y:20}。代码如下： {代码...} 这样横向是 10vp，竖向是 20vp。

据我所知，你需要用 span: { xs:1, sm:2, lg:4 } 这种写法才会随断点变化。示例： {代码...} 这样就能在不同屏幕下看到列数调整了。