SwiftUI/PropertyWrapper
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
|
ログイン
]
開始行:
&tag(SwiftUI/PropertyWrapper);
*目次 [#z8da1a17]
#contents
*関連ページ [#n88c2da1]
*参考情報 [#ua83d4c0]
-[[SwiftUIのデータ管理 Property Wrapper編:https://blog.pe...
*Property Wrapperの種類 [#l9739a89]
-@State、@Binding、@StateObject、@ObservedObjectなどデー...
** @State [#b535e418]
-データが値型。データの更新あり。データの発生源がVIewの場...
-ボタンをタップするとその数字が増える。
#pre{{
struct StateSample: View {
private var counter = 0
var body: some View {
Button(action: {
self.counter += 1
}, label: {
Text("counter is \(counter)")
})
}
}
}}
** @Binding [#pd81fb92]
-データが値型。データの更新あり。データの発生源は外部。
#pre{{
struct ParentView: View {
@State private var counter = 0
var body: some View {
ChildView(counter: $counter)
.frame(width: .infinity)
}
}
struct ChildView: View {
@Binding var counter: Int
var body: some View {
Button(action: {
counter += 1
}, label: {
Text("\(counter)")
.font(.title)
})
.border(Color.red)
}
}
}}
** @Environment [#j1aa4f77]
-Viewの環境値を読み取れるもの。KeyPathを指定する。
#pre{{
struct EnvironmentSample: View {
@Environment(\.colorScheme) var colorScheme: ColorSch...
var body: some View {
if colorScheme == .dark {
Text("dark mode")
} else if colorScheme == .light {
Text("light mode")
} else {
Text("")
}
}
}
}}
** ObservableObjectプロトコル [#oc30aca6]
-@StateObject、@ObservedObject、@EnvironmentObjectとして...
#pre{{
class DataSource: ObservableObject {
@Published var counter = 0
}
}}
** @StateObject [#g4dfa573]
-データが参照型のデータオブジェクト。データの発生源がVIew...
-iOS 14以降。
#pre{{
struct StateObjectSample: View {
@StateObject private var dataSource = DataSource()
var body: some View {
VStack {
Button("increment counter") {
dataSource.counter += 1
}
Text("StateObject count： \(dataSource.counte...
.font(.title)
}
}
}
}}
** @ObservedObject [#w79717f5]
-データが他参照のデータオブジェクト。データの発生源が外部。
#pre{{
fileprivate
struct ParentView: View {
@StateObject private var dataSource = DataSource()
var body: some View {
ChildView(dataSource: dataSource)
}
}
fileprivate
struct ChildView: View {
@ObservedObject var dataSource: DataSource
var body: some View {
VStack {
Button("increment counter") {
dataSource.counter += 1
}
Text("count： \(dataSource.counter)")
}
}
}
}
}
** @StateObjectと@ObservedObjectの違い
-以下のサンプルを考える。
#pre{{
struct StateObjectCounterView: View {
@StateObject private var dataSource = DataSource()
var body: some View {
VStack {
Button("increment counter") {
dataSource.counter += 1
}
Text("StateObject count： \(dataSource.counte...
.font(.title)
}
}
}
struct ObservedObjcetCounterView: View {
@ObservedObject private var dataSource = DataSource()
var body: some View {
VStack {
Button("increment counter") {
dataSource.counter += 1
}
Text("ObservedObject count： \(dataSource.cou...
.font(.title)
}
}
}
struct SwitchColorView: View {
@State private var isDanger: Bool = false
var body: some View {
VStack {
Button("Change the Color") {
isDanger.toggle()
}
if isDanger {
Circle().foregroundColor(.red)
.frame(width: 200, height: 200)
} else {
Circle().foregroundColor(.green)
.frame(width: 200, height: 200)
}
StateObjectCounterView()
ObservedObjcetCounterView()
Spacer()
}
}
}
}}
-StateObjectとObservedObjectをカウントアップした後、「Cha...
-@StateObjectはViewを表示してから非表示まで。@ObservedObj...
-これを避けるためには、@ObservedObjectには親Viewからわた...
**@EnvironmentObject [#s5554de0]
-参照型オブジェクトを子ビューでアクセスできるようになる。
#pre{{
fileprivate
struct ParentView: View {
var body: some View {
ChildView()
}
}
fileprivate
struct ChildView: View {
var body: some View {
GrandChildView()
}
}
fileprivate
struct GrandChildView: View {
@EnvironmentObject var dataSource: DataSource
var body: some View {
Text("\(dataSource.counter)")
}
}
struct EnvironmentObjectSample_Previews: PreviewProvider {
@StateObject static private var dataSource = DataSour...
static var previews: some View {
ParentView().environmentObject(dataSource)
}
}
}}
終了行:
&tag(SwiftUI/PropertyWrapper);
*目次 [#z8da1a17]
#contents
*関連ページ [#n88c2da1]
*参考情報 [#ua83d4c0]
-[[SwiftUIのデータ管理 Property Wrapper編:https://blog.pe...
*Property Wrapperの種類 [#l9739a89]
-@State、@Binding、@StateObject、@ObservedObjectなどデー...
** @State [#b535e418]
-データが値型。データの更新あり。データの発生源がVIewの場...
-ボタンをタップするとその数字が増える。
#pre{{
struct StateSample: View {
private var counter = 0
var body: some View {
Button(action: {
self.counter += 1
}, label: {
Text("counter is \(counter)")
})
}
}
}}
** @Binding [#pd81fb92]
-データが値型。データの更新あり。データの発生源は外部。
#pre{{
struct ParentView: View {
@State private var counter = 0
var body: some View {
ChildView(counter: $counter)
.frame(width: .infinity)
}
}
struct ChildView: View {
@Binding var counter: Int
var body: some View {
Button(action: {
counter += 1
}, label: {
Text("\(counter)")
.font(.title)
})
.border(Color.red)
}
}
}}
** @Environment [#j1aa4f77]
-Viewの環境値を読み取れるもの。KeyPathを指定する。
#pre{{
struct EnvironmentSample: View {
@Environment(\.colorScheme) var colorScheme: ColorSch...
var body: some View {
if colorScheme == .dark {
Text("dark mode")
} else if colorScheme == .light {
Text("light mode")
} else {
Text("")
}
}
}
}}
** ObservableObjectプロトコル [#oc30aca6]
-@StateObject、@ObservedObject、@EnvironmentObjectとして...
#pre{{
class DataSource: ObservableObject {
@Published var counter = 0
}
}}
** @StateObject [#g4dfa573]
-データが参照型のデータオブジェクト。データの発生源がVIew...
-iOS 14以降。
#pre{{
struct StateObjectSample: View {
@StateObject private var dataSource = DataSource()
var body: some View {
VStack {
Button("increment counter") {
dataSource.counter += 1
}
Text("StateObject count： \(dataSource.counte...
.font(.title)
}
}
}
}}
** @ObservedObject [#w79717f5]
-データが他参照のデータオブジェクト。データの発生源が外部。
#pre{{
fileprivate
struct ParentView: View {
@StateObject private var dataSource = DataSource()
var body: some View {
ChildView(dataSource: dataSource)
}
}
fileprivate
struct ChildView: View {
@ObservedObject var dataSource: DataSource
var body: some View {
VStack {
Button("increment counter") {
dataSource.counter += 1
}
Text("count： \(dataSource.counter)")
}
}
}
}
}
** @StateObjectと@ObservedObjectの違い
-以下のサンプルを考える。
#pre{{
struct StateObjectCounterView: View {
@StateObject private var dataSource = DataSource()
var body: some View {
VStack {
Button("increment counter") {
dataSource.counter += 1
}
Text("StateObject count： \(dataSource.counte...
.font(.title)
}
}
}
struct ObservedObjcetCounterView: View {
@ObservedObject private var dataSource = DataSource()
var body: some View {
VStack {
Button("increment counter") {
dataSource.counter += 1
}
Text("ObservedObject count： \(dataSource.cou...
.font(.title)
}
}
}
struct SwitchColorView: View {
@State private var isDanger: Bool = false
var body: some View {
VStack {
Button("Change the Color") {
isDanger.toggle()
}
if isDanger {
Circle().foregroundColor(.red)
.frame(width: 200, height: 200)
} else {
Circle().foregroundColor(.green)
.frame(width: 200, height: 200)
}
StateObjectCounterView()
ObservedObjcetCounterView()
Spacer()
}
}
}
}}
-StateObjectとObservedObjectをカウントアップした後、「Cha...
-@StateObjectはViewを表示してから非表示まで。@ObservedObj...
-これを避けるためには、@ObservedObjectには親Viewからわた...
**@EnvironmentObject [#s5554de0]
-参照型オブジェクトを子ビューでアクセスできるようになる。
#pre{{
fileprivate
struct ParentView: View {
var body: some View {
ChildView()
}
}
fileprivate
struct ChildView: View {
var body: some View {
GrandChildView()
}
}
fileprivate
struct GrandChildView: View {
@EnvironmentObject var dataSource: DataSource
var body: some View {
Text("\(dataSource.counter)")
}
}
struct EnvironmentObjectSample_Previews: PreviewProvider {
@StateObject static private var dataSource = DataSour...
static var previews: some View {
ParentView().environmentObject(dataSource)
}
}
}}
ページ名:
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
