Unity NGUI 网络斗地主 -界面制作

源文件在群(63438968群共享!)

@灰太龙

这一节说一下NGUI的界面摆放,并且教会大家使用NGUI的自适应功能!

在这里感谢@Gamer,是他给我的一些指教和资料!

1.首先在菜单栏中选择NGUI->Open->UI Wizard,这个时候会弹出一个窗体

其中,默认的层是Default,如果是这个层的话,就会有问题!

自己试一试就知道了,在这里不阐述了!

(注解:新建Layer,在Inspector中,最后一个命令Add Layer...添加一个层,即可,名字可以任意取!)

那么会在Hierarchy视图中自动生成几个物体,截图:

UI Root(2D)为根物体,Camer为UI摄像机,

在这儿删除两个物体,

1.UI Root(2D)身上的脚本,并且将这个物体的缩放值(x,y,z)都改成1

2.删除Anchor物体!

在Camera上添加一个脚本,截图:

这个脚本随后上传,其中Screen Width和Screen Height为在Game视图中的窗口大小,(点击Game视图中的Stats按钮,可以看到当前游戏窗口的大小的),经过以上步骤的操作,控件都会是自适应的!

贴上MyCamera.cs脚本

  1 using UnityEngine;
  2 using System.Collections;
  3 using System.Collections.Generic;
  4 // <summary>
  5 /// This is used to decide how the camera rendering result to draw to screen.
  6 /// </summary>
  7 public enum Camera2DStretchMode
  8 {
  9     None,
 10     StretchFit,
 11     AspectStretchFit,
 12 }
 13 
 14 /// <summary>
 15 /// A Camera2D is a camera through which the player views the world.
 16 /// </summary>
 17 [ExecuteInEditMode]
 18 [RequireComponent(typeof(Camera))]
 19 public class MyCamera : MonoBehaviour
 20 {
 21     public static Rect cameraRect;
 22     /// <summary>
 23     /// The width of the target screen window in pixels.
 24     /// </summary>
 25     public float screenWidth = 800;
 26 
 27     /// <summary>
 28     /// The height of the target screen window in pixels.
 29     /// </summary>
 30     public float screenHeight = 600;
 31 
 32     /// <summary>
 33     /// Camera's half-size in orthographic mode
 34     /// </summary>
 35     public float orthographicSize
 36     {
 37         get
 38         {
 39             return _orthographicSize;
 40         }
 41 
 42         set
 43         {
 44             _orthographicSize = value;
 45 
 46             float aspect = (float)screenWidth / (float)screenHeight;
 47 
 48             screenHeight = 2f * _orthographicSize;
 49             screenWidth = screenHeight * aspect;
 50         }
 51     }
 52 
 53     [SerializeField]
 54     private float _orthographicSize = 300;
 55 
 56     /// <summary>
 57     /// This is used to decide how the camera rendering result to draw to screen.
 58     /// </summary>
 59     public Camera2DStretchMode stretchMode = Camera2DStretchMode.StretchFit;
 60 
 61 
 62 
 63     void Reset()
 64     {
 65 
 66     }
 67 
 68 
 69 
 70     void OnDestroy()
 71     {
 72 
 73     }
 74 
 75 
 76     private bool isOpenGL = false;
 77     void Awake()
 78     {
 79     }
 80 
 81 
 82     void resetCamera()
 83     {
 84         orthographicSize = screenHeight * 0.5f;
 85 
 86         camera.orthographic = true;
 87         camera.orthographicSize = screenHeight * 0.5f;
 88         camera.aspect = (float)screenWidth / (float)screenHeight;
 89 
 90 
 91         int mask = 1;
 92         int i = 0;
 93 
 94         float hw = screenWidth * 0.5f;
 95         float hh = screenHeight * 0.5f;
 96 
 97 
 98         if (isOpenGL)
 99             camera.projectionMatrix = Matrix4x4.Ortho(-hw, hw, -hh, hh, 0.0f, 1024f);
100         else
101         {
102             camera.projectionMatrix = Matrix4x4.Ortho(-hw + 0.5f, hw + 0.5f, -hh - 0.5f, hh - 0.5f, -0.01f, 1024f);
103         }
104 
105 
106 
107         if (Screen.width <= 0f || Screen.height <= 0f)
108             return;
109 
110 
111         if (stretchMode == Camera2DStretchMode.None)
112         {
113             camera.pixelRect = new Rect((Screen.width - screenWidth) * 0.5f, (Screen.height - screenHeight) * 0.5f, screenWidth, screenHeight);
114         }
115 
116         if (stretchMode == Camera2DStretchMode.StretchFit)
117         {
118             camera.pixelRect = new Rect(0f, 0f, Screen.width, Screen.height);
119         }
120 
121         if (stretchMode == Camera2DStretchMode.AspectStretchFit)
122         {
123             float cameraAspect = (float)screenWidth / (float)screenHeight;
124             float screenAspect = (float)Screen.width / (float)Screen.height;
125 
126             if (screenAspect >= cameraAspect)
127             {
128                 float h = Screen.height;
129                 float w = Screen.height * cameraAspect;
130                 camera.pixelRect = new Rect((Screen.width - w) * 0.5f, 0f, w, h);
131             }
132             else
133             {
134                 float w = Screen.width;
135                 float h = w * ((float)screenHeight / (float)screenWidth);
136                 camera.pixelRect = new Rect(0, (Screen.height - h) * 0.5f, w, h);
137             }
138 
139         }
140 
141         cameraRect = camera.pixelRect;
142     }
143 
144 
145     void OnPreRender()
146     {
147         resetCamera();
148 
149     }
150 
151 
152 
153     void OnEnable()
154     {
155         isOpenGL = SystemInfo.graphicsDeviceName.ToUpper().IndexOf("OPENGL") >= 0;
156         resetCamera();
157     }
158 }

View Code

现在可以添加控件了,点击NGUI->Open->Widget Tool来添加控件了,添加控件比较简单!

下一篇 NGUI的图集 Altas