Commit ab76f4d7eb7b0ecb67702e5eb285fbfef7c5e3e9
1 parent
acda5d3b
移动的原理
Showing
2 changed files
with
57 additions
and
4 deletions
packageA/pages/my_service/appment_main.js
@@ -659,6 +659,11 @@ Page({ | @@ -659,6 +659,11 @@ Page({ | ||
659 | is_textea: 1 | 659 | is_textea: 1 |
660 | }) | 660 | }) |
661 | th.query_project(); | 661 | th.query_project(); |
662 | + | ||
663 | + th.queryMultipleNodes(); | ||
664 | + | ||
665 | + | ||
666 | + | ||
662 | }, | 667 | }, |
663 | //获取单个服务项目信息 | 668 | //获取单个服务项目信息 |
664 | query_project: function() { | 669 | query_project: function() { |
@@ -816,5 +821,53 @@ Page({ | @@ -816,5 +821,53 @@ Page({ | ||
816 | // that.data.writesize = [res.width, res.height]; | 821 | // that.data.writesize = [res.width, res.height]; |
817 | }).exec(); | 822 | }).exec(); |
818 | }, | 823 | }, |
824 | + | ||
825 | + //开始拖拽 | ||
826 | + touchmove: function (e) { | ||
827 | + var that = this,th=that; | ||
828 | + var position = [e.touches[0].pageX - that.data.writesize[0] / 2, e.touches[0].pageY - that.data.writesize[1] / 2 - this.data.scrolltop]; | ||
829 | + that.setData({ | ||
830 | + write: position | ||
831 | + }); | ||
832 | + | ||
833 | + }, | ||
834 | + | ||
835 | + | ||
836 | + touchend:function(e){ | ||
837 | + var that = this,th=that; | ||
838 | + var position =th.data.write; | ||
839 | + for(var i=0;i<7;i++){ | ||
840 | + for(var j=0; j<2;j++){ | ||
841 | + //如果坐标在网格内 | ||
842 | + if( position[0]>th.data.f_x+i*th.data.f_width && position[0]<th.data.f_x+ (i+1)*th.data.f_width && | ||
843 | + position[1]>th.data.f_y +j*th.data.f_hei && position[1]<th.data.f_y+(j+1)*th.data.f_hei ){ | ||
844 | + wx.showToast({ | ||
845 | + title:"222"+i+j | ||
846 | + }) | ||
847 | + break; | ||
848 | + } | ||
849 | + | ||
850 | + } | ||
851 | + } | ||
852 | + | ||
853 | + }, | ||
854 | + | ||
855 | + | ||
856 | + //声明节点查询的方法 | ||
857 | + queryMultipleNodes: function() { | ||
858 | + var th=this; | ||
859 | + const query = wx.createSelectorQuery() // 创建节点查询器 query | ||
860 | + query.select('.content_view').boundingClientRect() // 这段代码的意思是选择Id=productServe的节点,获取节点位置信息的查询请求 | ||
861 | + query.selectViewport().scrollOffset() // 这段代码的意思是获取页面滑动位置的查询请求 | ||
862 | + query.exec(res => { | ||
863 | + console.log(res); | ||
864 | + th.data.f_x=res[0].left; | ||
865 | + th.data.f_y=res[0].top; | ||
866 | + th.data.f_hei=res[0].height; | ||
867 | + th.data.f_width=res[0].width; | ||
868 | + | ||
869 | + }) | ||
870 | + } | ||
871 | + | ||
819 | 872 | ||
820 | }) | 873 | }) |
821 | \ No newline at end of file | 874 | \ No newline at end of file |
packageA/pages/my_service/appment_main.wxml
@@ -29,8 +29,8 @@ | @@ -29,8 +29,8 @@ | ||
29 | <view class="flex t-c" bindtap="rect"> | 29 | <view class="flex t-c" bindtap="rect"> |
30 | <view bindtap="rect"> | 30 | <view bindtap="rect"> |
31 | <view class="td blue">张三</view> | 31 | <view class="td blue">张三</view> |
32 | - <view class="td" bindtap="print">100</view> | ||
33 | - <view class="td">200</view> | 32 | + <view class="td content_view {{v[0][0]?"":''}} " bindtap="print">{{v[0][0]}}</view> |
33 | + <view class="td">{{v[0][1]}}</view> | ||
34 | </view> | 34 | </view> |
35 | <view> | 35 | <view> |
36 | <view class="td blue">张三</view> | 36 | <view class="td blue">张三</view> |
@@ -63,7 +63,7 @@ | @@ -63,7 +63,7 @@ | ||
63 | <view class="td">200</view> | 63 | <view class="td">200</view> |
64 | </view> | 64 | </view> |
65 | <view> | 65 | <view> |
66 | - <view class="td blue">1张三</view> | 66 | + <view class="td blue">张三</view> |
67 | <view class="td">300</view> | 67 | <view class="td">300</view> |
68 | <view class="td">300</view> | 68 | <view class="td">300</view> |
69 | </view> | 69 | </view> |
@@ -215,4 +215,4 @@ | @@ -215,4 +215,4 @@ | ||
215 | <!-- 制作一个圆球导航 --> | 215 | <!-- 制作一个圆球导航 --> |
216 | <!-- <nav_b id="nav_b"></nav_b> --> | 216 | <!-- <nav_b id="nav_b"></nav_b> --> |
217 | 217 | ||
218 | -<view bindtouchmove="touchmove" catch:touchmove style="position:absolute;left:{{write[0]}}px;top:{{write[1]}}px;">我可以移动</view> | ||
219 | \ No newline at end of file | 218 | \ No newline at end of file |
219 | +<view bindtouchmove="touchmove" bindtouchend="touchend" catch:touchmove style="position:absolute;left:{{write[0]}}px;top:{{write[1]}}px;">我可以移动</view> | ||
220 | \ No newline at end of file | 220 | \ No newline at end of file |