はじめに
SwiftUIからUIKitの利用を理解する為の二歩目として
・値を渡す。
・値が変わったら、表示を変更する。
最低限の実装方法を記載したものです。
最初の一歩は下記参照
https://qiita.com/ikaasamay/items/108ac5c211b75a9739d4
環境
macOS Big Sur 11.1
XCode 12.4
Swift 5
実装
SwiftUI側でボタン押下時に
countを+1して、
UIKit側では+1された値を追従して表示しています。
ContentView.swift
import SwiftUI
struct ContentView: View {
@State var count = 0
var body: some View {
ZStack (alignment: .center) {
// SwiftUI -------------
VStack {
HStack {
Text("SwiftUI")
Spacer()
}
// 加算ボタン
Button(action: {
// 加算処理
count += 1
}){
// 加算ボタンのレイアウト
Text("加算ボタン")
.font(.largeTitle)
// ボタンらしくレイアウトを調整
.frame(width: 250, height: 40, alignment: .center)
.overlay(
RoundedRectangle(cornerRadius: 10)
.stroke(Color.blue, lineWidth: 2)
)
}
Spacer()
}
// UIKitへcountを引数で渡す。
CountUIKitLabel(count: $count)
.frame(height: 100)
}
}
}
struct CountUIKitLabel:UIViewRepresentable {
// 表示する値を保持するプロパティ
@Binding var count:Int
// SwiftUI側に返却するUILabelのインスタンスを返却する。
func makeUIView(context: Context) -> UILabel {
let label = UILabel()
label.backgroundColor = UIColor.red
label.textAlignment = NSTextAlignment.center
return label
}
// プロパティ(count)が変更されると、その都度実行する。
func updateUIView(_ uiView: UILabel, context: Context) {
uiView.text = "UIKit " + count.description
}
}
次回はコーディネーターを記事にする予定