• 关于Unity的NGUI


    NGUI是严格遵循KISS原则并用C#编写的Unity(适用于专业版和免费版)插件,提供强大的UI系统和事件通知框架

    KISS原则:Keep It Simple,Stupid

    NGUI实例

    1.创建Unity工程项目和文件目录,保存场景

    2.导入NGUI的package包(第73),使用3.9.4b版本的,最新版本的是收费的...而且配合Unity5.X还有一些小问题

    3.导入成功后会发现多了一个菜单栏,可以点击Help查看API文档说明

    4.NGUI文件目录

     Editor:编辑器用到的一些资源文件,一些预设的图片

     Examples:存放一些自带的案例

     Resources:存放一些资源,着色器Shader

     Scripts:存放一些脚本

     

    5.Examples/Scene里面的案例

    一般在测试的时候点Scene视图里的2D按钮,忽略Z轴

    案例零:常用UI控件

    案例一:锚点

    锚点的作用:拖拉拉伸屏幕的时候,始终不会变形,总是贴着屏幕走,原来是在右上角的节点,拉伸后还是在右上角,改变屏幕分辨率或者比例也不会变,这就是锚点的作用,固定某个节点的位置。

    Anchors属性:

      Type:锚点类型,None没有锚点,Unified统一的锚点

      Target:锚点的目标,也就是距离哪个物体的上下左右,这里的UI Root是NGUI的根节点

      Left、Right、Bottom、Top是此节点距离UI Root节点Left和Top边(可以选择)的上下左右的距离,单位是像素(2D)

      如:此节点的Left边与UI Root节点的Left边的距离是0像素,此节点的Right边与UI Root节点的Left边的距离是180像素

      

      案例二:界面3D转2D,2D转3D

      案例三:打字机效果,适用于MMORPG之类的,和NPC对话的时候。

      案例四:菜单效果

      案例五:高光效果

      案例六:可拖拽窗口

      案例七、八:拖拉列表的不同实现

      案例九:玩家任务的隐藏和详情显示

      案例十:多国语言切换

      案例十一:背包道具拖拽

      案例十二:聊天窗口

      案例十三:菜单栏切换,常用于游戏商城

      案例十四:道具列表滚动条

      案例X:背包道具拖拉、装备穿戴、装备颜色变换、装备属性浮动效果

        

    6.制作自己的NGUI界面

    要注意的是,Unity也自带了一套UI系统,用的时候不要混淆,不要用它自带的,而是要用我们菜单栏上的NGUI创建出来的UI节点

    我们的  自带的

    (1)新创建一个场景game_scene

    (2)NGUI---->Create

     Sprite:精灵,和Unity的精灵不一样

     Label:标签,一段文字,描述道具的使用方法,多少金币

     Texture:纹理

     Unity 2D Sprite:Unity的2D精灵

     Widget:可以控制以上所有的节点,以上的所有节点都继承于它

     Anchor(Legacy):锚点,已经废弃,不代表不能用,将来可能会被移除

     Panle:面板

     Scroll View:滚动条

       Grid:网格

     Table:表格

    (3)创建一个精灵:NGUI---->Create---->Sprite

    帮我们创建了一个UI Root根节点和一个摄像机子节点

     UI Root节点下的UI Root组件,屏幕适配的策略,灵活的

    UI Root节点下Sprite节点的UI Sprite组件,选择图集和贴图,在选择图集的时候点Show All可以把所有存在的图集都显示出来

    UI Root节点下Sprite节点的UI Sprite组件,可以通过代码改变填充进度条Fill Amount的数值,就可以实现技能冷却CD或者进度条的效果

    UI Root节点下Sprite节点的UI Sprite组件的Widget属性,改变大小和缩放在这里修改,不要去动Transform组件的大小和缩放,

                                    Aspect设置基于谁缩放,snap恢复原始状态,Depth设置节点的深度,深度决定节点的显示顺序,层级关系,不要设置两个节点的Depth值一样。改变Transform组件的Z轴坐标是没有用的

                                    小技巧:鼠标放在Transform的坐标轴的XYZ的字上面可以左右拖拉来改变数值大小

    (4)创建一个精灵按钮:NGUI---->Create---->Sprite,然后再NGUI---->Attach---->Button Script,NGUI---->Attach---->Collider(加碰撞体的原因是,NGUI内部是发射射线碰撞后来触发按钮的,和3D拾取原理一样)

    UI Root节点下Sprite节点的UI Button组件

    UI Root节点下Sprite节点的UI Button组件的Sprites属性,实现按下按钮换图,一般美术会提供三套图

    UI Root节点下Sprite节点的UI Button组件的On Click属性,可以关联按钮的脚本触发函数

    UI Root节点下的Camera节点的UI Camera组件的Event Sources属性,按钮事件的事件源

    (5)NGUI---->Attach

      

      Toggle Script:开关

      Slider Script:滚动条

      Scroll Bar Script:浏览网页的小滚动条

      Progress Bar Script:进度条

      Popup List Script:弹出框

      Input Field Script:输入框

      Key Binding Script:键盘的绑定

      Key Navigation Script:键盘的导航

      Play Tween Script:缓动特效

      Play Animation Script:动画的播放

      Play Sound Script:声音的播放

      Localization Script:语言的支持

    (6)NGUI---->Tween

      

      Alpha:透明度

      Color:颜色

      Width:宽

      Height:高

      Position:位置

      Rotation:旋转

      Scale:缩放

      Transform

      Volume:音量大小

      Field of View:视图区域,简单的用这个,复杂的用之前的DoTween插件

    (7)NGUI---->Open

      

      Atalas Maker:图集制作,美术发来的图集,程序打包成图片合集

      Font Maker:字体工具,有系统自带的库,也可以用图形字库

      Prefab Toolbar:NGUI的预制体

      Panel Tool:面板的控制

      Draw Call Tool:调用GPU的函数的频率,和性能有关

      Camera Tool:摄像机的工具,控制所有的摄像机

      Widget Wizard:向导,和Create功能有点像,已经废弃了

    (8)NGUI---->Options:打开一些小工具

    (9)NGUI---->Extras:切换2D,3D的碰撞盒

    (10)NGUI---->Extras:Normalize Depth Hierarchy:层级关系

    (11)NGUI---->Selection:改变深度值的快捷键

    7. 界面开发流程

    UIRoot作为根节点,同一个界面通常只显示一个UI Root节点和Camera
    1)美术设计界面,提供切图,效果图给到程序
    2)用NGUI搭建静态界面
    3)将搭建好的静态界面拖到Project视图上-----形成一个预制体prefeb
    4)通过代码调用 来初始化和显示预先配置好的界面,实现界面的切换

  • 相关阅读:
    如何在Ubuntu上安装配置和使用Docker
    在Ubuntu 20.04 LTS Focal Fossa上安装Netdata Monitoring
    CG-CTF 480小时精通C++
    IDA 动态调试
    CG-CTF 签到
    CG-CTF WxyVM
    buu 达芬奇 && ROT
    buu firmware
    buu [MRCTF2020]keyboard
    buu signin
  • 原文地址:https://www.cnblogs.com/HangZhe/p/7381040.html
Copyright © 2020-2023  润新知