實現(xiàn)夜間模式有很多種方式，經(jīng)過多次嘗試，算是找到了一種性價比較高的方式。

主題方式

這是最正統(tǒng)的方式，但工作量巨大，因為要全局替換 xml 布局中所有硬編碼的色值，將其換成主題色。然后通過換主題達到換膚的效果。

窗口方式

是不是可以在所有界面上罩一個半透明的窗口，就好像戴墨鏡看屏幕一樣。雖然這是換膚方案的“退而求其次”，但也是能達到不刺眼的效果:

open class BaseActivity : AppCompatActivity() {
    // 展示全局半透明浮窗
    private fun showMaskWindow() {
        // 浮窗內(nèi)容  
        val view = View {
            layout_width = match_parent
            layout_height = match_parent
            background_color = "#c8000000"
        }
        val windowInfo = FloatWindow.WindowInfo(view).apply {
            width = DimensionUtil.getScreenWidth(this@BaseActivity)
            height = DimensionUtil.getScreenHeight(this@BaseActivity)
        }
        // 展示浮窗
        FloatWindow.show(this, "mask", windowInfo, 0, 100, false, false, true)
    }
}

其中的View{}，是構(gòu)建布局的 DSL，它實例化了一個半透明的View，詳細講解可以點擊這里。

其中FloatWindow，是浮窗管理類，show()方法會向界面中添加一個全局Window，詳細講解可以點擊這里。

• 為了讓浮窗跨Activity展示，需要將窗口的type設(shè)置為WindowManager.LayoutParams.TYPE_APPLICATION_OVERLAY。
• 為了讓觸摸事件穿透浮窗傳遞到Activity，需要為窗口添加下面這幾個flag，FLAG_NOT_FOCUSABLE、FLAG_NOT_TOUCHABLE、FLAG_NOT_TOUCH_MODAL、FLAG_FULLSCREEN。

這些細節(jié)已封裝在FloatWindow中。

這個方案有一個缺點，當展示系統(tǒng)多任務(wù)時，全局浮窗會消失，效果如下：

image

子視圖方式

是不是可以向每個當前界面添加一個半透明的View作為蒙版？

fun Activity.nightMode(lightOff: Boolean, color: String) {
    // 構(gòu)建主線程消息處理器
    val handler = Handler(Looper.getMainLooper())
    // 蒙版控件id
    val id = "darkMask"
    // 打開夜間模式
    if (lightOff) {
        // 向主線程消息隊列頭部插入“展示蒙版”任務(wù)
        handler.postAtFrontOfQueue {
            // 構(gòu)建蒙版視圖
            val maskView = View {
                layout_id = id
                layout_width = match_parent
                layout_height = match_parent
                background_color = color
            }
            // 向當前界面頂層視圖中添加蒙版視圖
            decorView?.apply {
                val view = findViewById<View>(id.toLayoutId())
                if (view == null) { addView(maskView) }
            }
        }
    } 
    // 關(guān)閉夜間模式
    else {
        // 從當前界面頂層視圖中移出蒙版視圖
        decorView?.apply {
            find<View>(id)?.let { removeView(it) }
        }
    }
}

為AppCompatActivity擴展了一個方法，它用于開關(guān)夜間模式。打開夜間模式的方式是 “向當前界面頂層視圖添加一個蒙版視圖” 。

• 其中decorView是Activity的一個擴展屬性：

val Activity.decorView: FrameLayout?
    get() = (takeIf { !isFinishing && !isDestroyed }?.window?.decorView) as? FrameLayout

當Activity還展示的時候，從它的Window中獲取DecorView。

• 其中toLayoutId()是String的擴展方法：

fun String.toLayoutId(): Int {
    var id = java.lang.String(this).bytes.sum()
    if (id == 48) id = 0
    return id
}

它將String轉(zhuǎn)化成Int值，算法是將String先轉(zhuǎn)換成字節(jié)，然后將所有字節(jié)累加，詳細介紹可以點擊這里。

為了避免界面展示出來后黑一下，所以將“添加蒙版”任務(wù)添加到主線程消息隊列的頭部，優(yōu)先處理。

然后只需在Application中監(jiān)聽Activity的生命周期，在onCreate()中開關(guān)夜間模式即可：

class TaylorApplication : Application() {
    private val preference by lazy { Preference(getSharedPreferences("dark-mode", Context.MODE_PRIVATE)) }
    
    override fun onCreate() {
        super.onCreate()

        registerActivityLifecycleCallbacks(object :ActivityLifecycleCallbacks{
            override fun onActivityPaused(activity: Activity?) {}

            override fun onActivityResumed(activity: Activity?) {}

            override fun onActivityStarted(activity: Activity?) {}

            override fun onActivityDestroyed(activity: Activity?) {}

            override fun onActivitySaveInstanceState(activity: Activity?, outState: Bundle?) {}

            override fun onActivityStopped(activity: Activity?) {}

            override fun onActivityCreated(activity: Activity?, savedInstanceState: Bundle?) {
                activity?.night(preference["dark-mode", false])
            }
        }
    }
}

其中Preference是對SharedPreference的封裝，它用更簡潔的語法實現(xiàn)值的存取，且可以忽略類型，詳細介紹可以點擊這里。

效果如下：

image

這個方案不是全局的，而是針對單界面的，所以彈出的DialogFragment會在蒙版之上，那就用同樣的方法在對話框上再覆蓋一層蒙版：

fun DialogFragment.nightMode(lightOff: Boolean, color: String = "#c8000000") {
    val handler = Handler(Looper.getMainLooper())
    val id = "darkMask"
    if (lightOff) {
        handler.postAtFrontOfQueue {
            val maskView = View {
                layout_id = id
                layout_width = match_parent
                layout_height = match_parent
                background_color = color
            }
            decorView?.apply {
                val view = findViewById<View>(id.toLayoutId())
                if (view == null) {
                    addView(maskView)
                }
            }
        }
    } else {
        decorView?.apply {
            find<View>(id)?.let { removeView(it) }
        }
    }
}

// 獲取對話框的根視圖 
val DialogFragment.decorView: ViewGroup?
    get() {
        return view?.parent as? ViewGroup
    }

添加蒙版的算法和之前的一摸一樣，只不過這次是DialogFragment的擴展方法。

覆蓋了 Activity 和 DialogFragment，還不夠，項目中有些彈窗是用 Window 實現(xiàn)的，咋辦呢，繼續(xù)覆蓋：

fun Window.nightMode(lightOff: Boolean, color: String = "#c8000000") {
    val handler = Handler(Looper.getMainLooper())
    val id = "darkMask"
    if (lightOff) {
        handler.postAtFrontOfQueue {
            val maskView = View(context).apply {
                setId(id.toLayoutId())
                layoutParams = FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT, FrameLayout.LayoutParams.MATCH_PARENT)
                setBackgroundColor(Color.parseColor(color))
            }
            (decorView as? ViewGroup)?.apply {
                val view = findViewById<View>(id.toLayoutId())
                if (view == null) {
                    addView(maskView)
                }
            }
        }
    } else {
        (decorView as? ViewGroup)?.apply {
            find<View>(id)?.let { removeView(it) }
        }
    }
}

算法和之前的一摸一樣。即往 DecorView 中添加蒙版

故事就這樣結(jié)束？還有 PopupWindow，這次情況略復(fù)雜，因為沒有現(xiàn)成的方法可以獲取它的 DecorView

public class PopupWindow {
    private PopupDecorView mDecorView;
    private class PopupDecorView extends FrameLayout {
        ...
    }
}

PopupWindow的根視圖是一個私有成員，遂只能通過反射獲?。?/p>

fun PopupWindow.nightMode(lightOff: Boolean, color: String = "#c8000000"){
    contentView.post {
        try {
            // 通過反射獲取 mDecorView 實例
            val windowClass: Class<*>? = this.javaClass
            val popupDecorView = windowClass?.getDeclaredField("mDecorView")
            popupDecorView?.isAccessible = true
            val mask = contentView.context.run {
                View {
                    layout_width = contentView.width
                    layout_height = contentView.height
                    background_color = color
                }
            }
            // 向 mDecorView 中添加蒙版
            (popupDecorView?.get(this) as? FrameLayout)?.addView(mask, FrameLayout.LayoutParams(contentView.width, contentView.height))
        } catch (e: Exception) {
        }
    }
}

父視圖方式

子視圖方式在 Activity 中效果良好，但對于非全屏的 DialogFragment 卻有可能出現(xiàn)布局問題。因為向容器控件添加一個 MATCH_PARENT 的子視圖后很可能會把父視圖撐開，當 Dialog 的 Window 寬高是 WRAP_CONTENT 時，運用上面DialogFragment.nightMode()，app 中很多對話框都撐滿全屏。

換一個思路，在DialogFragment原有視圖外面包一層父視圖，在父視圖中畫一個半透明矩形：

// 對話框基類
abstract class BaseDialogFragment : DialogFragment() {

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        // 在對話框視圖外層包一個蒙版
        return context?.let {
            MaskViewGroup(it).apply {
                addView(createView(inflater, container, savedInstanceState))
            }
        }
    }

    // 子類必須重載這個方法以自定義布局
    abstract fun createView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View?

其中的MaskViewGroup定義如下：

// 蒙版容器控件
class MaskViewGroup @JvmOverloads constructor(context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0) : FrameLayout(context, attrs, defStyleAttr) {

    private lateinit var paint: Paint

    init {
        // 允許 ViewGroup 在自己畫板上繪制內(nèi)容
        setWillNotDraw(false)
        paint = Paint(Paint.ANTI_ALIAS_FLAG)
        paint.color = Color.parseColor("#c8000000")
    }

    override fun onDrawForeground(canvas: Canvas?) {
        super.onDrawForeground(canvas)
        // 繪制灰色前景
        canvas?.drawRect(0f, 0f, right.toFloat(), bottom.toFloat(), paint)
    }
}

關(guān)于如何在父控件中繪制內(nèi)容的詳細介紹可以點擊Android自定義控件 | 小紅點的三種實現(xiàn)（下）

Talk is cheap, show me the code

完整代碼，可以點擊這里