質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.46%
Xcode

Xcodeはソフトウェア開発のための、Appleの統合開発環境です。Mac OSXに付随するかたちで配布されています。

Swift

Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

Q&A

解決済

2回答

3115閲覧

SwiftUI - ボタンで複数TextFieldを生成させたい

ko-ru

総合スコア27

Xcode

Xcodeはソフトウェア開発のための、Appleの統合開発環境です。Mac OSXに付随するかたちで配布されています。

Swift

Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

0グッド

0クリップ

投稿2021/05/30 07:43

編集2021/05/30 12:17

前提・実現したいこと

ボタンを押したら、入力可能なTextFieldおよび、TextEditorを生成させたい。

ユーザがボタンを押したら、入力項目を自由に増やせるような機能を作成したいと考えていますが、実装できずにいます。

以下StackOverFlowを参照して試してはみましたが、TextEditorは文字入力ができず、TextFieldは文字入力はできるが入力後、生成ボタンを押すと内容が消えてしまいます。
https://stackoverflow.com/questions/60589725/foreach-textfield-in-swiftui

以下に載せているコードでボタンを押下すると、上手く生成されますが、ボタンを押すとTextField内に書いた内容が初期化されてしまうのと、入力された内容の取得方法がわからない状況です。

ご教授お願いいたします。

実現イメージ (ボタンを押した時の動作)

イメージ説明
イメージ説明

発生している問題・エラーメッセージ

以下のような紫のワーニングが出ます

Accessing State's value outside of being installed on a View. This will result in a constant Binding of the initial value and will not update.

該当のソースコード

Swift

1import SwiftUI 2 3struct Student: Identifiable { 4 var id = UUID() 5 @State var name = "" 6} 7 8struct Class: Identifiable { 9 var id = UUID() 10 var students = [ 11 Student(name: "Yo"), 12 Student(name: "Ya"), 13 ] 14} 15 16struct ContentView: View { 17 @State private var newClass = Class() 18 19 var body: some View { 20 VStack() { 21 Button(action: { 22 newClass.students.append(Student(name: "test")) 23 }){ 24 Text(" Add ").padding() 25 .background(Color.black) 26 .foregroundColor(.white) 27 } 28 Form { 29 ForEach(self.newClass.students) { student in 30 TextField("",text: student.$name) // ★ここで紫ワーニング 31 TextEditor(text: student.$name) // ★ここで紫ワーニング 32 } 33 } 34 } 35 } 36} 37

補足情報(FW/ツールのバージョンなど)

SwiftUI、Xcode

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

自己解決

以下の方法で解決できました。

@Stateの配列を作成し状態監視し、ボタン押下時に状態監視している配列にappend
中身が変更された変数は再読み込みを実施しForEachが回りTextField生成。

参照は、wordsに配列で格納されているため、そこから取得可能

Swift

1struct ContentView: View { 2 @State var words = ["", ""] 3 var body: some View { 4 VStack { 5 Button("Add") { 6 self.words.append("") 7 } 8 List { 9 ForEach(words.indices, id: .self) { i in 10 TextField("", text: self.$words[i]) 11 } 12 } 13 } 14 } 15} 16

投稿2021/05/30 13:58

編集2021/05/30 14:06
ko-ru

総合スコア27

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

ボタンクリックでビューの表示非表示を切り替えるだけなら、toggle()する方法がありますが。
「入力項目を自由に増やしたい」だけではさっぱり意味が分かりませんので、参考程度にしてください。

@State var showView = false Button(action: { showView.toggle() }, label: { Text("TextFieldを表示します") }) if showView { TextField("何か入力してください", text: $data) }

イメージ説明
イメージ説明

投稿2021/05/30 09:23

technocore

総合スコア7247

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

ko-ru

2021/05/30 09:50

説明不足で申し訳ございません。 ボタンを押すと非表示viewを表示させるではなく、ボタンを押す度に新たなTextFieldを生成したいという意味になります。
ko-ru

2021/05/30 10:32

実現イメージを追加させていただきました。 その他不明点があれば教えていただければと思います。 よろしくお願いします。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.46%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問