scroll-view

我们都知道点击tab按钮的时候，可以让scroll-view滑到指定的地方（scroll-into-view）,但是手动滑到某个地方的时候，却不能反过来控制选中对应的tab，这时就只能自定义了

<scroll-view @scroll="scrolling" scroll-y="true" :scroll-with-animation="true" :scroll-into-view="valuescrollto":style="'height:'+cardscrollheight+'px;'">
</scroll-view>

scrolling(e) {if (!this.heightgot) {//在onshow或者mounted中获取不到滚动元素的高度或者获取的高度都是0，所以只能在这里获取，并且控制到只获取一次let query = uni.createSelectorQuery().in(this)let _this = thisquery.select('#itemindex0').boundingClientRect(data => {_this.onetotop = data.top}).exec();query.select('#itemindex1').boundingClientRect(data => {_this.twototop = data.top}).exec();query.select('#itemindex2').boundingClientRect(data => {_this.threetotop = data.top}).exec();query.select('#itemindex3').boundingClientRect(data => {_this.fourtotop = data.top}).exec();this.heightgot = true//保证只获取一次} else {if (this.aftertab) {//如果是点击了tab而产生的滚动，就不作处理this.aftertab = falsereturn}if (e.detail.scrollTop < this.twototop - this.onetotop) {//手指滑动this.tabIndex = 0} else if (e.detail.scrollTop < this.threetotop - this.onetotop) {this.tabIndex = 1} else if (e.detail.scrollTop < this.fourtotop - this.onetotop) {this.tabIndex = 2} else {this.tabIndex = 3}this.valuescrollto = ''}
},

scroll-view相关推荐

如何在Storyboard中使用Scroll view
本文章环境Xcode 11 在开始使用scroll view之前(storyboard/XIB),我们必须搞清楚两个东西在Storybord/Xib中使用Scroll view,会有哪些结构为什么 ...
UGUI组件之ScrollRect 组件简单笔记(Scroll View)
======================================================== 1.ScrollRect 介绍 Scroll View 添加ScrollRect组件用 ...
unity3d UGUI Scroll View的使用
在使用ugui的时候,碰到了无法设置Scrollbal Horizontal和Scrollbal Vertical成Active(不工作),其根据原因是Content的长度太短,必须比Scroll V ...
Scroll View 控件以Thumbnail的方式显示一个目录的全部图片，相似图片浏览器
MAC : XCode -> Scroll View 控件以Thumbnail的方式显示一个目录的全部图片,类似图片浏览器 STEP1:将两个目录复制到project里面ImageBrowser ...
Scroll View控制菜单栏的伸缩
一:操作篇在Cavas 添加Scroll View,想要横排的物品栏.在Viewport 下的Content上添加组件:Grid Layout Grop和Content Size Fitter 在C ...
文字太多时给文本框添加滑动条——text + ContentSizeFitter + Scroll View
文字少的时候,直接显示文字:文字多的时候,自动添加滑动条,拖动滑动条后查看全部文字. 1.字少的时候 2.字多的时候自动增加一个垂直滑动条一.问题的来源在一个固定区域显示文字,这些文字有时候会很多 ...
Unity UGUI基础之 Scroll View/Scroll Rect 的简单使用，并取消拖拽(滑动内容)效果，拖拽只在Scrollbar 上起作用
Unity UGUI基础之 Scroll View/Scroll Rect 的简单使用,并取消拖拽(滑动内容)效果,拖拽只在Scrollbar 上起作用目录 Unity UGUI基础之 Scro ...
(Endless)Scroll View(画卷滚动视图)
就像酱紫,可以左右拖拉或者用下面的拉动条滚动. 之前做过Endless scroll view(无止境的画卷视图)的,像环状一样,左边拉完,会从右边出来,右边从左边出来先把Endless scrol ...
Unity3D UGUI Scroll View 二级滚动菜单
前言如果有更好的写法或是代码有什么错误等等,还请大佬教教我. 最终效果大概就这么个效果,使用的Scroll View做的,我使用的是中文版,看不懂英文,没得法准备预制件(各预制件结构在文中会有 ...
【UGUI】Scroll View滚动视图
Scroll View 组成回顾Scrollbar滚动条 Scroll Rect组件 Content:可以滚动的内容,该对象必须是带有Scroll Rect的子控件 Horizontal:数据是否可 ...

scroll-view

scroll-view相关推荐

最新文章

热门文章