UI Design and Storyboarding

Transcription

1 UI Design and Storyboarding Mobile Application Development in ios School of EECS Washington State University Instructor: Larry Holder Mobile Application Development in ios 1

2 Outline Model-View-Controller (MVC) design Storyboarding Delegates Multi-threading Mobile Application Development in ios 2

3 Model-View-Controller (MVC) class ViewController { IBAction IBOutlet Delegate Data Storyboard class Model { var value: Int Mobile Application Development in ios 3

4 Model protocol MyTimerDelegate { func timechanged (time: Int) func timesup (message: String) class MyTimer { var initialtime: Int var currenttime: Int var message: String var running: Bool var delegate: MyTimerDelegate? init (initialtime: Int, message: String) { self.initialtime = initialtime self.currenttime = initialtime self.message = message self.running = false Mobile Application Development in ios 4

5 Model func start () { running = true func stop () { running = false func reset () { currenttime = initialtime delegate?.timechanged(time: currenttime) func decrement () { if running { currenttime -= 1 delegate?.timechanged(time: currenttime) if currenttime == 0 { running = false delegate?.timesup(message: self.message) Mobile Application Development in ios 5

6 Storyboard Mobile Application Development in ios 6

7 Storyboard: Adding Elements 1. Drag element into view. 2. Add layout contraints. 3. Connect element to view controller. Adding elements to views Create IBOutlet to get/set properties of element Create IBAction to detect interaction with element Mobile Application Development in ios 7

8 Delegate Object that responds to events from another object Defines a protocol that must be followed View elements generating multiple different actions use delegates (rather than IBAction) E.g., UITextField Mobile Application Development in ios 8

9 Delegate Example: UITextField UITextFieldDelegate textfielddidbeginediting textfielddidendediting textfieldshouldreturn More developer.apple.com/documentation/uikit/uitextfielddelegate Mobile Application Development in ios 9

10 UITextField Delegate class ViewController: UIViewController, UITextFieldDelegate weak var messagetext: UITextField! func textfielddidendediting(_ textfield: UITextField) { mytimer.message = textfield.text! func textfieldshouldreturn(_ textfield: UITextField) -> Bool { textfield.resignfirstresponder() // remove keyboard on Return return false // do default behavior (i.e., nothing)? No override func viewdidload() { super.viewdidload() messagetext.delegate = self Mobile Application Development in ios 10

11 Multi-Threading Running multiple tasks concurrently Tasks assigned to threads Threads assigned to processor cores Neural Processing Unit A9: 2 cores, iphone 6 A10: 4 cores, iphone 7 A11: 6 cores, iphone 8/X Mobile Application Development in ios 11

12 Multi-Threading in ios Manipulate queues, not threads Grand Central Dispatch (GCD) let myqueue = DispatchQueue.global() myqueue.async { // Do something, not affecting UI ios mechanism for sending tasks to different queues You can create your own queues, and assign tasks to them Threads take tasks from queues and run on a core Main queue used for UI and user interaction Don t put intensive tasks on Main queue! Also, UI changes not on Main queue lost DispatchQueue.main.async { // Do something easy // Or affecting UI Mobile Application Development in ios 12

13 Timers Timer class Wait specified time interval, then call function Can repeat Start immediately scheduledtimer(withtimeinterval interval: TimeInterval, repeats: Bool, (Timer) -> Void) -> Timer Stop Timer.invalidate() Mobile Application Development in ios 13

14 Timers Create init(timeinterval interval: TimeInterval, repeats: Bool, (Timer) -> Void) -> Timer Create to fire later init(fire: Date, timeinterval interval: TimeInterval, repeats: Bool, (Timer) -> Void) -> Timer Add to run loop let runloop = RunLoop.current runloop.add(timer, formode:.defaultrunloopmode) Mobile Application Development in ios 14

15 Timers var internaltimer: Timer? func startbuttontapped { // Start immediately internaltimer = Timer.scheduledTimer(withTimeInterval: 1.0, repeats: true, block: handletick) // Or, initialize then add to run loop internaltimer = Timer.init(withTimeInterval: 1.0, repeats: true, block: handletick) RunLoop.current.add(internalTimer!, formode:.defaultrunloopmode) func timesup (message: String) { internaltimer?.invalidate() messagelabel.text = message func handletick (timer: Timer) { print("tick") Mobile Application Development in ios 15

16 Resources Storyboard Protocols and Delegates mming_language/protocols.html UITextField and UITextFieldDelegate Grand Central Dispatch (GCD) Timer Mobile Application Development in ios 16