Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
SwiftUI ͷ @State, @ObservedObject, @EnvironentObject 2019/11/11 potatotips #66 twitter.com/kumamo_tone
Slide 2
Slide 2 text
• iOS/AndroidΤϯδχΞˏϠϑʔ • ษڧձӡӦ • Bonfire iOSɺWWDC Extended ͳͲ • ࠷ۙࣾ༻ͷΞϓϦΛSwiftUIͰ࡞Γ·ͨ͠ ۽ຊ ਖ਼ (@kumamo_tone)
Slide 3
Slide 3 text
SwiftUI iOS13Ͱొͨ͋ͨ͠Β͍͠ϑϨʔϜϫʔΫ એݴతʹUIΛهड़Ͱ͖Δ
Slide 4
Slide 4 text
No content
Slide 5
Slide 5 text
struct ContentView: View { @State var isOn: Bool var body: some View { Toggle(isOn: $isOn) { if self.isOn { Text("On") } else { Text("Off") } }.frame(width: 200) } } #PPMܕͷ ϓϩύςΟ
Slide 6
Slide 6 text
struct ContentView: View { @State var isOn: Bool var body: some View { Toggle(isOn: $isOn) { if self.isOn { Text("On") } else { Text("Off") } }.frame(width: 200) } } #PPMܕͷ ϓϩύςΟ 7JFXΛએݴ #PPMͷঢ়ଶ͕มΘΔͱɺ উखʹมΘΔ
Slide 7
Slide 7 text
struct ContentView: View { @State var isOn: Bool var body: some View { Toggle(isOn: $isOn) { if self.isOn { Text("On") } else { Text("Off") } }.frame(width: 200) } } #PPMܕͷ ϓϩύςΟ 7JFXΛએݴ #PPMͷঢ়ଶ͕มΘΔͱɺ উखʹมΘΔ !4UBUF͕͍͍ͭͯΕ
Slide 8
Slide 8 text
• @State • @ObservedObject • @EnvironentObject View Binding༻ͷProperty Wrappers Property Wrappersʹ͍ͭͯͷ ͘Θ͍͠આ໌ɺҎલεϥΠυʹ·ͱΊͨͷͰ Α͔ͬͨΒࢀߟʹ͍ͯͩ͘͠͞
Slide 9
Slide 9 text
@State
Slide 10
Slide 10 text
@State • ͍ͪΜجຊతͳόΠϯσΟϯάํ๏
Slide 11
Slide 11 text
struct ContentView: View { @State var isOn: Bool var body: some View { Toggle(isOn: $isOn) { if self.isOn { Text("On") } else { Text("Off") } }.frame(width: 200) } } ͜ͷϓϩύςΟ ͷมߋ͕ ݕͰ͖ΔΑ͏ʹͳΔ
Slide 12
Slide 12 text
@State ͷಛ • ੍ݶ • એݴͨ͠ViewͱͦͷࢠViewͰ͔͔ͭ͑͠ͳ͍ • Viewʹ͕ؔ͋ΔʢͰ͖ΕʣprivateͳϓϩύςΟʹ͔ͭ͏ • Toggleͷঢ়ଶ • TabViewͷબঢ়ଶ, • ButtonͷisEnabledɹͳͲ
Slide 13
Slide 13 text
@ObservedObject
Slide 14
Slide 14 text
• ࣗ࡞Ϋϥεͷঢ়ଶΛόΠϯσΟϯά͢Δ͜ͱ͕Ͱ͖Δ @ObservedObject
Slide 15
Slide 15 text
struct ContentView: View { @State var userFirstName: String @State var userLastName: String }
Slide 16
Slide 16 text
struct ContentView: View { @State var user: User } struct ContentView: View { @State var userFirstName: String @State var userLastName: String } ʢTUSVDUʹͨ͠߹ʣ ϓϩύςΟͷมߋ͕͋Δͱɺ શମΛஔ͖͑Δඞཁ͕ ͋ΔͨΊɺDMBTTʹ͍ͨ͠ ͱ͖͕͋Δ
Slide 17
Slide 17 text
struct ContentView: View { @State var user: User } struct ContentView: View { @State var userFirstName: String @State var userLastName: String } ʢDMBTTʹͨ͠߹ʣ VTFSͷมߋݕͰ͖Δ͕ɺ VTFSpSTU/BNF ͷมߋݕͰ͖ͳ͍
Slide 18
Slide 18 text
struct ContentView: View { @ObservedObject var user: User } struct ContentView: View { @State var userFirstName: String @State var userLastName: String }
Slide 19
Slide 19 text
class User: ObservableObject { @Published var userFirstName: String @Published var userLastName: String } ద߹͢Δͱ !0CTFSWFE0CKFDU ͱͯ͑͠Δ
Slide 20
Slide 20 text
class User: ObservableObject { @Published var userFirstName: String @Published var userLastName: String } ద߹͢Δͱ !0CTFSWFE0CKFDU ͱͯ͑͠Δ !1VCMJTIFEΛ͚ͭΔͱ มߋΛݕͰ͖ΔΑ͏ʹͳΔ
Slide 21
Slide 21 text
• ͍Ͳ͜Ζ • Viewʹؔ͢ΔclassʢViewModelͳͲʣΛͻͱ·ͱΊʹ͍ͨ͠ͱ͖ @ObservedObject ͷಛ
Slide 22
Slide 22 text
@EnvironmentObject
Slide 23
Slide 23 text
No content
Slide 24
Slide 24 text
class GameSettings: ObservableObject { @Published var isHard: Bool = false }
Slide 25
Slide 25 text
struct ContentView: View { @ObservedObject var settings: GameSettings = GameSettings() var body: some View { NavigationView { List { NavigationLink(destination: NextView(settings: self.settings)) { Text("\(settings.isHard ? "Hard" : "Easy")") }}}}} struct NextView: View { @ObservedObject var settings: GameSettings var body: some View { Toggle(isOn: $settings.isHard) { self.settings.isHard ? Text("Hard") : Text("Easy") }}} ભҠઌͷ7JFXΛ ࢦఆ
Slide 26
Slide 26 text
struct ContentView: View { @ObservedObject var settings: GameSettings = GameSettings() var body: some View { NavigationView { List { NavigationLink(destination: NextView(settings: self.settings)) { Text("\(settings.isHard ? "Hard" : "Easy")") }}}}} struct NextView: View { @ObservedObject var settings: GameSettings var body: some View { Toggle(isOn: $settings.isHard) { self.settings.isHard ? Text("Hard") : Text("Easy") }}} ΠχγϟϥΠβʹ ͢
Slide 27
Slide 27 text
UIHostingController( rootView: ContentView() .environmentObject(GameSettings()) ) &OWJSPONFOUʹొ
Slide 28
Slide 28 text
• EnvironmentʢViewؒͰڞ༗͢ΔγϯάϧτϯͷΑ͏ͳͷʣ ʹొ͞Ε͍ͯΔใΛऔΓग़͢ @EnvironmentObject
Slide 29
Slide 29 text
struct ContentView: View { @ObservedObject var settings: GameSettings = GameSettings() var body: some View { NavigationView { List { NavigationLink(destination: NextView(settings: self.settings)) { Text("\(settings.isHard ? "Hard" : "Easy")") }}}}} struct NextView: View { @ObservedObject var settings: GameSettings var body: some View { Toggle(isOn: $settings.isHard) { self.settings.isHard ? Text("Hard") : Text("Easy") }}}
Slide 30
Slide 30 text
struct ContentView: View { @EnvironmentObject var settings: GameSettings var body: some View { NavigationView { List { NavigationLink(destination: NextView()) { Text("\(settings.isHard ? "Hard" : "Easy")") }}}}} struct NextView: View { @EnvironmentObject var settings: GameSettings var body: some View { Toggle(isOn: $settings.isHard) { self.settings.isHard ? Text("Hard") : Text("Easy") }}} Կ͞ͳͯ͘Α͍
Slide 31
Slide 31 text
• ͍Ͳ͜Ζʢओ؍ʣ • ΞϓϦશମͰ͏ใͳͲɺ ΠχγϟϥΠβͰ͍ͯ͘͠ͷ͕ΊΜͲ͍͘͞ͱ͖ @EnvironmentObject ͷಛ
Slide 32
Slide 32 text
·ͱΊ
Slide 33
Slide 33 text
• @State • ϓϩύςΟΛόΠϯσΟϯάͰ͖Δ • @ObservedObject • ࣗ࡞ΫϥεΛόΠϯσΟϯάͰ͖Δ • όΠϯσΟϯά͢ΔPropertyʹ@PublishedΛ͚ͭΔ • @EnvironentObject • ΠχγϟϥΠβܦ༝ͰViewؒͷσʔλͷड͚͕͠Ͱ͖Δ • @EnvironentObject Ͱ Environment ܦ༝Ͱड͚͕͠Ͱ͖Δ ·ͱΊ
Slide 34
Slide 34 text
• What's New in Swift • https://developer.apple.com/videos/play/wwdc2019/402/ • SwiftUIͷProperty WrappersͱσʔλͷΞΫηεํ๏ • https://qiita.com/shiz/items/6eaf87fa79499623306a References