Skip to content

Modifiers & Hosting

Modifiers style native SwiftUI controls. Reverse hosting puts QuickGUI content inside SwiftUI.

#Modifiers

Pass modifier factories through Modifiers. Available factories include ButtonStyle, ButtonBorderShape, ControlSize, LabelStyle, Tint, and Disabled.

return ui.SwiftUI.Button(ui.SwiftUIButtonProps{
	Label: "Create project",
	Modifiers: []ui.SwiftUIModifier{
		ui.SwiftUI.ButtonStyle("borderedProminent"),
		ui.SwiftUI.ControlSize("large"),
		ui.SwiftUI.Tint("#f97316"),
	},
})

#Liquid Glass

On supported systems, ui.SwiftUI.ButtonStyle("glass") requests the system glass button. macOS chooses the final look.

#Reverse hosting

ui.SwiftUI.QuickGUIHostView hosts a QuickGUI subtree. Give it a size and declare children in the callback.

func SwiftUiQuickguiHostViewExample() *ui.Element {
	return ui.SwiftUI.Host(
		ui.SwiftUIHostProps{MatchContents: true},
		func() *ui.Element {
			return ui.SwiftUI.QuickGUIHostView(
				ui.SwiftUIQuickGUIHostViewProps{Width: 320, Height: 180},
				func() *ui.Element {
					return ui.View().Child("QuickGUI inside SwiftUI").
						Width("100%").Height("100%").Padding(16)
				},
			)
		},
	)
}

#SwiftUI popover

The SwiftUI popover uses a native trigger. Its content can host QuickGUI children.

func SwiftUiPopoverExample() *ui.Element {
	open, setOpen := ui.CreateSignal(false)
	return ui.SwiftUI.Host(
		ui.SwiftUIHostProps{MatchContents: true},
		func() *ui.Element {
			return ui.SwiftUI.Popover.Root(
				ui.SwiftUIPopoverProps{
					IsPresented:         open,
					OnIsPresentedChange: setOpen,
				},
				func() *ui.Element {
					return ui.Fragment(
						ui.SwiftUI.Popover.Trigger(ui.SwiftUIPopoverTriggerProps{
							Render: func() *ui.Element {
								return ui.SwiftUI.Button(ui.SwiftUIButtonProps{Label: "Account"})
							},
						}),
						ui.SwiftUI.Popover.Content(
							ui.SwiftUIPopoverContentProps{},
							func() *ui.Element {
								return ui.SwiftUI.QuickGUIHostView(
									ui.SwiftUIQuickGUIHostViewProps{Width: 240, Height: 120},
									"Account settings",
								)
							},
						),
					)
				},
			)
		},
	)
}

#Lifetime

The host appears after the owner window is shown and closes when it is removed. Declare reverse-hosted children inside the callback so they belong to that embedded surface.