[SwiftUI]Alert(アラート)にTextFieldを追加する方法[Xcode]

スポンサーリンク
SwiftUI
スポンサーリンク

どうも、ちょげ(@chogetarou)です。

この記事では、SwiftUIでAlertにTextFieldを追加する方法について解説します。

スポンサーリンク

方法

まず、SwiftUIには、TextFieldありのAlertが存在しません。

なので、TextFieldをアラートにつけるには次の2つの方法をとる必要があります。

  1. Alertを自作する
  2. UIKitのAlertを使う

Alertを自作する

ひとつは、Alertを自作してしまう方法です。

簡単なものであれば、ZStackでビューの上に別のビューを表示させることでアラートのようにすることができます。

こちらはZStackで実装した例です。

@State var onAlert = false
    @State var text = ""
    var body: some View {
        ZStack {
            Button(action: {
                self.onAlert.toggle()
            }) {
                Text("ボタン")
            }
            
            if onAlert {
                ZStack() {
                        Rectangle()
                            .foregroundColor(.gray)
                        VStack {
                            Text("アラート")
                            TextField("テキスト",text: $text)
                            HStack {
                                Button("OK") {
                                    self.onAlert.toggle()
                                }
                            }
                        }.padding()
                }
                            .frame(width: 300, height: 180,alignment: .center)
                            .cornerRadius(20).shadow(radius: 20)
            }
        }
    }

ボタンを押すことで、上記のようなアラートが表示され、OKを押すとアラートが消えます。

ZStackであれば、簡単かつレイアウトを工夫しやすいのも魅力です。

もっとレベルが高いのは、こちらの記事で本来のアラートに近いカスタマイズがありますので、そちらを参考にしてみてください

UIKitのアラート

もうひとつは、UIKitを使う方法です。

UIKitであればTextFieldありのアラートを作成することができます。

この方法については、他の方が既に記事を投稿していましたので、そちらを参考にしてください。

参考になる記事 >>> https://www.yururiwork.net/archives/1315

まとめ

  • TextFieldありのアラートはSwiftUIにはない
  • TextFiledをつけたいなら「自作」、もしくはUIKitを使う

合わせて読みたい記事

[SwiftUI][Xcode]文字入力欄を作る「TextField」の使い方
2021/6/10

「文字入力欄を作りたい」

「TextFieldってどうやって使えばいいの?」

「TextFieldって何?」

と言う人に向けて、この記事は書かれています。

どうも、ちょげ(@chogetarou)です。

iOSアプリでは、ユーザに文字を入力してもらいたい場面というのがありますよね。

SwiftUIでは、TextFieldという文字入力欄のビューが用意されています。

この記事では、TexFieldビューの使い方を解説します。

コメント

タイトルとURLをコピーしました