本文へスキップ

モディファイアとホスティング

モディファイアはネイティブの SwiftUI コントロールにスタイルを付けます。リバースホスティングは QuickGUI の内容を SwiftUI の中に置きます。

#モディファイア

モディファイアのファクトリは Modifiers で渡します。使えるファクトリには ButtonStyle、ButtonBorderShape、ControlSize、LabelStyle、Tint、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

対応するシステムでは、ui.SwiftUI.ButtonStyle("glass") がシステムのガラスボタンを要求します。最終的な見た目は macOS が決めます。

#リバースホスティング

ui.SwiftUI.QuickGUIHostView は QuickGUI の部分木をホストします。サイズを与え、コールバックで子を宣言します。

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 ポップオーバー

SwiftUI のポップオーバーはネイティブのトリガーを使います。内容には QuickGUI の子をホストできます。

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",
								)
							},
						),
					)
				},
			)
		},
	)
}

#ライフサイクル

Host は親ウィンドウが表示されたあとに現れ、取り除かれると閉じます。リバースホストする子はコールバック内で宣言し、その埋め込み面に属するようにします。