SwiftUIでいこう! - List,identifiable。
SwiftUIでリストを作ります。
MacのXcodeのPlaygroundでなく、iPadアプリがMacに移植されて最近使えるようになったPlaygrounds.appを使って試します。基本的にはXcodeのPlaygroundと同じです。
表示させるための基本的なコードです。
import SwiftUI
import MapKit
import PlaygroundSupport
struct ContentView: View {
var body: some View {
Text("Hello")
}
}
let content = ContentView()
PlaygroundPage.current.liveView = UIHostingController(rootView: content)
これで"Hello"と表示されます。以下サイトを参考に実際に確認しながら進めていきます。
普通にリストを作ってみます。
struct ContentView: View {
let users = ["sato", "suzuki", "watanabe"]
var body: some View {
List(users){ user in
Text(user)
}
}
}
実行してみると、
エラーです。
Initializer 'init(_:rowContent:)' requires that 'String' conform to 'Identifiable'
エラーが出る原因ですが、"Identifiable"が必要ということを教えてくれています。Identifiableの必要性については以下が参考になると思います。
一意のidを付与しなければならないのかというとSwiftUI側がそのViewで利用されているデータがどれなのかを特定しておかないと、データが更新されたときにどのViewを再構築すればいいのかわからなくなってしまうからです。今回の場合、SwiftUI側がTextビューそれぞれのデータを区別したいので予めidを割り振る必要があります。
ということで更新時のデータ整理のために必要ということみたいです。
どうやって使っていくかですけど、まず配列で使う項目をプロトコルIdentifiable準拠した構造体を作って宣言します。
struct User: Identifiable {
var id: String
var name: String
}
この構造体で宣言したプロパティを使って配列をstruct ContentView: View { }直下に書きます。
let users = [
User(id: "001", name: "sato"),
User(id: "002", name: "suzuki"),
User(id: "003", name: "watanabe")
]
次に var body: some View {}でList{}を使いループで回します。
var body: some View {
List(users){ user in
Text(user.name)
}
}
実行すると、リストが表示されるようになります。 Text(user.name)なので、名前が取得され表示されています。
全体です。
struct User: Identifiable {
var id: String
var name: String
}
struct ContentView: View {
let users = [
User(id: "001", name: "sato"),
User(id: "002", name: "suzuki"),
User(id: "003", name: "watanabe")
]
var body: some View {
List(users){ user in
Text(user.name)
}
}
}
ここでMacに移植された"Playgrounds.app"の画面構成を少し紹介。iPadと同じですが
この記事が気に入ったらサポートをしてみませんか?