E-COM-NET
首页
在线工具
Layui镜像站
SUI文档
联系我们
推荐频道
Java
PHP
C++
C
C#
Python
Ruby
go语言
Scala
Servlet
Vue
MySQL
NoSQL
Redis
CSS
Oracle
SQL Server
DB2
HBase
Http
HTML5
Spring
Ajax
Jquery
JavaScript
Json
XML
NodeJs
mybatis
Hibernate
算法
设计模式
shell
数据结构
大数据
JS
消息中间件
正则表达式
Tomcat
SQL
Nginx
Shiro
Maven
Linux
movable-view
基于uniapp vue3 的滑动抢单组件
通过在onMounted获取movable-area与
movable-view
实例,计算出可滑动的距离效果图:代码:»Slidetograborderimport{ref,onMounted}from"vue
printf_824
·
2025-02-13 19:34
uni-app
javascript
前端
uni-app之使用
movable-view
组件的详细教程
在UniApp中,我们可以使用
movable-view
组件实现视图元素的拖动和移动功能。本文将详细介绍如何在UniApp中使用
movable-view
组件,并提供示例代码。
dogdev
·
2024-02-02 14:04
uniapp基础
uni-app
前端
javascript
uni-app移动端图片预览组件 movable-area 、
movable-view
(支持缩放,拖动效果、替换部分代码图片可直接使用)
UniApp图片预览组件利用uni-app官方、内置视图组件配合uView组件的u-popup弹框组件共同实现封装的图片预览组件,支持手指缩放、拖动效果,替换代码中部分图片后可以直接使用。效果图:组件代码://图片预览组件代码//预览组件关闭隐藏按钮//需要展示的图片exportdefault{name:"photo-preview",props:{//父组件控制显示showPicPreview:
前端白袍
·
2024-02-02 14:31
uni-app
javascript
前端
智能小程序事件系统——SJS响应事件实现方案
例如,页面有2个元素A和B,用户在A上做touchmove手势,要求B也跟随移动,
movable-view
就是一个典型的例子。
IoT砖家涂拉拉
·
2024-01-31 18:26
小程序
iot
智能小程序
面板小程序
tyml
SJS
webview
智能小程序组件汇总(全)
视图容器scroll-view可滚动视图区域swiper滑块视图容器swiper-item仅可放置在swiper组件中,宽高自动设置为100%movable-areamovable-view的可移动区域
movable-view
IoT砖家涂拉拉
·
2024-01-29 16:01
小程序
iot
云计算
组件
sass
paas
App
《微信小程序开发从入门到实战》学习九十五
默认支持缩放手势的区域是
movable-view
范围内,在movable-area组件上可以设置一个boolean类型的scale-area属性值为true时,可将缩放手势生效区域扩大为整个movable-area
那长长遥远的路
·
2024-01-28 05:01
微信小程序
学习
小程序
《微信小程序开发从入门到实战》学习九十四
7.1视图容器组件7.1.4movable-view和movable-area组件
movable-view
是一个可移动的视图容器,它需要与movable-area组件结合使用。
那长长遥远的路
·
2024-01-28 05:58
学习
uniapp中movable-area的应用
找了找资料,发现使用movable-area和
movable-view
配合起来使用能实现这样的效果。
周星星的学习笔记
·
2023-12-03 05:55
微信小程序浮动按钮_微信小程序浮动按钮的实现
初步构想记得以前看小程序组件文档时有一个
movable-view
,可以拿来用一下。结果真正使用时才发现,
movable-view
外面需要套一个movable-area才可以。没关系,套上好了。
jczhl
·
2023-11-24 22:14
微信小程序浮动按钮
微信小程序从入门到学会第三天-------小程序的组件
容器组件可以存放其它组件的容器组件,目前主要有如下几种:cover-image覆盖在原生组件之上的图片视图cover-view覆盖在原生组件之上的文本视图match-media匹配检测节点movable-area的可移动区域
movable-view
全栈大佬
·
2023-11-23 18:09
小程序
movable-view
组件(拖拽缩放)
movable-view
可移动的视图容器,在页面中可以拖拽滑动。[
movable-view
]必须在[movable-area]组件中,并且必须是直接子节点,否则不能移动。
卡_ec46
·
2023-11-23 14:03
微信小程序
movable-view
组件缩放中心的问题
微信小程序遇到需要制作根据屏幕中心点缩放组件问题:
movable-view
组件的缩放是根据
movable-view
的中心点缩放的,导致体验差解决方法:1,使用两个
movable-view
嵌套起来使用2,
阿叹_c
·
2023-11-20 04:43
小程序如何实现滑动比较图片
二、主要思想主要的结构如下(括号内部为类名),movable-area以及
movable-view
是小程序内置可以实现拖动效果的标签(也是以使用获取元素位置方法实现拖拽效果),详情可见movable-area
刘依铭
·
2023-11-17 00:47
小程序
javascript
前端
微信小程序缩放图片与滑动图片:
movable-view
与swiper一起使用所产生的手势冲突的基本解决方案(操作过于频繁还是会出现问题,基本的使用是没有问题的)
1.一些参数和需要用到的方法js代码注释都有了,只要复制过去看就好了2.怎么解决这个手势冲突呢,我采用的是mina-touch插件,去监听这两种手势,当双指在的时候,长按事件就不触发,滑动的时候长按事件也要阻止,因为在不停的滑动的时候,也会长按,大概就是这么一个思路。3.有疑问的同学欢迎留言,看到后回复4.ps:关于百度小程序的我也写过了,双指和滑动事件冲突掉了,然后去询问百度官方的也暂时没有解决
曦和百里
·
2023-10-13 02:20
微信小程序
javascript
前端
微信小程序_(组件)可拖动
movable-view
微信小程序
movable-view
组件官方文档传送门Learn一、moveable-view组件一、
movable-view
组件direction:
movable-view
的移动方向,属性值有all、vertical
weixin_30532369
·
2023-10-13 02:49
微信小程序
movable-view
实现左滑删除功能
微信小程序出了
movable-view
(点击查看官方文档)之后,我们就可以使用
movable-view
来开发左滑删除功能了。
weixin_33811539
·
2023-10-13 02:49
微信小程序使用
movable-view
实现拖动效果
微信小程序使用
movable-view
实现拖动效果1、
movable-view
组件,正如他的名字一样,是可以移动的容器,但是这个容器必须要放在movable-area中才能移动。
左眼皮一直跳
·
2023-10-13 02:48
前端
小程序
微信小程序 -- 右下角的悬浮效果,实现刷新功能(可拖拽)
一.封装组件创建一个组件"movableView",用于实现刷新功能1.movableView.wxml内容movable-area组件:是
movable-view
的
星星之火M
·
2023-10-13 02:47
微信小程序
movable-area
movable-view
微信小程序|开发实战篇之五-slide-view滑动菜单组件
开发实战篇之五前言1、微信小程序操作dom元素1.1slide-view组件的wxml骨架文件1.1.1涉及
movable-view
组件属性1.2slide-view组件的js文件1.2.1js中相关参数解释
Rookie1012
·
2023-10-13 02:17
微信小程序学习
小程序
javascript
前端
微信小程序
movable-view
移动图片和双指缩放
先从
movable-view
开始说起吧.
movable-view
是微信小程序自定义的组件.其描述为:”可移动的视图容器,在页面中可以拖拽滑动”.值得注意的是文档中有一段备注:“当
movable-view
第九程序
·
2023-10-13 02:17
微信小程序开发
微信小程序
小程序开发文档
微信小程序开发
微信小程序开发教程
微信小程序用swiper 和
movable-view
实现wx.previewImage功能
注:7.13号写的残缺版,7.14号写出来了完整版来了,最终代码贴文章最下边了相对于13号代码只改了html和js,和一个app.js中的节流方法。------------------------------------------------------------------------------------------------------------------------------
醉里挑灯寻梦回
·
2023-10-13 02:46
前端
javascript
微信小程序
微信小程序可移动悬浮按钮 movable-area
movable-view
的使用
1.将整个屏幕用movable-area组件覆盖2.在movable-area内部添加一个
movable-view
实现自由滑动,如下htmlcss.movable-area{pointer-events
T3165919332
·
2023-10-13 02:15
微信小程序
小程序
微信小程序 滑动按钮
原生微信小程序实现滑动按钮本文将介绍如何使用微信小程序中的
movable-view
和movable-area组件实现滑动按钮的功能,同时也会介绍一些注意事项。
Jiu_Bottle
·
2023-10-13 02:14
微信小程序
javascript
前端
微信小程序
movable-view
控制长按才触发拖动 轻轻滑动页面正常滚动效果
今天写movable-area+movable-view遇到了个头疼的问题那就是
movable-view
监听了用户拖拽自己但我们小程序上下滚动页面靠的也是拖拽也就是说如果放在这里用户拖动
movable-view
深圳市有德者科技有限公司-耿瑞
·
2023-10-13 02:14
微信小程序
小程序
微信小程序通过 movable-area 做一个与vuedraggable相似的上下拖动排序控件
因为只是做个小案例我就直接代码写page页面里了其实很简单组件稍微改一下就好了wxss/*设置movable-area的宽度*/.area{width:100%;}/*abc每条元素的样式*/
movable-view
深圳市有德者科技有限公司-耿瑞
·
2023-10-11 23:30
微信小程序
小程序
微信小程序movable-area的使用(会移动的小黄点)
1:movable-area要和
movable-view
组合起来使用2:这里分享一个小例子wxml代码js代码在页面里面通过设置movable-area的宽度和高度及背景色使其显示出来,同时设置
movable-view
lily_808
·
2023-10-09 13:20
小程序
微信小程序
movable-view
移动超出movable-area范围的问题
movable-view
是一个可移动的View,需要需要做为movable-area的直接子组件时候才能使用。
Mr_Tony
·
2023-10-09 13:48
前端
微信小程序 movable-area 区域拖动动态组件演示
使用movable-area组件可以对其内部的
movable-view
组件进行拖动操作,可以通过设置不同的属性和事件来自定义拖动的效果和行为。
深圳市有德者科技有限公司-耿瑞
·
2023-10-09 13:18
微信小程序
notepad++
小程序
Uniapp 视图容器 随机拖拽滑动 放大缩小
movable-view
movable-area
平台兼容性Vue2Vue3√√App快应用微信小程序支付宝小程序百度小程序字节小程序QQ小程序HBuilderX3.1.0app-vueapp-nvue√√√√√√钉钉小程序快手小程序飞书小程序京东小程序√√×√H5-SafariAndroidBrowser微信浏览器(Android)QQ浏览器(Android)ChromeIEEdgeFirefoxPC-Safari√√√√√√√√√可移动的视图
特创数字科技
·
2023-10-07 10:25
uniapp
uni-app
前端
vue
javascript
程序人生
微信小程序组件movable-area事件穿透,事件冒泡,movable-area遮盖/遮挡住其他元素之后点击事件不穿透/不冒泡解决办法
先上解决办法:.movable-area{position:fixed;top:0;left:0;width:750rpx;height:100%;pointer-events:none;}.
movable-view
喜大普奔⁶⁶⁶
·
2023-09-16 06:04
微信小程序
小程序
微信小程序movable-area+movable-view,自动吸附两边,自动向两边靠拢,微信小程序
movable-view
动态设置x,y值有问题,【解决方案】
代码片段分享链接地址:https://developers.weixin.qq.com/s/1bnpmmm87Ayy感谢小伙伴指出来的错误,已修正,分享链接已更新,感谢感谢@weixin_44644888看效果图:直接上代码,注释写的非常详细:index.wxmlLoremipsumdolorsitametconsecteturadipisicingelit.Harumtemporevolupta
喜大普奔⁶⁶⁶
·
2023-09-16 06:04
微信小程序
微信小程序
小程序
微信小程序movable-area实现左滑删除
1.实现效果2.实现原理微信小程序自带组件
movable-view
,此节点为movable-area子节点,必须包裹在movable-area中,不设置宽高时候默认为10rpx。
苏苏哇哈哈
·
2023-09-16 06:04
css
微信小程序
小程序
小程序
微信小程序movable-area制作悬浮按钮
效果图如上,在屏幕上显示一个可以拖动的悬浮按钮WXML代码movable-area代表可移动的区域,
movable-view
代表可以移动的模块WXSS代码.movable-area{pointer-events
mishu720
·
2023-09-16 06:33
微信小程序
微信小程序
小程序
uni-app使用
movable-view
移动超出movable-area范围的问题
movable-view
是一个可移动的View,需要需要做为movable-area的直接子组件时候才能使用。
船长在船上
·
2023-09-16 06:01
uni-app
uni-app 微信小程序movable-area遮盖 遮挡住 点击事件
movable-area{position:fixed;top:0;left:0;width:750rpx;height:100%;//让一个元素忽略鼠标操作pointer-events:none;}.
movable-view
高桥留
·
2023-09-16 06:00
uni-app
微信小程序
小程序
uni-app 客服按钮可上下拖动动
项目需求:因为悬浮客服有时候会遮挡住界面内容,故需要对悬浮的气泡弹窗做可拖动操作movable-area:可拖动区域
movable-view
:可移动的视图容器,在页面中可以拖拽滑动或双指缩放。
优倍网络
·
2023-09-02 06:46
uni-app
前端
uni-app 手势放大图片
手势缩放图片//directionmovable-view的移动方向,属性值有all、vertical、horizontal、none//scale是否支持双指缩放,默认缩放手势生效区域是在
movable-view
Mr_wuying
·
2023-08-30 17:39
uni-app
uni-app
滑动验证组件---设置
movable-view
组件的x属性在微信小程序端失效的问题
场景采用uniapp的
movable-view
组件实现滑动验证组件。
狼性书生
·
2023-08-22 12:35
微信小程序
小程序
uniapp
vue
前端
微信小程序实现左滑删除
由于
movable-view
需要向右移动,左滑的时候给删除控件展示的空间,故movable-area需要左移left:-120rpx;,
movable-view
右移left:120rpx;。
人民的石头
·
2023-08-16 03:03
微信小程序
微信小程序
小程序
小程序手势缩放图片
movable-view
的高度必须大于该组件内所有图片的高度,图片放大时才可以看到全部图片
次序
·
2023-08-05 08:09
小程序自定义侧滑删除组件
小程序提供了一个可移动视图容器
movable-view
;下面我来给大家介绍一个通过
movable-view
和movable-area组合编写的一个侧滑删除自定义组件。
Frankeen
·
2023-08-05 07:33
微信小程序,仿微信,下拉显示小程序效果,非常丝滑
1.视图层使用到了微信小程序的
movable-view
(可移动的视图容器)和
movable-view
的可移动区域。
键盘上行走的猿
·
2023-07-28 09:24
小程序
微信小程序
微信
小程序中的canvas不跟随scrollView滚动
原生组件还无法在scroll-view、swiper、picker-view、
movable-view
中使用。部分CSS样式无法应用于原生
hongten_chen
·
2023-07-26 04:09
小程序
Echarts
小程序
前端
css
小程序movable-area置于顶层遮盖下方元素无法操作的解决方案
此时查看文档找到了一个自带的标签可以实现此功能,代码如下text但是使用之后有个问题,movable-area充满整个页面,置于所有元素顶层导致下方的所有元素无法操作,查询资料得知可以给这两个标签增加两个样式即可
movable-view
aiqizhi6114
·
2023-07-25 13:39
小程序
movable-view
cover-view
movable-view
可移动视图
movable-view
操作dircetion可以拖动的方向scale可以双指拖放inertia惯性操作页面高度100%设置需要先设置page整页样式,注意page前没有小数点
dancebit
·
2023-07-25 13:09
微信小程序学习笔记
小程序
uniapp
movable-view
组件层级太高,导致里面事件无响应解决办法
使用movable-area、
movable-view
实现拖拽、缩放效果时,发现了一个问题,在此记录一下:
movable-view
里包裹的元素事件不会触发使用拖拽盒子后,里面的任何事物都是在拖拽盒子里面的
苡然_
·
2023-07-25 13:37
uni-app
uniapp:拖拽容器
movable-view
,层级问题解决
代码页面内容事件触发exportdefault{data(){return{x:0,y:0}},onShow(){uni.getSystemInfo({success:(res)=>{this.x=res.windowWidth/1.3this.y=res.windowHeight-200}});},methods:{toast(){console.log('不会因为层级问题,遮挡页面内容');}
sunly_
·
2023-07-25 13:36
uniapp
uni-app
javascript
前端
微信小程序input和textarea原生组件层级太高遮挡弹框的问题
解决方法:(不要在textarea和input外面套scroll-view、swiper、
movable-view
)创建一个textarea和一个view,默认显示view,点击view后,textarea
beatzcs
·
2023-07-23 09:35
小程序之坑 - 可移动/缩放canvas及如何判断canvas点击区域是否在标记的圆圈内
点击空车位能够导航到此位置,可以移动,缩放拆解:A、移动B、缩放->手势缩放和按钮缩放C、标记空车位D、点击,计算是否在空车位圆圈内效果图组件结构-移动组件-画布组件-缩放组件移动结合movable-area/
movable-view
Misha韩
·
2023-07-16 00:16
#
Taro
小程序
小程序
canvas
小程序之canvas - 移动/放大/缩小/清空/画路径
项目:taro3+vue3初始化canvas可移动的canvas结合movable-area和
movable-view
放大缩小的canvasmovable-view本身是支持放大缩小的,所以canvas
Misha韩
·
2023-07-16 00:45
小程序
#
taroUiVue3
小程序
canvas
上一页
1
2
3
下一页
按字母分类:
A
B
C
D
E
F
G
H
I
J
K
L
M
N
O
P
Q
R
S
T
U
V
W
X
Y
Z
其他