Swift Optional toolbar(id:content:)用法及代碼示例

實例方法

toolbar(id:content:)

使用指定的項目填充工具欄或導航欄，允許用戶自定義。

聲明

func toolbar<Content>(
    id: String,
    content: () -> Content
) -> some View where Content : CustomizableToolbarContent

參數

id: 此工具欄的唯一標識符。
content: 表示工具欄內容的內容。

詳述

當您希望允許用戶自定義工具欄中元素的組件和布局時，請使用此修飾符。工具欄修飾符需要一個工具欄項目的集合，您可以通過提供一個視圖集合來提供這些項目，每個視圖都包含在 ToolbarItem 中。

下麵的示例創建一個表示每個 ToolbarItem 的視圖以及一個唯一標識自定義編輯器的工具欄項的 ID：


struct ToolsEditorView: View {
    @State private var text = ""
    @State private var bold = false
    @State private var italic = false
    @State private var fontSize = 12.0


    var displayFont: Font {
        let font = Font.system(
           size: CGFloat(fontSize),
             weight: bold == true ? .bold : .regular)
        return italic == true ? font.italic() : font
    }


    var body: some View {
        TextEditor(text: $text)
            .font(displayFont)
            .toolbar(id: "editingtools") {
                ToolbarItem(
                    id: "sizeSelector", placement: .secondaryAction
                ) {
                    Slider(
                        value: $fontSize,
                        in: 8...120,
                        minimumValueLabel:
                            Text("A").font(.system(size: 8)),
                        maximumValueLabel:
                            Text("A").font(.system(size: 16))
                    ) {
                        Text("Font Size (\(Int(fontSize)))")
                    }
                    .frame(width: 150)
                }
                ToolbarItem(
                    id: "bold", placement: .secondaryAction
                ) {
                    Toggle(isOn: $bold) {
                        Image(systemName: "bold")
                    }
                }
                ToolbarItem(
                    id: "italic", placement: .secondaryAction
                ) {
                    Toggle(isOn: $italic) {
                        Image(systemName: "italic")
                    }
                }
            }
            .navigationTitle("My Note")
    }
}

在 macOS 中，您可以通過使用 Scene/commands(content:) 場景修飾符將 ToolbarCommands 實例添加到場景來啟用對工具欄自定義的菜單支持：


@main
struct ToolbarContent_macOSApp: App {
    var body: some Scene {
        WindowGroup {
            ToolsEditorView()
                .frame(maxWidth: .infinity, maxHeight: .infinity)
        }
        .commands {
            ToolbarCommands()
        }
    }
}

當您添加工具欄命令時，係統會在您的應用程序的主菜單中添加一個菜單項，以提供工具欄自定義支持。這是對工具欄上的Control-click 以打開工具欄自定義編輯器的能力的補充。

可用版本

iOS 14.0+, iPadOS 14.0+, macOS 11.0+, Mac Catalyst 14.0+, tvOS 14.0+, watchOS 7.0+

相關用法

注：本文由純淨天空篩選整理自apple.com大神的英文原創作品 Optional toolbar(id:content:)。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。