项目层次:

scrollviewbg是600x150的背景图,Inspector视图如下:

panel就是scrollview父容器了,size为600x150,Inspector视图如下:

item就是scrollview里面的每一项了,大小200x150,Inspector视图如下:

以上附加的脚本都是默认设置,此时运行程序,效果如下:

可以看出最后不需要显示的图片没有隐藏,解决办法就是设置panel下UIPanel的Clipping,把此项设置为soft clip即可!运行效果:

如果想实现这样的效果:当拖拽到最后一张图片的时候,此时不是就没了,而是播放第一张图片,相当于把这些图片串成一个圆圈一样,此时我们只要给Panel加个UIWrap Content脚本即可,Item Width为每一项的宽度,我这里的每一项宽度为200,所以我设置成200,Cull Content不要勾选,勾选的情况等下讲,此时效果如下:

但使用UIWrap Content脚本会出现一个问题就是,程序未运行时,每一项展现的次序分别为1,2,3,4,5,其中4,5是隐藏的,那么程序运行起来应该展现的是1,2,3

但是程序运行起来,展现的确实5,2,3,所以如果想展现的是1,2,3的话,那么就要把1放在5的位置,2放在1的位置,3放在2的位置即可!

下面说说Cull Content被勾选的情况:

我们先看看被勾选时运行的效果吧,对一个选项不明白的话,有时候运行程序就能看出区别了:

从效果图可用看出,图片并不会绕圈播放,而是显示空白,而且只有点击每一项才能进行拖动,因为只有每一项添加了UIDrag Scroll View拖拽脚本,如果想点击背景的空白处也能拖拽,控制每一项向左或向右移动,此时我们只要给scrollviewbg添加一个UIDrag Scroll View和Box Collider,并且UIDrag Scroll View脚本的Scroll View设置为panel即可!Drag Scroll View的Scroll View 属性可以指定特定的带有Scroll View的拖拽层,如果不指定在运行时会自动匹配父节点带有绑定Scroll View的拖拽层。

效果如下:

说下UIScroll View脚本每一个选项的含义:

Content Origin:表示子项的起始位置,

选择left:

选择right:

其他的自己看看就知道了

Movement:拖拽的方向,有垂直,水平,自定义,自由四个可选项

Drag effect:拖拽效果,有三个选项,None、Momentum与MomentumAndSpring,None不使用任何效果,Momentum表示使用动量效果,(动量与None在效果上看不出任何差异),MomentumAndSpring带有弹力效果,使用该效果在运行时会自动生成一个Spring Panel的脚本。

scroll wheel factor:滚轮因子,只有当光标放在了panel上,并且scroll wheel factor不为0,那么此时转动鼠标滚轮,panel下的子项会进行滑动,就相当于直接用鼠标点击拖拽的效果一样,只不过现在可以用滚轮替代,scroll wheel factor可以为正数,也可以为负数,只是滑动的方向相反罢了,正负控制的是方向,值的大小,控制的是滑动的力度

momentum amount:动量的数量,通俗的讲就是拖拽产生弹力的大小:(下面的效图果使用的力是相同的)

值为10的效果:

值为1000的效果:

使用默认值35即可!

restrict within panel:限制在panel中,如果不勾选的话,就不会产生弹力效果了!

Cancel Drag if fits:如果适合取消拖动,不懂,默认值即可

smooth drag start:平滑拖动开始,默认值即可

IOS Drag Emulation:iOS阻力模拟,默认值即可

scroll bars:分为垂直方向和平行方向的滚动条,赋值类型为UIProgress Bar类型!

Show Condition也有三个选项:Always表示总是显示滚动条,OnlyIfneeded如果必要就显示,不然隐藏,whendragging表示拖拽时产生滚动条

下面我先展示下Scroll View配合UIProgress Bar产生的效果图,对UIProgress Bar不懂的,我将出一篇关于这个的,敬请关注!

NGUI-UIScroll View的使用及注意点的更多相关文章

  1. iphone/ipad关于size, frame and bounds总结和UIScroll view学习笔记

    1. iphone/ipad大小 Device Screen dimensions(in points) iphone and ipod 320 X 480 ipad 768 X 1024 2. UI ...

  2. NGUI 基础知识

    UIRoot 管理 scalePixelPerfect : 像素匹配,图片不会被缩放,除非屏幕高度小于 Minimum Height 或者大于 maximum  Height,如果那样的话,就使用 F ...

  3. NGUI学习笔记(一):官方视频学习记录

    学习NGUI一直断断续续的,目前打算做一个总结的笔记. 我使用的是比较老的3.6.0版本. 1.使用NGUI,需要开启“Edit”->“Project Settings”->“Physic ...

  4. NGUI学习笔记(六):ScrollView、Grid和Table

    下面我们来看看游戏UI开发中比较核心的开发,我称为列表开发,比如背包和各种形式不一的列表等,下面我们来看几个具体的样例:   基本上就是一些重复的制作好的多个UI控件进行排列,同时可以支持滚动,当然, ...

  5. (转)u3d设计模式

    Unity3d中UI开发的MVC模式 ,和游戏开发的其他模块类似,UI一般需要通过多次迭代开发,直到用户体验近似OK.另外至关重要的是, 我们想尽快加速迭代的过程.使用MVC模式来进行设计,已经被业界 ...

  6. NGUI-UIProgressBar,UIScrollBar,UISlider

    UIProgressBar是UIScrollBar和UISlider的基类 1.先来看下UIProgressBar(进度条)的使用 层次: progressBar的Inspector视图: 而fore ...

  7. NGUI之scroll view制作,以及踩的坑总结

    http://blog.csdn.net/monzart7an/article/details/23878505 链接: http://game.ceeger.com/forum/read.php?t ...

  8. NGUI例子Scroll View场景中item添加点击后自动滑到终点

    http://blog.csdn.net/luyuncsd123/article/details/22914497 最近在做一个项目的UI,需求是1.拖动items后当永远有一个item保存在中间位置 ...

  9. NGUI系列教程十(Scroll View实现触摸滚动相册效果)

    NGUI中提供了两种Scroll View 一种是通过手指或鼠标滑动视图时移动平面物体,另一种则是直接移动摄像机,他们各有各的好处.但是NGUI提供的Scroll View很难实现类似Android ...

随机推荐

  1. Codeforces 758A Holiday Of Equality

    题目链接:http://codeforces.com/problemset/problem/758/A A. Holiday Of Equality time limit per test 1 sec ...

  2. 【转】Android xml资源文件中@、@android:type、@*、?、@+含义和区别

    一.@代表引用资源 1.引用自定义资源.格式:@[package:]type/name android:text="@string/hello" 2.引用系统资源.格式:@andr ...

  3. python中的for循环如何控制步长

    for i in range(开始/左边界, 结束/右边界, 步长): print i 例如 for i in range(1, 10, 2): print i 等价于 for (i=1;i<= ...

  4. 配置伪静态(URL重写)

    本篇借鉴了很多文章,这里做个记录. 有时我们的导航栏出现xx.aspx?id=x&name=xx 等等这样,会显得不好看,我们可以利用伪静态来美化我们的导航栏,伪静态的形式可以自己定义,本质还 ...

  5. ES6初识-Decorator

    开始先按照个插件 npm install babel-plugin-transform-decorators-lagacy --save-dev 1.扩充和修改类的行为 2.修改的行为@readonl ...

  6. c++标准之IO库

    1.面向对象的标准库 2.多种IO标准库工具 istream,提供输入操作 ostream,提供输出操作 cin:读入标准输入的istream对象.全局对象extern std::istream ci ...

  7. cordova创建工程添加插件

    创建工程 phonegap创建工程 代码 用以创建自己需要的  工程名   ; 报名  ;类名 ; 应用名 cordova create hello com.example.hello HelloWo ...

  8. xml解析之stax

    博文引自:http://zangweiren.iteye.com/blog/647334 Java 6.0对XML支持的新特性有许多方面.比如StAX.针对XML-Web服务的Java架构(JAX-W ...

  9. php 操作 mysql 实现批量执行mysql语句 mysql文件

    <?php /** * 批量运行sql文件 * 正则分隔是重点 preg_split("/;[\r\n]+/", filecontent) */ $config = requ ...

  10. php-5.6.26源代码 - 扩展模块的加载、注册

    // main实现在文件 php-5.6.26\sapi\cgi\cgi_main.c int main(int argc, char *argv[]) { .... cgi_sapi_module- ...