Files
MujicaUI/docs/components/461-settings-layout.md
T
ZacharyZhang-NYandClaude Opus 5.5 bcce34cda1 Upgrade MyGo to v0.5.5
MyGo v0.5.5 returns ui.Element as a checked value handle instead of a
pointer. Migrated with `mygo migrate-ui`, then fixed what the codemod
leaves to review:

- Element nil checks become .Valid(); absent elements are ui.Element{}.
- Input handlers and paint callbacks run outside the build pass, where
  elements expire and Context methods are inert: read IsDisabled into a
  local during the build, keep a ui.Handle for Focus, use c.Services()
  for clipboard access, create ui.Local state during the build.
- Add core.AutoFocus: v0.5.5 records an overlay's opener after its
  content builds, so same-frame autofocus lost focus restore on close.
  It focuses one frame later; cascader rows defer their focus likewise.
- core.OverlayLayer identifies build passes by the root element, not
  c.Now(), which repeats across passes and under the Tester clock.
- Context menus survive the opening press counted as PressedOutside;
  split button tooltip no longer reorders its open menu; disabled
  menubar rows pass presses to the panel; Form defers blur-started
  async checks so the growing message no longer moves Submit away
  from the release; Combobox drops its disabled copy now that MyGo
  blocks typing under a disabled wrapper (canary flipped to a guard).
- The Tester clock is virtual: tests use Advance/Now instead of
  time.Sleep/time.Now and read element state inside the view. The web
  mirror advances the clock to wall time before each frame and input.
- AGENTS.md and docs describe the value Element API and the new pin.

Snapshot goldens are darwin-only and were not re-verified here.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
2026-10-17 01:37:54 -04:00

1.7 KiB

461 SettingsLayout

设置布局。

用途

设置页框架:左侧分区导航(Sidebar),右侧显示当前分区;配套 SettingsSection 分节与 SettingsRow 设置行(标签、说明、控件)。

最小示例

page := ""
sound := true
pages := []account.SettingsPage{{ID: "general", Label: "General"}, {ID: "privacy", Label: "Privacy"}}
view := func(c *ui.Context) {
	core.Use(c, core.Settings{})
	account.SettingsLayout(c, &page, pages, account.SettingsLayoutOptions{}, func(id string) {
		account.SettingsSection(c, "Notifications", func() {
			account.SettingsRow(c, "Sound", account.SettingsRowOptions{ID: "sound"}, func() ui.Element {
				return input.Switch(c, &sound, "", input.SwitchOptions{})
			})
		})
	})
}
ui.Render(view, 400, 300, 1)

参数

字段 类型 默认值 含义
page *string 必填 当前分区 ID;空值取第一个,未知 ID panic。
pages []SettingsPage 必填 ID、Label、Icon。
Title string 内置“Settings” 导航标题。
content func(id string) 必填 构建分区内容。
SettingsRow control func() ui.Element 必填 返回控件;行标签与说明关联到它。
SettingsRowOptions.ID string "" 供 SettingsSearch 跳转定位。

状态

导航选中、行悬停、被搜索定位的行短暂高亮(减少动画时不高亮)。

事件

ChoiceResult.Changed() 在切换分区时为 true。

键盘操作

导航沿用 Sidebar 键盘操作;Tab 进入内容区各控件;点击行文字聚焦其控件。

限制

  • 内容区独立滚动,最大宽度 720 DIP。