見出し画像

[Lesson1-2]Formを使ってテキストリストを作ってみる

・はじめに

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

・Form

今回はテキストをリストのように表示する為にFormについて学習していきます。
フォームは、テキストや画像などの静的コントロールのスクロールリストですが、テキストフィールド、トグルスイッチ、ボタンなどのユーザーインタラクティブコントロールを含めることもでるとのこと。
以下コード

import SwiftUI

struct ContentView: View {
  var body: some View {
       Form {
           Text("Hello World")
       }
   }
}
struct ContentView_Previews: PreviewProvider {
   static var previews: some View {
       ContentView()
   }
}

ちなみにこんな感じ。

スクリーンショット 2020-06-12 3.34.22

このFormですが10行までは表示しますが11行以降は表示されません。
しかし、以下の方法で解決できます。

Form {
   Group {
       Text("Hello World")
       Text("Hello World")
       Text("Hello World")
       Text("Hello World")
       Text("Hello World")
       Text("Hello World")
   }

   Group {
       Text("Hello World")
       Text("Hello World")
       Text("Hello World")
       Text("Hello World")
       Text("Hello World")
   }
}

スクリーンショット 2020-06-12 3.42.11

・Section

またセクション事に分けたい場合はSectionを使います。

import SwiftUI

struct ContentView: View {
  var body: some View {
Form {
    Section {
        Text("To Day Work")
        Text("1")
        Text("2")
       
    }

    Section {
        Text("To Do List")
        Text("SwiftUI")
    }
}
   }
}
struct ContentView_Previews: PreviewProvider {
   static var previews: some View {
       ContentView()
   }
}

スクリーンショット 2020-06-12 3.46.31

こんな感じ。

以上Formについてでした。

参考サイト


いいねと思えたらよろしくお願いします😋