What's new in AppKit

ハイライト

macOS Monterey は、コントロールのカスタム カラーリング、SF Symbols 3 レイヤー レンダリング、TextKit 2 ノンリニア タイプセット エンジン、Swift 5.5 同時実行機能の緊密な統合、およびショートカット自動化サポートという 5 つの主要なアップデートを AppKit にもたらします。

主な内容

コントロールのカラーリングとボタンのデザインの更新

macOS Monterey では、個々のボタン、セグメント化されたコントロール、スライダーにカスタム カラーを設定できます。bezelColor、selectedSegmentColorそしてtrackFillColor成し遂げる。これはすでに Touch Bar で利用可能でしたが、現在はウィンドウ内コントロールにも拡張されています。

重要なデザイン変更の 1 つ: プッシュ ボタンをクリックしたときにアクセント カラーが強調表示されなくなりましたが、代わりに他のクリック可能な要素と一致するようになりました。カスタム描画に必要interiorBackgroundStyle基礎となるスタイルを決定します。

SF Symbols 3 のレイヤー化レンダリング

SF Symbols 3 では、2 つの新しいレンダリング モードが導入されています。

• 階層: 単色、不透明度で区別
• パレット: 各レイヤーに個別に色を指定します

中空のハートから塗りつぶされたバージョンを自動的に取得するなど、シンボル バリアント マッピングもサポートされています。

TextKit 2 の非線形レイアウト

TextKit 2 は非線形レイアウト システムを使用します。大きな文書の場合は、表示領域近くの段落のみが入力され、最初から最後まで線形計算が行われなくなります。TextEdit のプレーン テキスト ドキュメントと AppKit テキスト フィールドは、TextKit 2 を使用して Big Sur で密かに利用できるようになりました。

迅速な同時実行統合

AppKit は、NSResponder、NSView、NSViewControllerとマークされた他のコアクラス@MainActor、コンパイラ レベルにより、UI 操作がメインスレッドで実行されることが保証されます。NSColorSampler非同期 API が非同期/待機バージョンを提供するまで待ちます。

＃＃詳細

カラーリングと背景スタイルの判定を制御する (04:18)

// 为按钮设置语义化颜色
let preorderButton = NSButton(title: "Preorder", target: self, action: #selector(preorder))
preorderButton.bezelColor = NSColor.systemOrange

// 为分段控件设置选中颜色
let segmentControl = NSSegmentedControl()
segmentControl.selectedSegmentColor = NSColor.systemGreen

// 为滑块设置轨道填充色
let slider = NSSlider()
slider.trackFillColor = NSColor.systemBlue

描画をカスタマイズするときに背景のスタイルを決定します。

class CustomButtonCell: NSButtonCell {
    override func drawInterior(withFrame cellFrame: NSRect, in controlView: NSView) {
        // interiorBackgroundStyle 反映按钮 bezel 的底层样式
        // .normal — 无色状态（普通按钮）
        // .emphasized — 彩色/强调状态（着色按钮、默认按钮、toggle 开启状态）
        if interiorBackgroundStyle == .emphasized {
            // 在彩色背景上绘制白色内容
            drawWhiteContent()
        } else {
            // 在无色背景上绘制深色内容
            drawDarkContent()
        }
    }
}

キーポイント:

• 白/グレーの通常のボタンとは異なり、色付きのボタンはすべてのアクティブ状態で色付きで表示されます。
• 色付きのボタンとデフォルト ボタンの混同を避けてください。どちらも色付きの外観になっています。
• 色だけではなく、コントロールの目的を伝えるためにラベルまたはアイコンを使用する必要があります
• interiorBackgroundStyle代替チェックhighlight描画戦略を決定するステータス

カラーピッカー (14:40)

@IBAction func pickColor(_ sender: Any?) {
    Task {
        guard let color = await NSColorSampler().sample() else { return }
        textField.textColor = color
    }
}

キーポイント:

• NSColorSampler().sample()非同期メソッドであり、ユーザーは画面上のどこからでも色を選択します
• 呼び出し後、スレッドはあきらめて、ユーザーが選択を完了するのを待ってから実行を続行します。
• で直接使用できます。guard let、コードは完了ハンドラーよりも自然です。

メニューのショートカット キーの自動ローカライズ

macOS Monterey は、メニュー ショートカットのローカライズを自動的に処理します。

// 自动映射不可用的快捷键
// Command-backslash 在日文键盘上没有反斜杠键
// 系统会自动映射为等效的、可输入的快捷键

// 方向性快捷键在 RTL 语言中自动镜像
// Command-[ 在 RTL 语言中自动变为 Command-]

// 对于绝对方向的操作（如左对齐），禁用镜像
let alignLeftItem = NSMenuItem(title: "Align Left", action: #selector(alignLeft), keyEquivalent: "[")
alignLeftItem.allowsAutomaticKeyEquivalentMirroring = false

// 完全禁用某个菜单项的本地化
let customItem = NSMenuItem(title: "Custom", action: #selector(custom), keyEquivalent: "k")
customItem.allowsAutomaticKeyEquivalentLocalization = false

// 整个应用禁用自动本地化
func applicationShouldAutomaticallyLocalizeKeyEquivalents(_ application: NSApplication) -> Bool {
    return false
}

キーポイント:

• ほとんどのアプリケーションは手動介入を必要とせず、システムが自動的に処理します。
• ショートカット キーに絶対的な方向の意味がある場合にのみミラーリングを無効にします (例: 左揃え)。
• アプリレベルの無効化は最後の手段であり、最初にメニュー項目レベルのコントロールを使用してください

Swift プロパティ ラッパーはビューを自動的に更新します

class ConfigurableView: NSView {
    // 属性变化时自动调用 setNeedsDisplay
    @Invalidating(.display) var foregroundColor: NSColor = .label

    // 属性变化时自动调用 setNeedsLayout
    @Invalidating(.layout) var spacing: CGFloat = 8

    // 属性变化时自动调用 setNeedsUpdateConstraints
    @Invalidating(.constraints) var maxWidth: CGFloat = 200

    // 属性变化时自动调用 invalidateIntrinsicContentSize
    @Invalidating(.intrinsicContentSize) var title: String = ""

    // 组合多个无效化操作
    @Invalidating(.display, .layout) var cornerRadius: CGFloat = 0
}

キーポイント:

• @InvalidatingはいNSViewネストされたプロパティ ラッパー
• プロパティの種類は次のとおりである必要がありますEquatable、ラッパーは値が実際に変更された場合にのみ無効化を実行します。
• 組み込みのサポート.display、.layout、.constraints、.intrinsicContentSize、.restorableState
• 可NSViewInvalidatingプロトコルはカスタム無効化動作を定義します

ショートカットの統合

AppKit アプリはサービスを介したショートカットをサポートします。

// 实现 validRequestor 方法，声明可接受/提供的数据类型
extension MyView: NSServicesMenuRequestor {
    override func validRequestor(forSendType sendType: NSPasteboard.PasteboardType?,
                                 returnType: NSPasteboard.PasteboardType?) -> Any? {
        if returnType == .string {
            return self
        }
        return super.validRequestor(forSendType: sendType, returnType: returnType)
    }

    func readSelection(from pboard: NSPasteboard) -> Bool {
        // 从 pasteboard 读取数据
        return true
    }

    func writeSelection(to pboard: NSPasteboard, types: [String]) -> Bool {
        // 向 pasteboard 写入数据
        return true
    }
}

キーポイント:

• アプリがすでにサービスをサポートしている場合、ショートカットは自動的にサポートされます
• サービスメニューのどこにでもショートカットが表示されます
• AppKit は、各レスポンダーがレスポンダー チェーンを通じて指定されたタイプのデータを提供/受け入れできるかどうかを確認します。

重要ポイント

1. やるべきこと: Mac 版のデザイン ツールに画面カラー選択機能を追加します。

• 実行する価値がある理由:NSColorSamplerasync/await API により、わずか 1 行のコードでプロフェッショナルなカラーピッカーが可能になります
• 開始方法: カラー選択ボタンのアクションで呼び出されますawait NSColorSampler().sample()、色を取得し、選択した要素に適用します

2. やるべきこと: Mac のファイル マネージャーで SF Symbols 3 のパレット モードを使用して、カラフルなラベル アイコンを作成します。

• 実行する価値がある理由: パレット モードでは、シンボルの異なるレイヤーに異なる色を指定できます。ラベル アイコンは、背景レイヤーでは灰色、前景レイヤーでは色付きにすることができます。
• 開始方法: を使用しますNSImage.SymbolConfiguration(paletteColors: [backgroundColor, foregroundColor])シンボルのレンダリングを構成する

3. やるべきこと: 非常に大きなドキュメントをサポートするには、Mac テキスト エディターの TextKit 2 に移行します。

• 実行する価値がある理由: TextKit 2 のノンリニア レイアウトにより、大きなドキュメントのパフォーマンスが大幅に向上し、表示される領域のみがタイプセットされます。
• 開始方法: 作成するNSTextLayoutManager代わりのNSLayoutManager、使用NSTextContentStorageテキストコンテンツを管理する

4. 内容: AppKit アプリケーションで使用されます@Invalidatingカスタムビューのプロパティを簡素化する

• 実行する価値がある理由: 多くのものを排除するdidSetでsetNeedsDisplay/setNeedsLayout定型コード
• 開始方法: カスタム ビューの構成プロパティを追加します@Invalidating(.display)または@Invalidating(.layout)注釈

関連セッション

• Mac Catalyst の新機能 — AppKit を補完する Mac Catalyst の新しい API
• 優れた Mac Catalyst アプリの品質 — 優れた Mac Catalyst アプリの品質
• TextKit 2 の紹介 — TextKit 2 の詳細な紹介