加载中 ...
首页 > 新闻资讯 > 小程序 正文

小程序moveable-area和movealbe-view

2019-07-31 09:21:16 来源:沈阳小程序开发 作者:沈阳软件开发

小程序movable-area和小程序movable-view之间有什么区别,在开发过程中应该注意什么,以下是适合所有人的。

21708-1P6191506433J.jpg

1.可移动区域

可移动视野可移动区域。

2. movalbe-view

可移动的视图容器,您可以在页面上拖放

请注意,移动视图必须设置宽度和高度。否则它默认为10px.movable-view必须在组件中,并且必须是直接子节点,否则你不能将move-view默认移动到绝对定位,当可移动视图时,top和left属性为0px小于可移动区域,可移动-view的移动范围在可移动区域;当可移动视野大于可移动区域时,可移动视野的移动范围必须包含可移动区域(x轴方向和y轴方向分开考虑)

3.可运行代码

Wxml

可移动视野区域小于可移动区域可移动视野区域大于可移动区域可移动视野

Wxss

.container {display: flex; flex-direction: column; align-items: center;} .section_title_less {font-size: 28rpx;} .area_less {height: 200px; width: 200px; background-color: red;} .view_less {height: 50px; width: 50px; background-color:黄色;} .section_title_more {font-size: 28rpx; margin-top: 50px;} .area_more {height: 50px; width: 50px; background-color: red;} .view_more {height: 200px; width: 200px; border-颜色:绿色;边框宽度: 2px;边框

页面({/***页初始数据* /数据: {x:'100px',y:'10px'},/***生命周期函数 - 监听器页面加载*/onLoad:函数(选项){},更改: function(event){//console.log(event);},scale: function(event){//console.log(event);},vtouchmove: function(event){console.log('Portrait') ;},htouchmove: function(event){console.log('transverse');}})

< 汇海(www.hvihi.com)是国内知名的商城系统和商城网站建设提供商,其中汇海技术小程序系统提供小程序商城开发,小程序配送系统,微分配系统,商城系统,电子商务网站建设, 微信发行系统,小程序商城及其他多端商场和电子商务行业解决方案>

确认:这个文件和图像源网络编辑器的网站部分,如果有侵权及时通信删除。 汇海hvihi.com网站原创文章,请注明出处。

“沈阳软件公司”的新闻页面文章、图片、音频、视频等稿件均为自媒体人、第三方机构发布或转载。如稿件涉及版权等问题,请与

我们联系删除或处理,客服QQ:55506560,稿件内容仅为传递更多信息之目的,不代表本网观点,亦不代表本网站赞同

其观点或证实其内容的真实性。