关于Unity中NGUI的背包实现之Scrollview(基于Camera)

基于UIPanel的scrollview实现方式在移动设备上的性能不如基于camera的方式。
因为UIPanel的scrollview实现方式要渲染很多的道具图,性能自然就降低了。
如果是用第二个摄像机camera的方式,物体并没有动,只是拖动第二个摄像机摄像机,这样会只渲染第二个摄像机内部能看到的区域,其他看不到的区域不会渲染,性能就比较高。

 

 

层级思路

UIRoot--Camera
  --空object(window)
    -----LU(UIAnchor或者UIWidget 内置的定位点)
    -----RD(UIAnchor或者UIWidget 内置的定位点)
    -----背景层(UISprite+BoxCollider + UIDragCamera)

 UIRoot2--Camera2

  --Table(Panel+Table面板列表容器)

    -----Item0(Widget+BoxCollider +UIDragCamera+UIButtonScale..)

 

 

基于Camera的Scrollview实例

1.创建项目工程和文件目录

2.创建第一个摄像机,NGUI---->Create---->Sprite然后删除Sprite留下第一个摄像机,设置UI Root的Scalling Scale为Constrained

3.在UI Root下创建一个空节点Window,下面创建一个子节点Sprite当作背景图,再给这个背景Sprite添加一个碰撞器Attach---->Collider因为等下要拖动。

 再给这个背景Sprite添加Drag Camera组件,可移动的摄像机。

4.以左上角和右下角两个点为定位点,在UI Root下创建两个空节点LU和RD,都添加UI Anchor组件(用NGUI Widget也可以),两个Anchor组件的Container都是相对于背景Spriite,但是Side的话LU对应Top Left,RD对应Buttom Right。

 UIAnchor,做简单的定位用的,9个定位点

 UIWidget,内置的定位点,也可以达到同样的功能,但是定位点可以自己任意的设置

  

5.创建一个空节点放在第一个UI Root的区域外面,挂载一个UI Root的组件作为第二个UI Root,Scalling Scale设置为Constrained

6.在第二个UI Root下创建一个空节点CameraOutUI,挂载一个Camera的组件,投影模式Projection设置为Orthographic投成2D,Size设置为1,Clliping Planes---->near -10,far 10,Depth深度值一定要比第一个UIRoot的Camera大,越大越在上面

7.给空节点CameraOutUI再添加一个UI Camera和UI ViewPort组件,以及UI Draggable Camera组件可以拖动摄像机

8.设置第二个UI Root的层为Default层,然后设置CameraOutUI的Camera的组件的Culling mask为Default层,只看Default层,Clear Flags设置为Dont Clear可以看见背景

9.设置UI ViewPort组件Source Camera为第一个UI Root的摄像机,Top Left和Buttom Right分别对应刚才创建的LU和RD节点,这是一个对齐的过程,Full Size是控制缩放的。Camera组件里面的Size这时候的大小是计算出来的不能改变。

10.设置UI Draggable Camera组件的Root for Bounds为第二个UI Root节点,ScaleX和Y表示是水平拖还是竖直拖,这里设置Y为0就是水平拖,如果设置X为10就是10倍的水平拖动速度,Scroll Wheel Factor表示鼠标滚轴也可以滑动,值为2,值表示滚动速率

11.在第二个UI Root下创建一个空节点Table,给这个Table挂载一个Table的组件,里面打钩Hide Inactive隐藏未激活的点,这个很关键,Padding设置为x=8,y=8

12.给空节点Table再挂载一个Panel组件,然后在Table下创建一个Widget类型的子节点叫Item0,每一个Item0节点都要Attach---->Colllider,而且要挂载Drag Camera组件关联第二个UI Root的摄像机

13.设置第一个UI Root的背景节点的Drag Camera组件的Draggable Camera为第二个UI Root的摄像机,这个是为了在拖动背景的时候道具列表也会跟着拖动

14.在Item0下面创建一些Sprite子节点,小Label之类的,可以给Item0加一些特性组件,比如Button Scale按钮缩放和Play Sound播放声音组件,然后再复制许多的Item0出来

15.设置Table节点的Tabel组件的Colums列数设置为1,可以看到所有的Item0排成一列,再设置为0,可以看到所有的Item0排成一行。

16.选中第二个UI Root的摄像机,调整位置到刚好是看到这些Item0的最佳位置

17.解析图

 

转载于:https://www.cnblogs.com/HangZhe/p/7472880.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/253527.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

YUV422/420 format

(在本文中,U 一词相当于 Cb,V 一词相当于 Cr。) YUV422 format as shown below 4:2:2 表示 2:1 的水平取样,没有垂直下采样 YUV420 format as shown below4:2:0 表示 2:1 的水平取样,2:1 的垂直下采样. YUV4:2:0并不是说只有U&…

数字后端——ECO

目录 一、概述 二、ECO分类 1、按时间节点 1)流片前的ECO 2)流片过程的ECO 3)流片后的ECO 2、按网表是否改变 1)功能ECO 2)时序ECO 三、ECO处理内容 1、设计规则违例 1)提升标准单元驱动力 2…

电视百科常识 九大视频接口全接触

1 射频 天线和模拟闭路连接电视机就是采用射频(RF)接口。作为最常见的视频连接方式,它可同时传输模拟视频以及音频信号。RF接口传输的是视频和音频混合编码后的信号,显示设备的电路将混合编码信号进行一系列分离、解码在输出成像。…

数字后端——物理单元介绍

物理单元( physical cell)指没有逻辑功能但是具有物理实现功能的标准单元, 用于抑制芯片生产过程中的各类物理效应, 保证芯片生产后能够正常工作 。硬核位置确 定后,需要插入物理单元消除影响芯片工作的物 效应&#x…

深入Java内存模型

你可以在网上找到一大堆资料让你了解JMM是什么东西,但大多在你看完后仍然会有很多疑问。happen-before是怎么工作的呢?用volatile会导致缓存的丢弃吗?为什么我们从一开始就需要内存模型? 通过这篇文章,读者可以学习到足…

Matlab 使用GPU加速 转载

在matlab中使用GPU加速,来加速矩阵运算。 首先如前面所说,并不是所有GPU都能在maltab中进行加速的,貌似只有NVDIA的显卡可以吧。 硬件:GeForce GTX 980 软件:Matlab 2015a (Matlab 2012以后的版本才带有GP…

数字后端——可制造性设计

随着集成电路制造工艺技术的迅速发展,集成电路集成度迅速攀升,制造流程及工艺步骤日趋复杂,工艺尺寸也在不断缩小。集成电路可制造性设计(Design For Manufacturability,DFM) 以直接提升集成电路芯片的良品率及降低芯片…

Cloudstack安装(二)

Cloudstack安装 官方文档参考: http://docs.cloudstack.apache.org/projects/cloudstack-installation/en/4.9/qig.html#environment Cloudstack主要分Management和Agent两部分。 系统版本:CentOS 6.8 Management: cpu1,ram 2048M…

Pycharm 输出中文或打印中文乱码现象的解决办法

转载地址:https://www.cnblogs.com/Bro-Young/p/5920884.html 1. 确保文件开头加上以下代码: 1 # -*- coding:utf-8 -*- 还可以加上 1 import sys 2 reload(sys) 3 sys.setdefaultencoding(utf-8) 确保以下。 如果还是没有解决中文乱码,那么进…

计算机系统结构——概述

计算机的实现包括两个方面:组成和硬件。组成一词包含了计算机设计的高阶内容,例如存储器系统,存储器互连,设计内部处理器 CPU (中央处理器——算术、逻辑、分支和数据传送功能都在内部实现)。有时也用微体系…

全景图像拼接——基本流程

图像拼接技术是数字图像处理技术一个重要的研究方向,它即是将两幅或多幅相互有部分重叠的场景照片拼接成具有超宽视角、与原始图像接近且失真小、没有明显缝合线的高分辨率图像。可以很好地解决广角镜、鱼眼镜头等全景图获取设备的不足。如下图: 图像拼接产生的图像不…

WPF 带CheckBox、图标的TreeView

WPF 带CheckBox、图标的TreeView 在WPF实际项目开发的时候,经常会用到带CheckBox的TreeView,虽然微软在WPF的TreeView中没有提供该功能,但是微软在WPF中提供强大的ItemTemplate模板功能和自定义样式,那我们可以自己写一个这样的控…

win32框架,GDI图形编程写一个HelloWorld游戏_c语言

1.如图,实现功能: Hello World!字符串跟随鼠标移动鼠标左击Hello World!颜色为红色鼠标右击Hello World!颜色为蓝色鼠标滚轮滚动改变Hello World!颜色的RGB中的G值 2.实现工具: vs20133.实现步骤: 新建一个win32项目 如图,看到HelloWorldGame.cpp中 _tWinMain()的函…

全景图像拼接——图像融合

图像融合技术就是将配准过后的图像融合成一幅宽视角、大场景的图像。但由于图像采集过程中各种因素的影响,例如光照、角度、距离等,从而导致图像间的光照不均匀、颜色上不连续。 经过配准以后,参考图像和输入图像已经在同一个坐标系下,如果只是取某一幅图像的信息或者简单地…

极详细的ECC讲解 -OOB与ECC

http://blog.csdn.net/dongzhichen/article/details/8249228 详细的ECC讲解 -OOB与ECC 在网络编程中 OOB(out of band)带外数据 在MTD设备中 OOB 如下所示: http://www.cnblogs.com/bcxx_qin/archive/2009/06/11/1501271.html 极详细的ECC…

前端进阶(8) - 前端开发需要了解的工具集合:webpack, eslint, prettier, ...

前端开发需要了解的工具集合:webpack, eslint, prettier, ... 前端开发需要了解的一些工具,这些工具能够帮助你在项目开发中事半功倍。 1. nrm: npm registry 管理器 registry: npm 远程仓库的地址。 由于众所周知的原因,npm 官方仓库在国内特…

CMOS图像传感器——TOF 图像传感器

一、3D成像技术概述 图像传感器一直以来都是人类研究的热点。但随着当代科学技术发展, 人类对于传统的 2D 图像传感器的要求越来高,不仅期望着更高分辨率,更快速度,更大的动态范围,人类加希望能够获得物体深信息,但是 2D 成 像技术现在已经不能满足人类的需求,所以应运…

AndroidStudio创建jinLibs文件夹

在文件中的buildTypes节点下添加 sourceSets.main { jniLibs.srcDir libs } 如图 转载于:https://www.cnblogs.com/kim-liu/p/7479360.html

内嵌Tomcat的Connector对象的静态代码块

在排查问题的过程中发现Connector对象有一个静态代码块: static {replacements.put("acceptCount", "backlog");replacements.put("connectionLinger", "soLinger");replacements.put("connectionTimeout", &quo…

【Python爬虫学习笔记1】网络协议及请求基础

http协议与https协议 HTTP协议(全称为HyperText Transfer Protocol,超文本传输协议),是发布和接收HTML页面的方法,其服务端口号为80。 HTTPS协议为HTTP协议的加密版本,其在HTTP下加入了SSL层,服务端口号为443。 URL结构…