[Lesson1-5] TextFieldで入力したものをTextに表示する

・はじめに

このシリーズは自分自身の学習記録を自分が後に振り返れるように記録していく事が目的です。よって”見やすく”と言う観点では作成されていません。しかし、私自身の成長と後の成果が、この記録に大きな意味をもたらしてくれると思いStudyLog＝SLogを始めようと思い始めました。この記録が技術的な事はもちろん、他の要因でも、いつか誰かの役にたてば幸いです。また私の成長記録も暖かい目で見て頂けると嬉しいです。では早速本日の記録をスタートしていきましょう！

・TextFieldで入力したものをTextに表示する

SwiftUIの@Stateプロパティラッパーを使用すると、ビューの構造を自由に変更できます。つまり、プログラムが変更されると、ビューのプロパティを更新して一致させることができます。ただし、ユーザーインターフェイスコントロールを使用すると、処理が少し複雑になります。たとえば、ユーザーが入力できる編集可能なテキストボックスを作成する場合は、次のようなSwiftUIビューを作成します。

struct ContentView: View {
   var body: some View {
       Form {
           TextField("Enter keyboard")
           Text("Hello World")
       }
   }
}

これは、テキストフィールドとテキストビューを含むフォームを作成しています。ただし、SwiftUIがテキストフィールドのテキストを格納する場所を知りたいので、そのコードはコンパイルされません。
ビューはその状態の関数であることを覚えておいてください。そのテキストフィールドは、プログラムに格納されている値を反映している場合にのみ、何かを表示できます。SwiftUIが必要としているのは、テキストフィールド内に表示できる構造体の文字列プロパティであり、ユーザーがテキストフィールドに入力したものもすべて格納します。

したがって、コードは以下の通りです。

import SwiftUI
    struct ContentView: View {
       @State private var number = ""

       var body: some View {
           Form {
               TextField("Enter your Lesson number", text: $number)
               Text("To day Lesson\(number)")
           }
       }
    }
struct ContentView_Previews: PreviewProvider {
   static var previews: some View {
       ContentView()
   }
}

＄を使用していますが＄numberとする事で入力した文字が変数numberに入る事を意味します。

本日は以上。

TextFieldで入力したものをTextに表示する。でした。