ui design
play

UI Design Mobile Application Development in iOS School of EECS - PowerPoint PPT Presentation

UI Design Mobile Application Development in iOS School of EECS Washington State University Instructor: Larry Holder Mobile Application Development in iOS 1 Outline Model-View-Controller (MVC) design Timers Multi-threading Mobile


  1. UI Design 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 • Timers • Multi-threading Mobile Application Development in iOS 2

  3. Model-View-Controller (MVC) class ViewController { IBAction … IBOutlet … } e t D a a g t e a l e D class Model { Storyboard… var value: Int … } Mobile Application Development in iOS 3

  4. General Scenario • Want to modify view when some event happens within model • E.g., if counter == 0, then display message Mobile Application Development in iOS 4

  5. Bad Solution class MyViewController: UIViewController { @IBOutlet weak var myLabel: UILabel! var badModel = BadModel() badModel.label = myLabel badModel.decrement() } class BadModel { var label: UILabel! var counter: Int = 1 func decrement() { counter = counter – 1 if counter == 0 { label.text = "Time's up!" } } } Mobile Application Development in iOS 5

  6. Good (MVC) Solution protocol MyDelegate { func timesUp() } class MyViewController: UIViewController, MyDelegate { @IBOutlet weak var myLabel: UILabel! var goodModel = GoodModel() goodModel.delegate = self func timesUp() { myLabel.text = "Time's up!" // What if we want to make other changes? } } Mobile Application Development in iOS 6

  7. Good (MVC) Solution class GoodModel { var delegate: MyDelegate? var counter: Int = 0 func decrement() { counter = counter – 1 if counter == 0 { delegate?.timesUp() } } } Mobile Application Development in iOS 7

  8. MyTimer Example Mobile Application Development in iOS 8

  9. Model: MyTimer Class protocol MyTimerDelegate { func timeChanged (time: Int) func timesUp () } class MyTimer { var delegate: MyTimerDelegate? var initialTime: Int = 60 var currentTime: Int = 60 func setInitialTime(_ initTime: Int) { initialTime = initTime } func start() { // todo } func stop() { // todo } func reset() { // todo } } Mobile Application Development in iOS 9

  10. SideBar: Multi-Threading • Running multiple tasks concurrently • Tasks assigned to threads • Threads assigned to cores A12: 6 CPU cores, 4 GPU cores, A13: 6 CPU cores, 4 GPU cores, 8 NPU cores, iPhone XS 8 NPU cores, iPhone 11 A11: 6 cores, iPhone 8/X Mobile Application Development in iOS 10

  11. Multi-Threading in iOS let myQueue = DispatchQueue.global() Manipulate “queues”, not threads • myQueue.async { // Do something in background Grand Central Dispatch (GCD) • // 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 them on a core Main queue used for UI and user interaction • – Don’t put intensive tasks on Main queue! DispatchQueue.main.async { // Do something easy Also, UI changes not on Main queue “lost” • // Or affecting UI } Mobile Application Development in iOS 11

  12. Timers • Timer class – Wait specified time interval, then call function – Can repeat • Start immediately Timer.scheduledTimer(withTimeInterval interval: TimeInterval, repeats: Bool, block: @escaping (Timer) -> Void) -> Timer • Stop Timer.invalidate() Mobile Application Development in iOS 12

  13. Timers • Create init(timeInterval interval: TimeInterval, repeats: Bool, block: @escaping (Timer) -> Void) -> Timer • Create to fire later init(fire: Date, timeInterval interval: TimeInterval, repeats: Bool, block: @escaping (Timer) -> Void) -> Timer • Add to run loop RunLoop.current.add(timer, forMode: .default) Mobile Application Development in iOS 13

  14. Model: MyTimer Class var timer: Timer? func start() { // Start immediately timer = Timer.scheduledTimer(withTimeInterval: 1.0, repeats: true, block: handleTick) } func handleTick (timer: Timer) { // todo } func stop() { timer?.invalidate() } func reset() { // todo } Mobile Application Development in iOS 14

  15. ViewController class ViewController: UIViewController, MyTimerDelegate { var myTimer = MyTimer() var initialTime: Int = 60 // todo: interface outlets and actions func timeChanged(time: Int) { // todo } func timesUp() { // todo } override func viewDidLoad() { super.viewDidLoad() // Do any additional setup after loading the view. myTimer.delegate = self myTimer.setInitialTime(initialTime) // todo: further initializations } } Mobile Application Development in iOS 15

  16. Storyboard Mobile Application Development in iOS 16

  17. ViewController // Interface outlets @IBOutlet weak var initialTimeLabel: UILabel! @IBOutlet weak var initialTimeSlider: UISlider! @IBOutlet weak var currentTimeLabel: UILabel! @IBOutlet weak var timesUpLabel: UILabel! @IBOutlet weak var startButton: UIButton! @IBOutlet weak var stopButton: UIButton! @IBOutlet weak var resetButton: UIButton! Mobile Application Development in iOS 17

  18. ViewController // Interface actions @IBAction func initialTimeSliderValueChanged(_ sender: UISlider) { // todo } @IBAction func startTapped(_ sender: UIButton) { startButton.isEnabled = false stopButton.isEnabled = true resetButton.isEnabled = false myTimer.start() } @IBAction func stopTapped(_ sender: UIButton) { // todo } @IBAction func resetTapped(_ sender: UIButton) { // todo } Mobile Application Development in iOS 18

  19. Resources • Grand Central Dispatch (GCD) – developer.apple.com/documentation/dispatch • Timer – developer.apple.com/documentation/foundation/timer Mobile Application Development in iOS 19

Download Presentation
Download Policy: The content available on the website is offered to you 'AS IS' for your personal information and use only. It cannot be commercialized, licensed, or distributed on other websites without prior consent from the author. To download a presentation, simply click this link. If you encounter any difficulties during the download process, it's possible that the publisher has removed the file from their server.

Recommend


More recommend