Project 02 - Stopwatch

Mình tìm thấy 1 project khá hay trên Github mà cũng không quá phức tạp, đó là project app bấm giờ: Stopwatch

https://github.com/soapyigu/Swift-30-Projects/tree/master/Project%2002%20-%20Stopwatch

 

Stopwatch sử dụng navigation controller, UILabel, UIButton và UITableView và chủ yếu layout bằng cách kéo thả giao diện.

Và ở bài viết này mình sẽ hướng dẫn các bạn cách làm project này

B1: Chạy Xcode, khởi tạo 1 project mới, ở đây mình đặt tên cho nó là "Stopwatch"

Sau đó tạo thêm 1 file swift có sẵn import Foundation đặt tên cho nó là Stopwatch.swift

B2: bắt đâu tạo

- Mở file Main.storyboard, đây là nơi để hiển thị giao diện

+ Đầu tiên hãy tạo ra 1 NavigationController kế thừa từ ViewController cho trước

click vào hình tròn màu vàng ở trên ViewController -> Editor -> Embed in -> NavigationController

+ Tất cả những đối tượng chúng ta cần dùng đến là: UILabel, UIButton, UITableView

- Bắt đầu thêm các đối tượng vào ViewController:

+ Thêm 2 UILabel đặt tên là: timerLabel vào lapTimerLabel 

+ Thêm 2 UIButton: playPauseButton và lapRestButton

+ Thêm 1 UITableView: lapsTableView

- Sau khi thêm đủ các đối tượng, tiến hành ánh xạ các đối tượng vào file ViewController rồi đặt tên cho chúng

- Ở bên file Stopwatch.swift:

import Foundation

class Stopwatch: NSObject {
  var counter: Double
  var timer: Timer
  
  override init() {
    counter = 0.0
    timer = Timer()
  }
}

counter với timer, là 2 thuộc tính mình tạo ra cho đối tượng Stopwatch, Double và Timer là kiểu dữ liệu

Double là kiểu dữ liệu số (giống như Int), nhưng Int là số nguyên không có phần thập phân, Double là có phần thập phân (kiểu như số thực) với phạm vi giá trị lớn.

- Bên file ViewController:

Bên trên hàm ViewDidLoad

 fileprivate let mainStopwatch: Stopwatch = Stopwatch()
  fileprivate let lapStopwatch: Stopwatch = Stopwatch()
  fileprivate var isPlay: Bool = false
  fileprivate var laps: [String] = []

Ở đây chúng ta thấy kiểu khai báo là "fileprivate let", tức là đối tượng được khai báo sẽ được ẩn đi để các đối tượng khác bên ngoài thực thể mình khai báo không gọi được, còn bên trong thực thể đó sử dụng bình thường.

- Bây giờ hãy vào trong hàm ViewDidLoad:

  let initCircleButton: (UIButton) -> Void = { button in
      button.layer.cornerRadius = 0.5 * button.bounds.size.width
      button.backgroundColor = UIColor.white
    }
    

Những dòng code này giúp chúng ta làm bo góc các button và đặt màu nền là màu trắng

 override var shouldAutorotate : Bool {
    return false
  }

đoạn code này là khai báo một biếm souldAutoroate trả về giá trị Bool, Bool là kiểu dữ liệu boolean, chỉ gồm 2 giá trị true/false (đúng/sai)