小程序適配全面屏機型

應用場景

手機適配

思路分析

1:首選需要判斷是否是全面屏手機
2:如果是全面屏手機,則改變響應的樣式

代碼實現

1:在全局放一個變量.isFullSucreen,含義爲是否是全面屏

2:調用wx.getSystemInfo。 利用公式計算出是否是全面屏,如果是全面屏,就將其賦值爲true

3:在需要適配的頁面,獲取isFullSucreen(此時,在需要在適配的頁面,也初始化isFullSucreen爲空或者false。而且由全局獲取來的isFullSucreen,此時肯定是true)。

4:既然全局獲取來的isFullSucreen 爲true(因爲是全面屏),所以用這個變量通過style,來控制頁面響應的樣式

圖解:1 判斷是否是全面屏
在這裏插入圖片描述
2:在需要適配的頁面,聲明變量,獲取全面屏變量,改變相應的樣式
在這裏插入圖片描述
在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章