[Học Android] Hướng dẫn tạo Dark Mode Theme trong Android

Ở phiên bản Android Q được Google ra mắt mới đây, một tính năng khá hay ho là Dark Theme đã được phát hành cùng với nó. Cùng tìm hiểu cách tạo Dark Mode Theme cho ứng dụng Android trong bài viết này nhé!

Table of Contents

Giới thiệu

Với Android Q được Google ra mắt, Dark Theme đã được phát hành cùng với nó. Dark Mode áp dụng cho cả giao diện người dùng hệ thống và các ứng dụng đang chạy trong đó.

Trước khi bắt đầu, hãy hiểu lý do tại sao chúng ta cần Dark Mode:

Có thể giảm mức sử dụng năng lượng một lượng đáng kể. Một số nhà sản xuất thiết bị bật chế độ tối theo mặc định cho người dùng.
Cải thiện độ mịn của mắt cho người dùng nhạy cảm với ánh sáng.
Giúp mọi người sử dụng thiết bị trong môi trường ánh sáng yếu dễ dàng hơn.

Chú ý: Để bật Dark Mode trong Android, hãy điều hướng đến Settings -> Display -> Theme -> Dark Theme.

Bắt đầu

Để bật Dark Mode ứng dụng của bạn nên đặt target là Android Q

Có hai cách để hỗ trợ Dark Theme:

Nếu bạn đang sử dụng Support Library, hãy đặt app theme thành:

Nếu bạn đã nâng cấp App theme lên MaterialComponent, hãy sử dụng:

Khi chạy ứng dụng, bạn sẽ thấy Dark Mode trong ứng dụng của mình.

Lưu ý: Nếu muốn thay thế màu trong ứng dụng, bạn cần tạo thư mục các values-night và drawable-night

Chúng ta cũng có thể cho phép người dùng thay đổi theme trong khi sử dụng ứng dụng. Các tùy chọn có sẵn là:

Light Theme.
Dark Theme.
Đặt theo Trình tiết kiệm pin (tùy chọn mặc định được đề xuất cho Android P trở lên).
Mặc định hệ thống (tùy chọn mặc định được đề xuất cho Android Q).

Để cập nhật theme một cách linh hoạt, chúng ta sử dụng:

AppCompatDelegate.setDefaultNightMode(/**Your Mode**/)

Ví dụ:

object ThemeHelper {
    private const val lightMode = "light"
    private const val darkMode = "dark"
    private const val batterySaverMode = "battery"
    const val default = "default"

    fun applyTheme(theme: String) {
        when (theme) {
            lightMode -> AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_NO)
            darkMode -> AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_YES)
            batterySaverMode -> AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_AUTO_BATTERY)
            default -> AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_FOLLOW_SYSTEM)

        }
    }
}