Modal

在聚焦的对话框中完成操作。

实时预览

正在加载预览…

参数配置

标题 label允许 Escape / 外部关闭 dismissible关闭按钮 closeButton全屏 fullscreen否

全部字段 15

ModalOptions

Title

Description

CloseLabel

Width

MaxHeight

Dismissible

CloseButton

Overlay

Fullscreen

Header

Footer

OnClose

ReturnFocus

UI

Styles · 0

Style

Go 代码

// Inside a view; c is *ui.Context, t is nui.Theme.
// Keep s (example state) outside the view. See the complete example.
nui.Button(c.Key("open"), t, "Open dialog", nui.ButtonOptions{}).OnClick(func() { s.Open = true })
nui.ModalWithOptions(c.Key("modal"), t, &s.Open, nui.ModalOptions{Title: "Edit project", Description: "Edit and save the project name.", Dismissible: nui.Optional[bool]{}, CloseButton: nui.Optional[bool]{}, Fullscreen: false}, func(t nui.Theme) {
	nui.Input(c.Key("name"), t, &s.Value, nui.InputOptions{Label: "Project name"})
	nui.Button(c.Key("save"), t, "Save", nui.ButtonOptions{}).OnClick(func() { s.Open = false })
})

使用说明

点击 Open dialog，在弹层输入名称并保存，或按 Escape 关闭。Dismissible 与 CloseButton 可分别选择继承、是、否；输入与打开状态都保存在组件实例中。

API 参考

Modal

源码

func Modal(c *ui.Context, t Theme, open *bool, title string, content func(Theme)) ui.Element

ModalWithOptions

源码

func ModalWithOptions(c *ui.Context, t Theme, open *bool, o ModalOptions, content func(Theme)) ui.Element

ModalOptions

源码

type ModalOptions struct {
	Title, Description, CloseLabel string
	Width, MaxHeight               Optional[float32]
	Dismissible, CloseButton       Optional[bool]
	Overlay                        Optional[bool] // Defaults to true; false hides the backdrop, not the modal focus scope.
	Fullscreen                     bool
	Header, Footer                 func(*ui.Context, Theme)
	OnClose                        func()
	ReturnFocus                    *ui.Handle
	Decoration
	// contains filtered or unexported fields
}

字段	类型	说明
`Title`	`string` Go 零值: `""`	标题文字。
`Description`	`string` Go 零值: `""`	补充说明文字。
`CloseLabel`	`string` Go 零值: `""`	关闭操作的可访问名称。
`Width`	`Optional[float32]` Go 零值: `unset`	宽度，单位为 DIP。
`MaxHeight`	`Optional[float32]` Go 零值: `unset`	最大高度，单位为 DIP。
`Dismissible`	`Optional[bool]` Go 零值: `unset`	允许 Escape 或外部点击关闭。
`CloseButton`	`Optional[bool]` Go 零值: `unset`	显示关闭按钮。
`Overlay`	`Optional[bool]` Go 零值: `unset`	控制遮罩或边缘渐隐层。
`Fullscreen`	`bool` Go 零值: `false`	让弹层填满窗口。
`Header`	`func(*ui.Context, Theme)` Go 零值: `nil`	同步构建标题区域。
`Footer`	`func(*ui.Context, Theme)` Go 零值: `nil`	同步构建底部区域。
`OnClose`	`func()` Go 零值: `nil`	关闭组件时通知应用的回调。
`ReturnFocus`	`*ui.Handle` Go 零值: `nil`	关闭后恢复焦点的持久 Handle。
`UI`	`Styles` Go 零值: `zero value`	以部件名称为键覆盖外观和间距。
`Style`	`func(Slot, ui.Element)` Go 零值: `nil`	同步配置当前构建的部件；不要保留 Element。