新聞中心
movable-area
基礎(chǔ)庫 1.2.0 開始支持,低版本需做兼容處理
專注于為中小企業(yè)提供成都網(wǎng)站設(shè)計(jì)、做網(wǎng)站服務(wù),電腦端+手機(jī)端+微信端的三站合一,更高效的管理,為中小企業(yè)巴州免費(fèi)做網(wǎng)站提供優(yōu)質(zhì)的服務(wù)。我們立足成都,凝聚了一批互聯(lián)網(wǎng)行業(yè)人才,有力地推動了上1000家企業(yè)的穩(wěn)健成長,幫助中小企業(yè)通過網(wǎng)站建設(shè)實(shí)現(xiàn)規(guī)模擴(kuò)充和轉(zhuǎn)變。
movable-view 的可移動區(qū)域
注意:movable-area 必須設(shè)置width和height屬性,不設(shè)置默認(rèn)為10px
movable-view
基礎(chǔ)庫 1.2.0 開始支持,低版本需做兼容處理
可移動的視圖容器,在頁面中可以拖拽滑動
| 屬性名 | 類型 | 默認(rèn)值 | 說明 |
|---|---|---|---|
| direction | String | none | movable-view的移動方向,屬性值有all、vertical、horizontal、none |
| inertia | Boolean | false | movable-view是否帶有慣性 |
| out-of-bounds | Boolean | false | 超過可移動區(qū)域后,movable-view是否還可以移動 |
| x | Number | 定義x軸方向的偏移,如果x的值不在可移動范圍內(nèi),會自動移動到可移動范圍;改變x的值會觸發(fā)動畫 | |
| y | Number | 定義y軸方向的偏移,如果y的值不在可移動范圍內(nèi),會自動移動到可移動范圍;改變y的值會觸發(fā)動畫 | |
| damping | Number | 20 | 阻尼系數(shù),用于控制x或y改變時(shí)的動畫和過界回彈的動畫,值越大移動越快 |
| friction | Number | 2 | 摩擦系數(shù),用于控制慣性滑動的動畫,值越大摩擦力越大,滑動越快停止;必須大于0,否則會被設(shè)置成默認(rèn)值 |
movable-view 必須設(shè)置width和height屬性,不設(shè)置默認(rèn)為10px
movable-view 默認(rèn)為絕對定位,top和left屬性為0px
當(dāng)movable-view小于movable-area時(shí),movable-view的移動范圍是在movable-area內(nèi);當(dāng)movable-view大于movable-area時(shí),movable-view的移動范圍必須包含movable-area(x軸方向和y軸方向分開考慮)
注意:movable-view必須在組件中,并且必須是直接子節(jié)點(diǎn),否則不能移動。
示例代碼:
movable-view區(qū)域小于movable-area
movable-view區(qū)域大于movable-area
Page({
data: {
x: 0,
y: 0
},
tap: function(e) {
this.setData({
x: 30,
y: 30
});
}
})
當(dāng)前題目:創(chuàng)新互聯(lián)小程序教程:微信小程序視圖容器movable-area
文章地址:http://www.dlmjj.cn/article/ccegoio.html


咨詢
建站咨詢

