Unity3d界面设计教程.ppt

Unity3d界面设计教程 --------- (NGUI、DaiKon) by:邪让多杰 教程简介 初级 中级 高级 基础控件与操作 实战:制作一套完整的游戏界面 ? 声明 道理谁都懂，凡夫谈资，学者运用。 -----《多杰语录》 - 这是一个免费教程,谨防受骗上当。 - 教程中所含插件，软件，都是和我的朋友借的，如有版权问题，请联系朋友，与作者无关。 - 限于作者水平，教程中错误以及遗漏之处，有本事你来打我啊！ 本教程使用软件： 屏幕录像专家 Unity3d游戏引擎 DaiKonGUI插件 NGUI插件 v4.0 WPS套装 Windows8系统 土豪外星人M18x 基佬一个 初级 Atlas 与 Font Panel 与 Label Button 其他控件 Tween Atlas 与 Font Atlas ---- 图集 将多张零散的图片融合成为一张图，低碳环保。 Font ---- 字体 动态字体 DF-GUI公开版本并没有动态字体，可以和作者要。 使用标准的字体文件(.TTF)，能屈能伸份量大。 图集字体 将字体弄到图片里，根据坐标静态调用。好处可以使用各种效果，以及聊天表情。 基础控件 Panel ----- 面板 运行在窗口中的面板，用于组织界面元素。 每一个Panel，都会让层从0开始。 DaiKon Panel 常规面板 Scroll Panel 滚动面板 Tab Container 选项卡面板 Ngui Panel 常规面板 常规 静态 切割 选项卡要玩家单独实现 基础控件 Label ----- 文本栏 用于显示文本信息，特殊功能： DaiKon 颜色：[color #ffffff] 内容 [/color] 图片: [sprit 图片名称] 渐变：可以在属性栏里设置渐变 阴影 描边 Ngui 颜色： [FF0000] 内容 [-] (没有[-]时，作用域为之后的所有文本。 图片：需要自定义输入内容。 阴影 轮廓 基础控件 Button ----- 按钮 用来接收玩家的功能操作的控件： DaiKon Button自身集成了图片，文字 Ngui 旧版本采用消息机制，新版本使用了委托的方式 普通button 图片button 基础控件 其他控件快速演示 拖拽控制器 only Daikon 选择框 列表框 进度条 大小控制器 only Daikon 富文本 only Daikon 滚动条 滑块 输入框 基础控件 Tween 组件 在两个值之间随时间进行渐变，用于实现一些伴随时间的效果。 比如：淡入，淡出，移动，旋转，放大缩小等。 DF-GUI Tweens NGUI ITween 教程简介 初级 中级 高级 基础操作 实战:制作一套完整的游戏界面 ? 声明 - 这是一个免费教程,谨防受骗上当。 - 教程中所含插件，软件，都是和我的朋友借的，如有版权问题，请联系朋友，与作者无关。 - 限于作者水平，教程中错误以及遗漏之处，有本事你来打我啊！ 本教程使用软件： 屏幕录像专家 Unity3d游戏引擎 DaiKonGUI插件 NGUI插件 v4.0 WPS套装 Windows8系统 土豪外星人M18x 基佬一个 过程的愉悦必定带来美好的结果。享受过程尤为重要。 -----《多杰语录》 中级 制作前的准备 开始动手 总结 准备 我们要做什么？ 一个游戏界面 它包含什么？ 登录 人物选择界面 加载 技能栏 任务栏 信息栏 装备栏 背包 活动信息栏 商店，功能店，任务对话框 剧情对话框 准备 有哪些可用的元素？ 文本 按钮 选择框 输入框 下拉选框 进度条，滑块 滚动条 面板 如何将这些面板组合成我们想要的？ 在使用NGUI 和 DF-GUI时，分别要注意什么？ NGUI ： 多个物体可以属于同一层。层一定要弄好，不能混乱。 DF-GUI： 层是独立的。在一个Panel下，一个层只对应一个控件 both: 对齐方式一定要设定好，否则大乱 准备 总体结构 NGUI 统一的层管理，我们约定。基础背景0~1层。一级面板在2层。面板元素3~6层 二级面板7~10层 。不能超过3级面板。 所有的界面做成在一次。统一调度。 好处：快速响应，结构清晰 坏处：内存消耗，开发麻烦 Daikon-GUI 只用保持好面板层次关系就好。同样不能超过3级面板。 同一Panel下，一个层只能有一个控件 人物选择界面 角色列表面板 从外部获取数据，通过预制体，显示信息。 （动