Apple đã phát hành cập nhật iOS 13期盼已久 toàn cầu vào ngày 19 tháng 9 trên tất cả iPhone ra mắt trong 4 năm qua (từ iPhone 6s trở về sau).
Một trong những tính năng lớn nhất của bản cập nhật này là Dark Mode (chế độ tối) toàn hệ thống iOS 13. Dự kiến nó giúp giảm mỏi mắt do ánh sáng trắng từ màn hình điện thoại phát ra.
Mặc dù tính năng này mang lại niềm vui cho người dùng cuối trên thiết bị Apple, nhưng đây là một nhiệm vụ cho các nhà phát triển iOS để chuẩn bị ứng dụng sẵn sàng cho Dark Mode iOS 13.
Cách thiết lập ứng dụng cho Dark Mode iOS 13
Để giúp các nhà phát triển với vấn đề này, đây là thông tin hữu ích và các bước cho thấy họ có thể chuẩn bị ứng dụng iOS hiện có cho Dark Mode iOS 13.
- Triển khai Dark Mode iOS 13 không quá khó dù quy mô toàn hệ thống.
- Bật Dark Mode iOS 13 trên ứng dụng hiện có cũng đơn giản nhờ SDK iOS 13 mới nhất.
Khi dùng phiên bản mới nhất để build app cho Dark Mode iOS 13, hệ điều hành sẽ tự động cập nhật các switch, nút bấm, table view và các system control khác. Tuy nhiên lưu ý rằng hình ảnh và màu chữ sẽ không tự điều chỉnh cho Dark Mode.
Tuy nhiên, thật tuyệt vời khi thấy một thay đổi toàn hệ thống như Dark Mode lại dễ triển khai đến vậy. Có ít thay đổi mã hơn và nhiều việc hơn bạn có thể làm trong thời gian tiết kiệm được nhờ Dark Mode iOS 13.
Cách điều chỉnh màu cho Dark Mode iOS 13
Đầu tiên, bắt đầu với việc thay đổi màu hệ thống cho Dark Mode iOS 13:
Giờ có màu hệ thống mới thêm vào UIColor, trong đó có màu label. Sử dụng các màu mới này giúp hỗ trợ Dark Mode và các chế độ độ tương phản cao khác trong iOS 13.
label.color = UIColor.secondaryLabel
Nói chung, bạn nên dùng màu hệ thống cho Dark Mode iOS 13, tự động thích ứng với thay đổi giao diện để duy trì tính nhất quán giữa các app. Tuy nhiên, nhà phát triển cũng có thể chọn triển khai Dark Mode với màu tùy chỉnh.
Màu asset catalog giới thiệu cùng iOS 11 làm cho việc hỗ trợ Dark Mode dễ dàng hơn nhiều bằng cách thêm phiên bản tối của một bộ màu tùy chỉnh.
Bạn chỉ cần chọn màu ưa thích từ catalog, sau đó đổi Appearances thành Any, Dark từ Attributes Inspector.
Xong! Bây giờ bạn đã có Dark Mode iOS 13 tùy chỉnh sẵn sàng cho ứng dụng di động.
Khắc phục sự cố Dark Mode iOS 13
Giả sử app của bạn không tuân theo Dark Mode iOS 13. Bạn sẽ làm gì? Đây là một số bước dễ dàng để giải quyết vấn đề.
Bước 1
Bạn cần biết app đã cập nhật hay chưa.
Nếu app không hoạt động với Dark Mode iOS 13 hoặc không hỗ trợ nó, chỉ cần cập nhật app qua App Store.
Bước 2
Kiểm tra xem Dark Mode của app iOS đã được bật hay chưa.
Nếu chưa, vào Cài đặt - Màn hình & Độ sáng - kiểm tra xem "Tối" (Dark) có được bật không.
Bước 3
Nếu app đã cập nhật đầy đủ nhưng không hoạt động với Dark Mode iOS 13, hãy kiểm tra cài đặt trong app. Xem hình ảnh:
Nếu cần thêm giúp đỡ thiết lập Dark Mode iOS 13, hãy nhờ các nhóm phát triển chuyên biệt. Và đó là cách tôi sẽ giúp bạn.
Cũng đọc thêm mẹo phát triển ứng dụng di động trên iOS. Hy vọng tất cả thông tin này hữu ích cho bạn.
Hãy xem điều gì bạn cần làm tiếp theo.
Điều chỉnh hình ảnh cho Dark Mode iOS 13
Hầu hết hình ảnh trông tuyệt vời trong Dark Mode iOS 13, và đôi khi chúng nổi bật theo cách làm nổi bật chi tiết. Tuy nhiên, bạn vẫn có thể tìm thấy một số hình ảnh trông hơi lệch hoặc không phù hợp cho Dark Mode.
Tin tốt là bạn có thể điều chỉnh hình ảnh cho Dark Mode theo cách tương tự như điều chỉnh văn bản.
Tất cả những gì bạn cần làm là chọn hình ảnh trong catalog và như trước, đổi attributes thành Any, Dark trong Attributes Inspector. Thêm giao diện tối của hình ảnh và xong.
Phát hiện thay đổi Dark Mode iOS 13 theo cách lập trình
Nhà phát triển có thể gặp tình huống cần triển khai thay đổi giao diện trong Dark Mode iOS 13 bằng code. Cách làm như sau:
override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
super.traitCollectionDidChange(previousTraitCollection)
let userInterfaceStyle = traitCollection.userInterfaceStyle
// Either .unspecified, .light, or .dark
// Cập nhật giao diện người dùng dựa trên giao diện
}
Ghi đè traitCollectionDidChange giúp phát hiện thay đổi giao diện.
Sau đó chỉ cần mở traitCollection.userInterfaceStyle.
Bạn cũng có thể xác minh nếu giao diện hiện tại đang dùng phương thức mới bạn vừa triển khai:
override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
super.traitCollectionDidChange(previousTraitCollection)
let hasUserInterfaceStyleChanged = previousTraitCollection.hasDifferentColorAppearance(comparedTo: traitCollection)
// Bool
// Cập nhật giao diện người dùng dựa trên giao diện
}
Ghi đè kiểu giao diện người dùng
Toàn bộ ứng dụng
Hệ thống tự động chọn tham gia (opt-in) bất kỳ app nào liên kết với SDK iOS 13.0 trở lên cho cả giao diện sáng và tối.
Nếu bạn cần thêm thời gian làm việc trên hỗ trợ Dark Mode của app hoặc muốn giữ app ở một kiểu đơn lẻ, bạn có thể chọn opt-out bằng cách thêm key UIUserInterfaceStyle (giá trị Light hoặc Dark) vào file Info.plist của app.
Thiết lập key này khiến hệ thống bỏ qua sở thích người dùng và luôn áp dụng giao diện cụ thể cho app.
Lưu ý: Hỗ trợ Dark Mode iOS 13 được khuyến khích mạnh mẽ. Chỉ dùng key UIUserInterfaceStyle để opt-out tạm thời trong khi cải thiện hỗ trợ Dark Mode của app.
Màn hình cụ thể
Trong iOS 13, bạn có thể ghi đè kiểu giao diện người dùng trên view hoặc view controller cụ thể. Ví dụ, bạn có thể muốn chỉ một view controller ở Dark Mode, trong khi phần còn lại của app ở Light Mode.
Để ghi đè kiểu giao diện, chỉ cần ghi đè biến này trong view hoặc view controller cấp cao nhất và nó sẽ lan truyền xuống sub-view:
// Bên trong UIViewController
override func viewDidLoad() {
super.viewDidLoad()
// Luôn áp dụng kiểu giao diện tối.
overrideUserInterfaceStyle = .dark
}
Kết luận
Cảm ơn bạn đã đọc bài viết! Ở đây chúng ta đã khám phá cách thiết lập app cho Dark Mode iOS 13.
Dark Mode iOS 13 mang lại cách dùng điện thoại thông minh thư giãn, không căng thẳng. Có lẽ chúng ta sẽ thấy tương lai Dark Mode thay thế chế độ mặc định với nền trắng sáng.
Bằng cách tuân theo các hướng dẫn và mẹo code này, bạn có thể dễ dàng thiết lập app cho Dark Mode trên iOS 13.
Nếu cần giúp đỡ chuyên gia, đừng ngần ngại liên hệ các nhà phát triển iOS cho các vấn đề liên quan Dark Mode iOS 13.
Theo dõi Twitter để nhận cập nhật: https://twitter.com/ValueCoders