(一)可拖动窗体的实现:

1:添加一个Sprite为鼠标点击区域,改名为:DragSprite

2:给DragSprite添加Collider

3:给DragSprite添加Drag Object ,脚本为"UIDrag Object"

4:为UIDrag Object下的Target赋值:拖动Panel到Target。

当我们拖动窗体时,有可能把窗体拖出屏幕外面,我们可以勾选UIDragObject的KeepVisible,然后把拖动区域的图片设置到ContentRect下,这样当窗体跑出屏幕后,会被自动弹回来


(二)改变窗体大小的实现:

UIDragResize脚本

1:添加一个Sprite为鼠标点击Drag区域

2:将该Sprite锚定到顶层Sprite的右下角

3:给该Sprite添加Collider

4:给该Sprite添加Drag-Resize Widget,脚本为"UIDragResize"

5:为UIDragResize下的Target赋值:拖动顶层的Sprite添加到Target。

5:设置Pivot为BottomRight,此为改变大小的点。


(三)ScrollView的实现

1.添加滚动条即ScrollBar。

 滚动条我要做成横向的,所以把Direction设置成:LeftToRight;

 调整Background 和Foreground的长度,两者的Dimensions的长必须一致,宽根据自己的感觉调整,无所谓;

(2)创建一个ScrollView。

 调整好ScrollView上UIPanel的裁剪区域。

  

调整UIScrollView :

  Content Origin :这是下面子项目的对齐方式,为了从左边开始,将其设置成Left

Movement: Horizontal 即水平位移

  其他的默认即可

将刚才创建的ScrollBar赋值到ScrollBars下的Horizontal。如果要做垂直方向的要赋值到Vertical下。。

(3)添加UIGrid,此脚本为子项排布

  Arragement:排布方向

        Horizontal:水平方向

        Vertical:垂直方向

  Cell Width: 每个子项占据的宽度

  Cell Height: 每个子项占据的高度

(4)在ScrollView下创建子项。

 随意创建几个button。

   然后运行就能看到效果了。

(5)实现子项的拖拽

  只需为每个button添加UIDragScrollView,就能实现点击拖拽功能了。很简单吧。。。

NGUI3.5系列教程之 一些小功能的实现的更多相关文章

  1. Spring 系列教程之容器的功能

    Spring 系列教程之容器的功能 经过前面几章的分析,相信大家已经对 Spring 中的容器功能有了简单的了解,在前面的章节中我们一直以 BeanFacotry 接口以及它的默认实现类 XmlBea ...

  2. Python Twisted系列教程7:小插曲,Deferred

    作者:dave@http://krondo.com/an-interlude-deferred/  译者:杨晓伟(采用意译) 你可以从这里从头开始阅读这个系列 回调函数的后序发展 在第六部分我们认识这 ...

  3. 【redis 学习系列08】Redis小功能大用处02 Pipeline、事务与Lua

    3.Pipeline 3.1 Pipeline概念 Redis客户端执行一条命令分为如下四个过程: (1)发送命令 (2)命令排队 (3)命令执行 (4)返回结果 其中(1)和(4)称为Round T ...

  4. Vue + Webpack + Vue-loader 系列教程(1)功能介绍篇

    原文地址:https://lvyongbo.gitbooks.io/vue-loader/content/ Vue-loader 是什么? vue-loader 是一个加载器,能把如下格式的 Vue ...

  5. 【redis 学习系列07】Redis小功能大用处01 慢查询分析以及Redis Shell

    Redis提供了5种数据结构已经足够强大,但除此之外,Redis还提供了诸如慢查询分析.功能强大的Redis Shell.Pipeline.事务与Lua脚本.Bitmaps.HyperLogLog.发 ...

  6. 【全网最全的博客美化系列教程】02.添加QQ交谈链接

    全网最全的博客美化系列教程相关文章目录 [全网最全的博客美化系列教程]01.添加Github项目链接 [全网最全的博客美化系列教程]02.添加QQ交谈链接 [全网最全的博客美化系列教程]03.给博客添 ...

  7. 【全网最全的博客美化系列教程】08.自定义地址栏Logo

    全网最全的博客美化系列教程相关文章目录 [全网最全的博客美化系列教程]01.添加Github项目链接 [全网最全的博客美化系列教程]02.添加QQ交谈链接 [全网最全的博客美化系列教程]03.给博客添 ...

  8. 【全网最全的博客美化系列教程】01.添加Github项目链接

    全网最全的博客美化系列教程相关文章目录 [全网最全的博客美化系列教程]01.添加Github项目链接 [全网最全的博客美化系列教程]02.添加QQ交谈链接 [全网最全的博客美化系列教程]03.给博客添 ...

  9. Smart3D系列教程4之 《案例实战演练1——小物件的照片三维重建》

    一.前言 Wish3D出品的Smart3D系列教程已经推出3讲了,分别是关于倾斜摄影三维建模原理应用.照片采集技巧.Smart3D各个功能模块的作用,它们都是围绕Smart3D建模软件进行的讲解.那么 ...

随机推荐

  1. 判断当前是否运行于Design Mode

    在使用Visual Studio设计XAML时,设计器运行在[设计时]状态.VS在内部运行这些代码,帮你把界面的类真实效果展示出来.一般情况下也不会有什么问题,但是当代码中存在外部资源时,XAML可能 ...

  2. java基础-在dos控制台编写简易的java程序

    第一步:在文件夹中修改隐藏的文件扩展名,让其文件的扩展名全部显示: 第二步:在文件夹中新建一个text文件,将其扩展名属性改为Hello.java的文件扩展名: 第三步:点击右键打开方式用txt文本打 ...

  3. Python15-day1课后作业

    功能:编写一个用户登录接口 要求:1)根据提示输入用户名.密码信息 2)输入的用户.密码正确则显示欢迎信息 3)连续三次输入错误则锁定账号 #coding=utf-8import sys,os,get ...

  4. 简洁的drag效果,自由拖拽div的实现及注意点

    偶然间看到了以前做的一个简洁的div拖拽效果,修改了一下加点注释,经测试完美通过firefox/chrome/ie6-11,现拿来分享一下. 先说一下实现原理及要点,最主要的有三步.第一步是mouse ...

  5. 纯JS画点、画线、画圆的方法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. Miniui updateRow更改列字段值

    当UPC等于upccode时,更改列Scanned+1 //先grid.findRow找到UPC等于upccode的行对象 var row = grid.findRow(function (row) ...

  7. part 5 Two way databinding in AngularJS

  8. JavaScript之菱形打印

    很高兴来到博客园!迈入这座知识的殿堂,实是幸运.这是我的第一篇博客,开启丰富有趣的学习之旅,同时,我希望和大家一起学习一起进步,Let‘s go! <!DOCTYPE html PUBLIC & ...

  9. Cisco基本命令配置

    实验一 路由器的基本命令操作 1 实验目标 ü 熟悉路由器的命令行操作 ü 能够使用命令行帮助 ü 能够查看路由器接口信息 ü 能够产看路由器配置信息 ü 能够配置以太网接口 ü 能够配置广域网接口 ...

  10. [Android开发系列]IT博客应用V1.3

    首先,感谢使用这款软件并给我意见的朋友们,有你们的意见,才有了这个版本. 其次,检索功能和分类筛选功能(如果是你提的意见,记得在下面mark哦,毕竟读代码你能发现,其实发意见这个就是用自己的邮箱给自己 ...