最開始為了好調試,運行成h5在瀏覽器調試的,調完以后,放到pad上。。。天塌了,所有頁面異常,感覺被放大了好多,而且頁面很亂。。。
查了很多資料,說把px改為rpx,好,全部改了,頁面還是很大。。。
然后就查說改mainfest或者page.json中的rpxCalcMaxDeviceWidth"和"rpxCalcBaseDeviceWidth":,也改了,還是不行
還有設置viewport meta標簽,這個本身代碼設置過了,也不行
后來同事提醒說可能是pad的顯示設置被調了,然后改了pad設置中的顯示和字體大小,有希望!!!頁面總算有點正常顯示了(前提是把px都改為了rpx)
但是,每個頁面還是感覺被放大了1.2倍,怎么調都不行,然后問各種AI工具,總算deepseep說中了“最小寬度設置”,如下:
檢查鴻蒙Pad的系統設置
讓用戶檢查設備的以下設置:
-
顯示設置中的"字體大小與顯示大小"
-
開發者選項中的"最小寬度"設置
-
無障礙設置中的"顯示大小"
什么是最小寬度?
因為我的設備時華為MatePad Pro,所以是800dp,然后看了pad的最小寬度,不知道被誰動過,改成713了。。。。。。然后改為800,再打開項目頁面,正常了!!!!!
另外會發現最小寬度經常變,可以設置固定
總結:如果uniapp的app項目,在pad上顯示不正常,試下如下步驟:
1、將所有px改為rpx,可以按照設計稿的尺寸來寫頁面,只不過把px改成rpx就可以。
2、檢查pad的設置,顯示和字體 設置,以及開發人員中的最小寬度(如果經常變化,可以關閉智能分辨率)
3、圖片,需要設置,不然會原尺寸顯示。
background-size: cover; /* 或 contain, 100% 100% */
?? ?background-repeat: no-repeat;
?? ?background-position: center;