Playgroundを使ってやっていきます。

今回はボタンなどイベントの処理について試していきます。

import SwiftUI
import PlaygroundSupport

// この場所にコードを書いていきます。

let content = ContentView()
PlaygroundPage.current.liveView = UIHostingController(rootView: content)

基本のコードです。

次スライドボタンです。

struct ContentView : View {

   @State var showGreeting = true

   var body: some View {
       VStack {
           Toggle(isOn: $showGreeting) {
               Text("Show welcome message")
           }.padding()
           if showGreeting {
               Text("Hello World!")
           }
       }
   }
}

@State var showGreeting = true

まず真偽について定義しておきます。ここで大事なのは@Stateですね。

いつもの"var body: some View"の後に表示させる部分を書いていきます。

Toggle()でスイッチの部品を配置していきます。VStackなので縦に表示させます。Text()で文字の表示ですね。そして.paddingで間を開けて、

if showGreeting{}で真偽で判定させ表示部分に変化をつけます。

と表示されスイッチをon,offできるようになりました。

次にTabを紹介します。

　 @State private var favoriteColor = 0

   var body: some View {
       VStack {
           SegmentedControl(selection: $favoriteColor) {
               Text("Red").tag(0)
               Text("Green").tag(1)
               Text("Blue").tag(2)
           }
           Text("Value: \(favoriteColor)")
       }
   }

ここではタブ3つを表示させます。tag(0),(1),(2)で識別しています。

それぞれText()で文字も表示させています。そして、"favoriteColor"変数に入れることでタブを切り替えていきます。

SegmentedControl(selection: $favoriteColor)

ですね。そしてその下にText()で現在のタブ名ほ表示します。

　 @State private var favoriteColor = 0
   var colors = ["Red", "Green", "Blue"]
   var body: some View {
       VStack {
           SegmentedControl(selection: $favoriteColor) {
               ForEach(0..<colors.count) { index in
                   Text(self.colors[index]).tag(index)
               }
           }
           Text("Value: \(colors[favoriteColor])")
       }
   }

ForEach()でやった方がスッキリしますね。

そして次はタップアクション。これすごく簡単！

Text("Tap me!")
   .tapAction {
       print("Tapped!")
   }

.tapAction {
print("Tapped!")
}

これつけるだけでいけます。

.tapAction(count: 2)

そしてcount:numberでnumberの数だけのタップでアクションが起きるようになります。