Timeline

按顺序展示活动或里程碑。

实时预览

正在加载预览…

参数配置

全部字段 11

TimelineItems

列表项 · 3
TimelineItem
Styles · 0
TimelineItem
Styles · 0
TimelineItem
Styles · 0

TimelineOptions

Styles · 0

Go 代码

Go
// Inside a view; c is *ui.Context, t is nui.Theme.
nui.Timeline(c.Key("timeline"), t, []nui.TimelineItem{{ID: "create", Title: "Created", Time: "09:00", Description: "Project initialized"}, {ID: "build", Title: "Built", Time: "09:10", Description: "Checks passed"}, {ID: "ship", Title: "Published", Time: "09:20", Description: "Ready to share"}}, nui.TimelineOptions{Label: "Activity", Color: nui.ColorDefault, Size: nui.SizeDefault, Horizontal: false, Current: nui.Set(1)})

使用说明

示例显示创建、构建、发布三条固定活动，current 控制当前项目。切换横向排列并调整颜色与尺寸；时间文字由应用提供。

API 参考

Timeline

源码 
func Timeline(c *ui.Context, t Theme, items []TimelineItem, o TimelineOptions) ui.Element

TimelineOptions

源码 
type TimelineOptions struct {
	Label      string
	Horizontal bool
	Color      Color
	Size       Size
	Current    Optional[int] // Zero-based step; unset means no active/completed steps.
	CurrentID  string        // Takes precedence over Current when non-empty.
	Reverse    bool          // Changes progress interpretation, not item order.
	OnSelect   func(string)
	Decoration
}
字段类型说明
Labelstring

Go 零值: ""

控件标签或可访问名称。

Horizontalbool

Go 零值: false

启用横向排列。

ColorColor

Go 零值: ColorDefault

语义颜色；默认值继承主题或组件配色。

SizeSize

Go 零值: SizeDefault

组件尺寸；默认值继承主题或组件尺寸。

CurrentOptional[int]

Go 零值: unset

当前步骤的零基索引。

CurrentIDstring

Go 零值: ""

当前步骤 ID；优先于索引。

Reversebool

Go 零值: false

反向移动或反向解释进度。

OnSelectfunc(string)

Go 零值: nil

激活或选择项目时通知应用的回调。

UIStyles

Go 零值: zero value

以部件名称为键覆盖外观和间距。

Stylefunc(Slot, ui.Element)

Go 零值: nil

同步配置当前构建的部件；不要保留 Element。