[SwiftUI] alert のあまり知られていない表示方法(item:)

SwiftUI

alert は alert(isPresented:....) で使うのが普通に感じていましたが、別の方法を知ったので、説明します。

alert 普通の表示方法

alert isPresented

func alert(isPresented: Binding, content: () -> Alert) -> some View

Alert といえば、上記の Method を使って表示制御するのが普通だと思ってました。isPresented が true なら表示、false なら非表示で直感的でわかりやすいものです。

Alert 表示 (isPresented)

//
//  ContentView.swift
//  SheetWithOptionalItem
//
//  Created by Tomoaki Yagishita on 2020/10/18.
//

import SwiftUI

struct Person {
  var name: String = ""
  var age:Int = 20
}

struct ContentView: View {
  @State private var person: Person?
  @State private var showAlert:Bool = false
  var body: some View {
    VStack {
      Button("set person") {
        person = Person(name: "someone", age: 25)
        showAlert.toggle()
      }
    }
    .alert(isPresented: $showAlert) {
      Alert(title: Text("Person available"), message: Text("Name: \(person!.name)"), dismissButton: nil) // person! を使う必要あり
    }
  }
}

欠点としては、プログラムの仕様としては showAlert が true のときには、person は non-nil になる制約がありますが、プログラムフロー的に実現されているので、プログラム的には、! をつかって、強制的にoptional を外す必要があることです。

app snapshot

「app snapshot」
SwiftUI[SwiftUI]Sheetの閉じかた:Environmentの.presentationModeより@Bindingを渡して行う表示制御が自然に思える

alert 別の表示方法

alert

func alert(item: Binding, content: (Item) -> Alert) -> some View where Item : Identifiable

引数に、item を渡せる Method があります。

これは、例えば Alert の表示対象が存在するときに、Alert を表示させ、なければ表示しないというような使い方ができます。

content の引数に、Item が渡されるのも特徴です。

Alert 表示 (item)

//
//  ContentView.swift
//  SheetWithOptionalItem
//
//  Created by Tomoaki Yagishita on 2020/10/18.
//

import SwiftUI

struct Person: Identifiable {
  var id: String = UUID().uuidString
  var name: String = ""
  var age:Int = 20
}

struct ContentView: View {
  @State private var person: Person?
  var body: some View {
    VStack {
      Button("set person") {
        person = Person(name: "someone", age: 25)
      }
    }
    .alert(item: $person) { person in
      Alert(title: Text("Person available"), message: Text("Name: \(person.name)"), dismissButton: nil)
    }
  }
}

こちらは、person そのものを判定基準に使っているので、! で optional を外す必要はありません。
ただし、item が Identifiable に準拠することが必要です。

Alert 以外にも使えます

Alert 以外にも item: を使って表示制御できるものがあります。

  • alert
  • sheet
  • actionSheet
  • fullScreenCover
  • popover

まとめ

isPresented: と item:
  • Alert や Sheet の表示制御には、isPresented: と item: が使える
  • item: を使う対象は、Identifiable に準拠が必要

ケースによっては、コードが読みやすくなるので、積極的に使っていきたい Method だと思います。

説明は以上です。
不明な点やおかしな点ありましたら、ご連絡いただけるとありがたいです。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です