马上注册,加入CGJOY,让你轻松玩转CGJOY。
您需要 登录 才可以下载或查看,没有帐号?立即注册
×
本帖最后由 笑虾 于 2015-8-23 20:01 编辑
本文由笨笨翻译于2015-08-23 这是官网的帮助内容。仅介绍PSD2NGUI不对U3D、NGUI做过多说明。本人能力有限,如翻译有错误或不妥望海涵。 简介感谢您使用 PSD2NGUI PSD2NGUI 是一款能将PSD文件中的图层自动转换成NGUI 控件的工具。你只要在PSD图层名后简单的加上 label, editbox, button, checkbox, scrollview 等命令就可以快捷的创建NGUI 控件。另外当用户编辑过PSD文件后,它还能直接更新到 Unitiy3D中。一旦你开始使用PSD2NGUI就再也用不着Atlas Maker, Widget, Font tool这些东西了。你只要在PSD图层名后面添加一个 Slice 命令,拼UI和切图的活就可以交给系统来帮你搞定了。总之使用PSD2NGUI能为你节省出大量时间,从而把精力专注在GUI的功能开发上 。 重要提示:支持的NGUI版本(2.2.7 ~ 3.0.2)。(笨笨提示:如果你是旧版看下面的说明。如果你是更新的NGUI去U3D商店看看PSD2NGUI支持到哪了) 注意:使用PSD2NGUI并不需要Photoshop程序本身。(笨笨提示:只要有PSD文件就够了) 注意:PSD2NGUI支持Photoshop 的“智能对象图层”,“栅格图层”,“文字层”。 (笨笨提示:我的环境Unity3d 4.5.5,NGUI是2.6.1d,PSCC的文字层不支持。新版本应该没问题。另外用老版本时安装PSD2NGUI可能出现各种报错,要自已手动修一下。我这个版本安装完PSD2NGUI v2.3在它的根目录下会出现个v.1.2.5的版本,同时有个Read ME First的说明文件。里面说如果你用的是 NGUI 2.2.7~2.7.0之间的版本请导入PSD2NGUI v1.2.5 。双击导一下就行了。) 使用方法打开 Open
a.你可以在PSD文件上右键点击打开PSD2NGUI。
b.你可以从NGUI菜单,打开PSD2NGUI。
添加PSD文件 Add PSD filea.在PSD图层上添加命令。 (笨笨提示:这些就是添加到PSD图层中的命令,详情看下面的 命令 COMMAND) 运行 Runa.点击运行按钮“RUN”执行转换。
菜单简介 About MenuLoad 加载加载 PSD2NGUI 设置。(笨笨提示:如果你之前有存过的话) Delete 删除 删除 PSD2NGUI 设置。 Save 保存 保存 PSD2NGUI 设置。 Run 运行将“图层”转换成“NGUI”控件。 NGUI Root NGUI根节点 当你点击“RUN”进行转的时,如果场景中已有NGUI Root就会自动把东西放进去。如果没有就会自动创建一个。 Camera 摄像机设置 NGUI摄像机类型。 Target Screen Size 目标屏幕尺寸设置游戏分辨率。 Add Font 创建字体(笨笨提示:有的版本显示 Font Type)创建位图字体。 Font Data 字体数据指定位图字体的索引文件。(笨笨提示:制作位图字体的时候会生成一张PNG图版和一个TXT文本文件) Font Texture 字体贴图指定位图字体的文字贴图。 Font Prefab 字体预设指定NGUI字体文件的位置。 如果你不设置[Font Data] 和 [Font Texture] 是不会创建字体的。你要可以直接指定已有字体给它。 你也可以先设置[Font Data] 和 [Font Texture] 再指定一个已有的字体,来更新已有字体。 Assign Font To All Labels 设置所有文本标签的字体上面设置的Font Prefab并不会改变项目中已设置过字体的UILabel。如果你想替换所有UILabel的设置,请手动点击Assign Font To All Labels。 Remove Font To All Labels 移除所有UILabel的字体设置将NGUI节点下所有UILabel的字体设置移除。 Use One Atlas 只使用一个图集将所有图片打包在同一个图集中。如果取消勾选,将为每个PSD文件分别创建图集。 Keep Old Sprites 保留原有图片如果取消勾选,旧的图片将会被删除。 Create Controls 创建控件如果取消勾选,将只创建图集和字体。不会生成NGUI控件。 Remove All 移除全部从列表中移除所有PSD文件。并不会删除硬盘上的文件。 Add Font All 全都创建字体在分别为每个PSD创建图集时,都检查字体设置。 Add Font None 全都不创建字体在分别为每个PSD创建图集时,不逐个检查字体设置。
视频 VIDEO基本操作 Basic Manual. http://www.youtube.com/embed/6b3M7-Xqh7k 官方的视频是放在墙外的 命令 COMMAND*附加参数ub commands:用于在创建abel, Button,ComboBox等控件时进行附加的设置。这是可选项,不加也无妨。(下面介绍附加参数时 :+后面的文字 是说明部分) (笨笨提示:PSD2NGUI 的工作方式就是通过对PSD文件的图层名称进行判断,然后做相应处理。所以在PSD的图层名中加入下面这些命令,系统就能知道这个图层应该被创建为何种控件。基本格式是这样的: 图层名@控件类型= 或 . 附加参数 ayerName@command=sub command 下面每个控件名后列出了对应的命令,不包括括号 ) Sprite 精灵图片 命令: layerName 如果图层名称中不添加任何命令,PSD2NGUI将为图层创建同名的UISprite控件。 Slice 九宫格 命令: layerName@slice=(左上)x(右上)x(左下)x(右下) 此命令用于创建UISprite控件,Type为Sliced。UISprite大小等于图层在PSD中的尺寸。 如果你将图层名设置为这样: topBG@slice=2x2 PSD2NGUI将从图层的左上、右上、左下、右下各取2像素生成一张4x4的图片命名为topBG@slice。 如果你将图层名设置为这样: topBG@slice=50%x50%x10%x10% PSD2NGUI将会自动将百分比换算成像素再执行上面的操作。 如果4个角的值都一样,可以简写成这样: topBG@slice=2 Panel 面板 命令: groupName@panel 此命令用于创建UIPanel。在PSD文件的组(文件夹)的名称后面添加@panel Label 文本控件命令: layerName@label 此命令用于创建UILabel。请在文字层的名称后添加@label (其实不写也行,因为PSD2NGUI能识别文字层) 附加参数 Sub commands. (设置多个参数时使用相同的图层名即可) layerName@label@color=ff00ff : 将文字颜色设为紫色 sameLayerName@label@color=black : 将文字颜色设为黑色(建议还是像上面那样写颜色值) sameLayerName@label@bold=true : 设为加粗 sameLayerName@label@shadow=true : 添加阴影 sameLayerName@label@text=Hello PSD2NGUI : 显示的文本内容(笨笨提示:其实我测试是木效果,文字层的内容是啥U3D里就显示啥,根本不鸟这个参数 -_-||| 不知道是不是版本问题) sameLayerName@label@align=[topleft, top, topright, left, center, right, bottomleft, bottom, bottomright] : 设置文本的对齐方式 【新】sameLayerName@label@fontsize=14 : 设置字号(笨笨提示:测试的结果发现与PS中的字号显示不一至,不过大小看上去没什么问题) Button 按钮 命令: layerName@button 此命令用于创建UIButton。请在图层名称后添加@button 如果添加了诸如button.hover 或button.pressed 这类附加参数。PSD2NGUI将创建UIImageButton。 附加参数 Sub commands. LabelButton 文本按钮命令: textLayer@button 此命令用于创建一个只有文字部分的按钮。请在文字层名称后添加@button Toggle(ChcekBox) 开关按钮(复选框) 命令: layerName@toggle, layerName@checkbox 此命令用于创建UIToggle(UICheckBox)。请在图层名称后添加@toggle(@checkbox) 附加参数 Sub commands. sameLayerName@toggle(checkbox).checked : 开启状态(选中状态) Input(EditBox) 输入框 (可编辑文本) 命令: textLayer@input, textLayer@editbox 此命令用于创建UIEditBox。请在文字层名称后添加@input(@editbox) Password 密码输入框 命令: layerName@password PSD2NGUI will make UIEditBox and switch Password option on. 想要PSD2NGUI创建UIEditBox并且Password选择为on。请在文字层名称后添加@password ComboBox 组合框 命令: layerName@combobox 此命令用于创建UIComboBox。请在图层名称后添加@combobox 附加参数 Sub commands. Slider 滑动条 命令: layerName@hslider or layerName@vslider 此命令用于创建UISlider。请在图层名称后添加@hslider或@vslider 附加参数 Sub commands. sameLayerName@h(或 v)slider.fg : 滑动条的前景图 ProgressBar 进度条 命令: layerName@hprogressbar or layerName@vprogressbar 此命令用于创建UISlider(Progress Bar)。请在图层名称后添加@hprogressbar或@vprogressbar 附加参数 Sub commands. sameLayerName@h(或 v)progressbar.fg : 进度条的前景图 ScrollBar 滚动条 命令: layerName@hscrollbar or layerName@vscrollbar 此命令用于创建UIScrollBar。请在图层名称后添加@hscrollbar或@vscrollbar 附加参数 Sub commands. sameLayerName@h(或 v)scrollbar.fg : 滚动条的前景图 ScrollView 滚动视图 命令: layerName@scrollview 此命令用于创建UIDraggablePanel 和UIDragPanelContents。请在图层名称后添加@scrollview 附加参数 Sub commands. sameLayerName@h(或 v)scrollbar.bg : 滚动视图的背景图 sameLayerName@h(或 v)scrollbar.fg : 滚动视图的前景图 VirtualView 虚拟视图 命令: layerName@virtualview 此命令用于创建PsdLayerVirtualView。它与ScrollView的不同之处在于将UI与数据分离,大量数据时便于处理。 附加参数 Sub commands. sameLayerName@h(或 v)scrollbar.bg : 虚拟视图的滚动条背景图 sameLayerName@h(或 v)scrollbar.fg : 虚拟视图的滚动条前景图
SpriteFont 美术字 命令: groupName@spritefont Animation 动画 命令: groupName@animation@fps=30 or groupName@ani@fps=15 此命令用于创建简单的精灵动画。 Collider 碰撞框 命令: layerName@collider=box 此命令只创建碰撞框(热区)BoxCollider。 Script 脚本 命令: layerName@script 此命令会让PSD2NGUI 在UILabel上挂一个PsdLayerUserScript脚本。它有一个成员变量Data,你可以将文字层中的文本内容作为参数传给它。 Ignore 忽略 命令: layerName@ignore 如果想忽略某个图层不做任何处理。请在图层名后加上@ignore
补上官方视频百度盘 链接: http://pan.baidu.com/s/1c0k9qdM 密码: 258h
另外附上PDF版本带目录,与帖子内容完全一样。只是排版过方便阅读和收藏
补充内容 (2016-8-22 18:17):
插件分享到这里:链接: http://pan.baidu.com/s/1slgqbW5 密码: 6ea4 |