iOS 17.0で導入された inspectorモディファイアの使用方法

iOS：17.0以上
XCode（当サイトの環境）：15.0.1

本記事ではiOS17.0において実装されたinspectorビューについて説明します。

inspectorはiPadなど画面領域が大きいデバイスではサイドからスライドインして表示されるビューで、iPhoneの場合は下からスライドしてきます。見た目やsheetビューと似ています。

inspectorの活用方法は？
基本的な使い方
1. サンプルコード
2. サンプルコードの動作
sheetビューと異なる点
まとめ

inspectorの活用方法は？

inspectorビューは、コンテンツの詳細を説明することに用いたり、メインコンテンツを捕捉するためのViewを表示することを想定されています。

基本的な使い方

.inspector(isPresented: $presented)を任意のビューに適応することで使用できます。

isPresentedのパラメータで指定したフラグがtrueになると、.inspectorのcontentとして指定したビューが表示されます。
以下はinspectorモディファイアを用いた簡単なサンプルコードです。

サンプルコード

import SwiftUI

struct InspectorSmp: View {
    @State private var presented: Bool = false
    @State private var editor: String = ""
    var body: some View {
        NavigationStack {
            TextEditor(text: $editor)
            Text("Inspector Sample View")
                // ツールバーにインスペクターの表示／非表示の切り替えボタンを作成
                .toolbar {
                    Spacer()
                    Button {
                        presented.toggle()
                    } label: {
                        Label("ShowInspector", systemImage: "info.circle")
                    }
                }
                // インスペクタービューを表示
                .inspector(isPresented: $presented) {
                    InspectorView()
                }
        }
    }
    struct InspectorView: View {
        var body: some View {
            Text("Inspector Area")
        }
    }
}