uni app爬坑實錄十二 自適應不同比例的螢幕。

2021-09-29 17:13:39 字數 1334 閱讀 2008

比如圖中左邊布局正常,更換了乙個比例不同的螢幕,顯示就產生了一條間隙。

解決思路:ab和cd兩個區域的可以固定高度,然後bc區域根據不同的螢幕尺寸調整它的高度,即可實現不同尺寸螢幕的自適應。

那麼程式需要做的:

1、獲取裝置可用螢幕總高度。

3、獲取固定區域的高度

2、滾動框height屬性繫結變數。

一、獲取裝置可用螢幕總高度。

uni.

getsysteminfo(}

);

二、獲取固定區域的高度,通過參照元素的位置資訊,來計算c區域的高度
var _this =

this

;var diffheight =0;

let view = uni.

createselectorquery()

.select

("#scrollbody");

view.

boundingclientrect

(data =>).

exec()

;}).

exec()

;

屬性

型別說明

idstring

節點的 id

dataset

object

節點的 dataset

left

number

節點的左邊界座標

right

number

節點的右邊界座標

topnumber

節點的上邊界座標

bottom

number

節點的下邊界座標

width

number

節點的寬度

height

number

節點的高度

三、height屬性繫結變數。

將獲取的c區域高度,繫結到template樣式。

首先注意,不能繫結data屬性,要繫結計算屬性

computed:

},

template樣式height屬性繫結計算屬性。

:style="

js中陣列的map函式爬坑實錄

話不多說,先看 users.map item,index imgblock key alt p div 上面的 看似沒有任何的問題,但是忽略了陣列是空陣列的情況,寫專案的時候就會出現錯誤typeerror cannot read property map of null 無法識別空陣列的情況 為了解...

tensorflow 填坑實錄

output graph def graph util.convert variables to constants sess,sess.graph def,output node names output with tf.gfile.fastgfile model mnist.pb mode wb...

gitattribute踩坑實錄

前一陣子,公司的版本控制從svn遷移到了git,不得不說,git確實比svn要強大好多,單單是乙個分支功能,就有很多值得學習的地方,通過git分支的版本控制,我們可以很方便的進行不同開發環境的切換。現在來看,分支切換是沒有什麼問題的,然而在分支進行合併的時候,plist配置檔案勢必會發生被覆蓋的情況...