Segmented control(分段控件)

ui.Segmented 创建一个显示若干标签的分段控件,其中 *int 是被选中标签的 索引,用作视图之间的切换:点击选择一个分段,在它拥有键盘焦点时按方向键也 一样,Changed 上报新的选择。

ui.Segmented(c, &app.view, "List", "Grid").Label("View")
switch app.view {
case 0:
	app.list(c)
case 1:
	app.grid(c)
}

它是 Tab 的一个焦点停靠点,焦点落在被选中的分段上。

图标与其他内容

对于图标分段或你自己外观的分段,用 ui.SegmentedBase 构建,它是一个没有 外观的、由 Segment 组成的 Track:

seg := ui.SegmentedBase(c, &app.view, 2)
seg.Track.Padding(3).Radius(8).Background(t.Surface).Children(func() {
	for i, icon := range []*ui.SVG{listIcon, gridIcon} {
		s := seg.Segment(i).Padding(4, 10).Radius(6).Label([]string{"List", "Grid"}[i])
		if i == app.view {
			s.Background(t.Background)
		}
		s.Children(func() { ui.Icon(c, icon) })
	}
})

参见自定义控件。

无障碍

辅助技术看到的是一个由其 Label 命名的单选按钮组,其中的单选按钮由各自 的标签命名。