macOSアプリ [SwiftUI] toolbar のサンプル（title 部分は非表示）

やりたいこと

下のイメージのように、閉じるボタンの横に、ボタンを設置したいです。

これを実現するために以下の方法でやりました。

• toolbar を自作して
• titleVisibility を hidden します

コード

• Toolbar.swift を追加して
• AppDelegate.swfit に少し書きます

Toolbar.swift

import Foundation
import AppKit

extension NSToolbarItem.Identifier {
    static let today = NSToolbarItem.Identifier(rawValue: "Today")
}

extension NSToolbar {
    static let myToolbar: NSToolbar = {
        let toolbar = NSToolbar(identifier: "MyToolbar")
        toolbar.displayMode = .iconOnly
        return toolbar
    }()
}

extension AppDelegate: NSToolbarDelegate {
    func toolbarDefaultItemIdentifiers(_ toolbar: NSToolbar) -> [NSToolbarItem.Identifier] {
        [.today]
    }
    
    func toolbarAllowedItemIdentifiers(_ toolbar: NSToolbar) -> [NSToolbarItem.Identifier] {
        [.today]
    }
        
    func toolbar(_ toolbar: NSToolbar, itemForItemIdentifier itemIdentifier: NSToolbarItem.Identifier, willBeInsertedIntoToolbar flag: Bool) -> NSToolbarItem? {
        switch itemIdentifier {
        case NSToolbarItem.Identifier.today:
            let button = NSButton(title: "今日", target: nil, action: #selector(printToday))
            return cutomToolbarItem(itemIdentifier: .today, itemContent: button)
        default:
            return nil
        }
    }
    
    @objc private func printToday(_ sender: NSButton) {
        let df = DateFormatter()
        df.dateFormat = "yyyy-MM-dd"
        print(df.string(from: Date()))
    }
}

func cutomToolbarItem(itemIdentifier: NSToolbarItem.Identifier, itemContent: NSButton) -> NSToolbarItem? {
    let toolbarItem = NSToolbarItem(itemIdentifier: itemIdentifier)
    toolbarItem.view = itemContent
    return toolbarItem
}

AppDelegate にも少し書きます。

AppDelegate.swift

import Cocoa
import SwiftUI

@NSApplicationMain
class AppDelegate: NSObject, NSApplicationDelegate {

    var window: NSWindow!

    func applicationDidFinishLaunching(_ aNotification: Notification) {
        // Create the SwiftUI view that provides the window contents.
        let contentView = ContentView()
        
        // 😃😃😃 1行追加 😃😃😃
        NSToolbar.myToolbar.delegate = self

        // Create the window and set the content view. 
        window = NSWindow(
            contentRect: NSRect(x: 0, y: 0, width: 480, height: 300),
            styleMask: [.titled, .closable, .miniaturizable, .resizable, .fullSizeContentView],
            backing: .buffered, defer: false)
        window.center()
        
        // 😃😃😃 2行追加 😃😃😃
        window.toolbar = .myToolbar
        window.titleVisibility = .hidden
        
        window.setFrameAutosaveName("Main Window")
        window.contentView = NSHostingView(rootView: contentView)
        window.makeKeyAndOrderFront(nil)
    }

    func applicationWillTerminate(_ aNotification: Notification) {
        // Insert code here to tear down your application
    }
}

参考

こちらがとても参考になりました！というか、ほとんどこれです！クリックの action は載ってなかったので追加しました。

• https://github.com/billibala/SUIToolbarPlay