inspectorビューのカスタマイズ方法を紹介

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

inspectorビューはカスタマイズが可能です。
カスタマイズの種類は以下が用意されています。

• inspectorColumnWidth：inspectorビューの幅を設定する(iPhoneでは無効)
• interactiveDismissDisabled：スワイプによるinspectorビューを閉じる動作を無効にする(iPadでは無効)

ビューの幅を設定する-inspectorColumnWidth

inspectorColumnWidthを使用することで、inspectorビューの幅を設定することが可能です。

使用方法

以下のように.inspector内で表示するビューに付与することで使用します。

// インスペクタービューを表示
.inspector(isPresented: $presented) {
    InspectorView()
        .inspectorColumnWidth(250)
}

なお、以下のように最小値、最大値を設定することも可能です。

.inspectorColumnWidth(min: 250, ideal: 500, max: 750)

サンプルプログラム

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()
                        .inspectorColumnWidth(250)
                }
        }
    }
    struct InspectorView: View {
        var body: some View {
            Text("Inspector Area")
        }
    }
}

サンプルの実行結果

ポイント

inspectorColumnWidthは幅を設定する機能であり、iPhoneの場合は幅は全幅となるため、設定が無効になります。

スワイプによる閉じる動作を無効にする-interactiveDismissDisabled

interactiveDismissDisabledはスワイプによって閉じる動作を無効にします。

使用方法

以下のように.inspector内で表示するビューに付与することで使用します。

// インスペクタービューを表示
.inspector(isPresented: $presented) {
    InspectorView()
        .interactiveDismissDisabled()
}

ポイント

interactiveDismissDisabledはスワイプ動作を無効にしますが、iPadの場合はスワイプでinspectorビューを閉じる機能がないためそもそもないため動作が変わりません。

まとめ

本記事ではinspectorのカスタマイズ方法について紹介しました。参考にしていただけると幸いです。

• inspectorのカラム幅の設定方法
• スワイプによる閉じる動作の無効化