Mahmoud Fathelbab - Etisalat

1. DEEP DIVE INTO SWIFTUI

2. • Sr.iOS Developer, Etisalat Misr
• My Etisalat
• Etisalat Cash
• Sr.iOS Developer Vodafone Egypt
• Mobile App Consultant, freelancing
AUTHER
MAHNOUD FATHELBAB

3. • Declarative Programming
• SwiftUI vs UIKit
• Demo
• SwiftUI Concepts - Modifiers - Data Binding
• Combine Framework
• Interfacing SwiftUI and UIKit
29/01/2019 SwiftUI 3
AGENDA

4. • Declarative programming is Define a Target and the compiler / framework will figure out the how
to do it.
• Imperative programming is commands and orders step by step to execute Target
29/01/2019 SWIFTUI 4
DECLARATIVE PROGRAMMING

5. • HTML
• FLUTTER
• React & React Native
29/01/2019 SWIFTUI 5
OTHER DECLARATIVE UI FRAMEWORKS

6. 29/01/2019 SWIFTUI 6

7. 29/01/2019 SWIFTUI 7

8. • Simple way to build user interfaces across all Apple platforms(macOS,
watchOS , iOS ).
• With a declarative Swift syntax that’s easy to read and natural to
write.
29/01/2019 SWIFTUI 8
WHAT IS SWIFT UI??

9. • Xcode : 11 or newer
• macOS : 10.15 Catalina or newer(live streaming)
• iOS :13.0 or newer
29/01/2019 SWIFTUI 9
REQUIREMENTS

10. 29/01/2019 SWIFTUI 10
SIMPLEST SWIFTUI VIEW
• View Protocol :- A type that represents part of your app’s user interface and provides
modifiers that you use to configure views (Not actual view , represent view structure
represntation).
• Body:- The content and behavior of the view.

11. 29/01/2019 SWIFTUI 11
LET’S CUSTOMIZE IT

12. 29/01/2019 SWIFTUI 12
SOMETHING MORE COMPLEX
struct MarvelCharcter: Hashable, Identifiable {
let id: String
let image: String
let title: String
let desc: String
}

13. 29/01/2019 SWIFTUI 13
SOMETHING MORE COMPLEX

14. 29/01/2019 SWIFTUI 14
Demo#1 (UIKit vs SwiftUI)

15. • NavigationView(content: ...)
• NavigationLink(destination: … , content ….)
29/01/2019 SWIFTUI 15
NAVIGATION

16. 29/01/2019 SWIFTUI 16
Demo#2 (Navigation)

17. • @State
• @ObjectBinding
• @ EnvironmentObject
• $property
29/01/2019 SWIFTUI 17
SWIFTUI DATA BINDING

18. 29/01/2019 SWIFTUI 18
@STATE

19. 29/01/2019 SWIFTUI 19
@STATE

20. 29/01/2019 SWIFTUI 20
@STATE

21. 29/01/2019 SWIFTUI 21
@STATE

22. 29/01/2019 SWIFTUI 22
@OBJECTBINDING

23. 29/01/2019 SWIFTUI 23
@ENVIRONMENT OBJECT

24. 29/01/2019 SWIFTUI 24
Demo#3 (@State &
@EnvironmentObject)

25. ● UIKit in SwiftUI :
UIViewRepresentable & UIViewControllerRepresentable protocols .
● SwiftUI in UIKit
UIHostingViewController(rootView : …)
29/01/2019 SWIFTUI 25
UIKIT INTEGRATION

26. 29/01/2019 SWIFTUI 26
PREVIEWS

27. 29/01/2019 SWIFTUI 27
Demo#4 (Previews & CrossPlatform)

28. • https://developer.apple.com/documentation/swiftui
• https://goshdarnswiftui.com/
29/01/2019 SWIFTUI 28
REFERENCES

29. 29/01/2019 SWIFTUI 29
Thank You All Folks 😇
😇