360小程序支持大小屏交互,
通過小程序根目錄下的 app.json 文件下,Windows配置用來配置小程序大小屏樣式。文件內(nèi)容為一個 JSON 對象,有以下屬性:
屬性 | 類型 | 說明 | 默認(rèn)值 | 是否必填 |
---|---|---|---|---|
enableLargeWindow | boolean | 是否全部頁面支持切換至大窗口,支持則在窗口頂部顯示切換按鈕 | false | 是 |
showRefreshButton | boolean | 是否顯示刷新按鈕,false為不顯示,true為顯示 | false | 是 |
windowWidth | number | 默認(rèn)大窗口的尺寸-寬度 | 1138 | 是 |
windowHeight | number | 默認(rèn)大窗口的尺寸-高度 | 640 | 是 |
minWindowWidth | number | 大窗口最小尺寸-寬度 | 400 | 是 |
minWindowHeight | number | 大窗口最小尺寸-高度 | 400 | 是 |
enableResize | boolean | 是否支持用戶手動拖動窗口邊線改變窗口大小 | true | 是 |
{
"window": {
"enableLargeWindow": false,
"showRefreshButton": false,
"windowWidth": 1138,
"windowHeight": 640,
"minWindowWidth": 400,
"minWindowHeight": 400,
"enableResize": true
}
}
除了通過全局配置文件配置顯示大小屏切換方式外,還可通過調(diào)用接口的方式實現(xiàn)大小屏的切換。
調(diào)用qihoo.SetScreenState(true, false),將當(dāng)前側(cè)邊欄小屏切換為大屏,該頁面只支持大屏樣式,不顯示大小屏切換按鈕
調(diào)用qihoo.SetScreenState(true, true),將當(dāng)前側(cè)邊欄小屏切換為大屏,該頁面需要同時適配大小屏,顯示大小屏切換按鈕,點擊按鈕時在大小屏之間相互切換。
調(diào)用qihoo.SetScreenState(false, true),將當(dāng)前側(cè)邊欄大屏切換為小屏,該頁面需要同時適配大小屏,顯示大小屏切換按鈕,點擊按鈕時在大小屏之間相互切換。
為方便用戶使用,瀏覽器會記住用戶主動切換的窗口大小。
如小程序默認(rèn)小窗口為小窗口,用戶使用過程中,手動點擊窗口頂部切換按鈕將窗口切換為獨立大窗口。關(guān)閉窗口時,瀏覽器會記住當(dāng)前窗口大小,下次打開小程序時,會默認(rèn)打開同樣大小的新窗口。
如果只有部分頁面支持大窗口,通過調(diào)用js接口切換為大小窗口,瀏覽器不會記住當(dāng)前窗口大小,需要開發(fā)者通過js接口保證窗口大小。 可通過生命周期回調(diào)函數(shù)window.onload()、window.nAppShow()、window.onAppHide()配合qihoo.SetScreenState()設(shè)置每個頁面的固定窗口大小。
更多建議: