對空數據頁面等公共頁面實現的一些思考

在實際的項目開發中爲了增長用戶體驗，設計的同窗會設計空數據界面，錯誤提示頁，網絡加載頁等等。一般狀況下咱們的處理方式是針對每一個頁面寫好一個佈局文件，而後在須要的頁面經過include標籤加載進來，最後在須要顯示的地方控制其隱藏和顯示，這種寫法徹底沒有問題，只不過須要手動修改各個界面的佈局文件，嵌套這些佈局。網上也有不少的小夥伴針對這個問題進行過控件的封裝，但最終也避免不了修改xml代碼，那麼有沒有什麼好的辦法下降這種對佈局文件的侵入性呢？

其實要解決這個問題也不難，至少在大多數狀況下這個解決方式是知足要求的,爲何是在大多數狀況下呢？往下看就明白了。

這個問題的解決思路就是經過WindowManger的方式去動態的添加或刪除咱們要顯示的View。

首先看一下Demo的實現效果

使用步驟：

項目中的Application 中進行初始化

AresLayout.init(this)// 緩存Application Context 引用
    AresLayout.setEmptyLayout(R.layout.layout_empty) //  設置空數據界面的佈局
    AresLayout.setLoadingLayout(R.layout.layout_loading)  // 設置加載時的佈局
    AresLayout.setNetworkErrorLayout(R.layout.layout_network_error) // 設置網絡錯誤時的佈局
複製代碼

在須要展現的地方直接調用如下3個方法便可

AresLayout.showEmptyLayout(content, windowManager)

AresLayout.showLoadingLayout(content, windowManager)

AresLayout.showNetworkErrorLayout(content, windowManager)
複製代碼

兩個參數分別是須要覆蓋的View及當前Activity的windowManager。

注意到沒有，咱們沒有修改當前界面的xml代碼，這樣對代碼的侵入性就大大下降了。

下面說一下思路（若是你對windowManager的原理比較瞭解的話相信你已經明白了）

showEmptyLayout，showLoadingLayout，showNetworkErrorLayout的原理是同樣的，咱們就拿加載空數據頁面的showEmptyLayout說吧

首先AresLayout是一個單例模式的類 setEmptyLayout方法獲取到當前佈局文件的引用

/**
 * 設置空數據界面的佈局
 */
public fun setEmptyLayout(resId: Int) {
    emptyLayout = getLayout(resId)
    emptyLayout.measure(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT)
}
private lateinit var emptyLayout: ViewGroup
複製代碼

注意emptyLayout是一個ViewGroup，而不是具體的某個其子類好比LinearLayout,由於如今不肯定提供的空數據xml裏的根佈局的具體類型。 對應的getLayout(resId)返回的也是一個ViewGroup

private fun getLayout(resId: Int): ViewGroup {
    val inflater = mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE) as LayoutInflater
    return inflater.inflate(resId, null) as ViewGroup
}
複製代碼

接下來是showEmptyLayout方法

/**
 * 展現空數據界面
 * target的大小及位置決定了window界面在實際屏幕中的展現大小及位置
 */
fun showEmptyLayout(target: View, wm: WindowManager) {
    if (currentLayout != null) {
        wm.removeView(currentLayout)
    }
    isAresShowing = true
    currentLayout = emptyLayout
    wm.addView(currentLayout, setLayoutParams(target))
}
複製代碼

這個方法中咱們把上一步設置好的emptyLayout賦值給了currentLayout，這樣作的目的是在多個界面之間切換時咱們只操做currentLayout便可。 最終經過

wm.addView(currentLayout, setLayoutParams(target))
複製代碼

這行代碼，把佈局顯示在了當前的Activity上，那麼是如何控制佈局的顯示大小及位置的呢，看一下setLayoutParams(target)方法

private fun setLayoutParams(target: View): WindowManager.LayoutParams {
    val wlp = WindowManager.LayoutParams()
    wlp.format = PixelFormat.TRANSPARENT
    wlp.flags = (WindowManager.LayoutParams.FLAG_NOT_TOUCH_MODAL
            or WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE
            or WindowManager.LayoutParams.FLAG_ALT_FOCUSABLE_IM)
    var location = IntArray(2)
    target.getLocationOnScreen(location)
    wlp.x = location[0]
    wlp.y = location[1]
    wlp.height = target.height
    wlp.width = target.width
    wlp.type = WindowManager.LayoutParams.FIRST_SUB_WINDOW
    wlp.gravity = Gravity.LEFT or Gravity.TOP
    return wlp
}
複製代碼

setLayoutParams()方法須要傳入一個View，這個View在屏幕中的位置和大小就是空數據界面的位置和大小，在列表展現類的頁面中，這個View能夠是RecyclerView，在其餘類型的狀況下，傳入對應位置的View便可，好比Demo中的content，實際上是一個TextView。

var location = IntArray(2)
target.getLocationOnScreen(location)
複製代碼

獲取View在屏幕中的位置

wlp.x = location[0]
    wlp.y = location[1]
    wlp.height = target.height
    wlp.width = target.width
複製代碼

設置WindowManager.LayoutParams() 在屏幕中顯示的位置和大小

注意這兩行代碼

wlp.type = WindowManager.LayoutParams.FIRST_SUB_WINDOW
wlp.gravity = Gravity.LEFT or Gravity.TOP
複製代碼

type 的值是FIRST_SUB_WINDOW，意思是Window是面板窗口，顯示於宿主窗口上層。（type還有不少值，其餘的暫時沒有嘗試過）

設置Gravity.LEFT or Gravity.TOP是爲了解決View的margin問題。這樣一來，咱們的emptyLayout就徹底可以和傳入的View重合了，也就達到了咱們的最終目的。

當不須要顯示或者界面退出時只須要移除當前Window上的View便可

fun onDestroy(wm: WindowManager) {
    isAresShowing = false
    currentLayout?.let {
        wm.removeView(currentLayout)
        currentLayout = null
    }
}
複製代碼

爲何說這種方式使用絕大多數狀況呢？ 由於下面這個界面就不行

頁面中的右下角有一個Button，若是RecyclerView 部分爲空數據頁面，那麼這個Button會被空數據頁面遮蓋，也就是說，空數據頁面是顯示在最上層的，即便你給這個button設置 bringToFront()也是無效的，由於這兩個組件雖然說歸根到底都是經過windowmanager添加的，但卻不在同一個view上。

這個問題暫時尚未好的思路解決，若是你有更好的解決辦法，歡迎留言！

最後奉上demo地址：

github.com/shiweibsw/A…