安全区域

Safe Area适配概念

为避免两端上布局起始位置的差异带来的适配问题，添加一个安全区域概念（Safe Area）。
开启Safe Area后，开发人只需要关注页面具体内容，不需要为各种设备的不同页面模式去适配顶部开始距离和底部留白的高度，SDK会自动适配不同方位上的安全区域。

示意图如下：开启Safe Area后,只需关注页面具体内容即可。

---  开启安全区域 
---@param safeArea number 设置安全区域,参考SafeArea枚举 
safeArea(safeArea)

---  安全区域适配器,主要用于自定义安全区域的偏移，
---  需要开始安全区域后适配器才生效！！！
---@param adapter SafeAreaAdapter  安全区域适配器
safeAreaAdapter(adapter)

效果如下图：
图一未开启safeArea； 
图二设置safeArea(MBit.bor(SafeArea.TOP, SafeArea.BOTTOM)) 
图三设置safeAreaAdapter(SafeAreaAdapter().insetsTop(50))

--示例demo
RED = Color(180, 100, 100, 0.8)
YELLOW = Color(220, 200, 100, 0.8)
PURPLE = Color(100, 100, 200, 0.8)
COLORS = { PURPLE, RED, YELLOW }

model(tableModel)

txtCell(item) {
    Label(item.name).widthPercent(100)
    .padding(50, 20, 50, 20)
    .bgColor(Color(100, 100, 160, 1))
    .textColor(Color(0xffffff))
    .top(2)
}

---
--- UI
ui {
    --- layout views
    List().bgColor(Color(0, 255, 0, 0.1))
    --.top(100)
    .bindCell(function(item)
        return txtCell(item)
    end)
    .bindData(tableModel.sourceData)
}
.statusBarMode(StatusMode.TRANSLUCENT)
.safeArea(MBit.bor(SafeArea.TOP, SafeArea.BOTTOM))
.safeAreaAdapter(SafeAreaAdapter().insetsTop(50))
---
--- preview
function preview()
    local data = {}
    for i = 1, 12 do
        local temp = {}
        temp.name = "第" .. i .. "行"
        data[i] = temp
    end
    tableModel.sourceData = data
end