UGUI 技术点札记 (干货走起) - 移动开发当前位置:& &&&UGUI 技术点札记 (干货走起)UGUI 技术点札记 (干货走起)&&网友分享于：&&浏览：0次UGUI 技术点笔记 (干货走起)如果不太熟悉UGUI的同学，请补充一下UGUI教程，这里就不一一说明了.NGUI &与 UGUI 区分:// -------------------------------------------------打包图集: (为了优化图集，我们可以选择把带透明通道图片 和 不带透明通道的图片分开打图集，这样可以减少内存的占用量)NGUI:在打包图集的时候图集的默认格式是RGBA32，也就是支持带透明通道的图片，这样一张1024的图集也就是4M内存。(然而着一切的一切在NGUI上都需要手动操作)UGUI:SpritePacker则全自动完成。Sprite上的Packing Tag 同一标识的图片UGUI会把相同图片格式的图片打包成同一图集。// -----------------------------------------------------打包模式:DefaultPackerPolicy：是默认的打包方式，也是矩形打包方式。他会把所有的小图按照矩形的方式来排列，如果宽高不一样的图片，它们会自动补起。(unity所推荐)TightPackerPolicy：是紧密打包方式，也就是尽可能的把图片都打包在图集上，这种方式要比DefaultPackerPolicy打包的图片更多一些，也就是更省空间。Packing Tag: [TIGHT]Atals //&TightPackerPolicyPacking Tag: [RECT]Atals & //&DefaultPackerPolicy// -----------------------------------------------------UI和3D场景同时都需要响应触摸事件:方案1:射线过滤方法;方案2: UGUI 提供方法(缺点在android无效,unity bug 之后可能会解决)if&(Input.GetMouseButtonDown(0)&){Debug.Log(EventSystem.current.gameObject.name);if&(EventSystem.current.IsPointerOverGameObject())Debug.Log(&当前触摸在UI上&);else&Debug.Log(&当前没有触摸在UI上&);}方案3: 修改测试通过: ( 解决方案2问题 )#if&!(UNITY_IPHONE&||&UNITY_ANDROID&||&UNITY_WP8&||&UNITY_BLACKBERRY&)&&&&&&&&&&&&if&(Input.touchCount&&&0&&&&Input.GetTouch&(0).phase&==&TouchPhase.Began)&{&&&&&&&&&&&&&&&&if&(!EventSystem.current.IsPointerOverGameObject&(Input.GetTouch&(0).fingerId))&{&&&&&&&&&&&&&&&&&&&&//Handle&Touch&&&&&&&&&&&&&&&&&&&&debugText&=&&Debug&INFO:&UI&YES&;&&&&&&&&&&&&&&&&&&&&Debug.Log(&UI&YES&);&&&&&&&&&&&&&&&&}&&&&&&&&&&&&&&&&else&&&&&&&&&&&&&&&&&{&&&&&&&&&&&&&&&&&&&&debugText&=&&Debug&INFO:&UI&NO&;&&&&&&&&&&&&&&&&&&&&Debug.Log(&UI&NO&);&&&&&&&&&&&&&&&&}&&&&&&&&&&&&}#else&&&&&&&&&&&&if&(EventSystem.current.IsPointerOverGameObject())&&&&&&&&&&&&{&&&&&&&&&&&&&&&&debugText&=&&Debug&INFO:&UI&YES&;&&&&&&&&&&&&&&&&Debug.Log(&UI&NO&);&&&&&&&&&&&&}&&&&&&&&&&&&else&&&&&&&&&&&&{&&&&&&&&&&&&&&&&debugText&=&&Debug&INFO:&UI&NO&;&&&&&&&&&&&&&&&&Debug.Log(&UI&YES&);&&&&&&&&&&&&}#endif/ -----------------------------------------------------NGUI与UGUI的动画部分:NGUI:UITUGUI:可以使用dotween或者LeanT/ -----------------------------------------------------自动布局:NGUI: 缺失,需要自己实现;UGUI: 官方支持,unity的LayoutGroup分为三种， Horizontal Layout Group（水平布局）Vertical Layout Group（垂直布局）Grid Layout Group （网格布局）;布局脚本: Layout Element (Script)脚本;// -----------------------------------------------------UGUI放大图片部分:rectTransform.sizeDelta&=&new&Vector2(Screen.width,Screen.height);void&Start(){int&width&=&Screen.width;int&height&=&Screen.height;int&designWidth&=&960;//开发时分辨率宽int&designHeight&=&640;//开发时分辨率高float&s1&=&(float)designWidth&/&(float)designHeight;float&s2&=&(float)width&/&(float)height;if(s1&&&s2)&{designWidth&=&(int)Mathf.FloorToInt(designHeight *&s2);}&else&if(s1&&&s2)&{designHeight&=&(int)Mathf.FloorToInt(designWidth&/&s2);}float&contentScale&=&(float)designWidth/(float)width;RectTransform&rectTransform&=&this.transform&as&RectTransform;if(rectTransform&!=&null){rectTransform.sizeDelta&=&new&Vector2(designWidth,designHeight);}}// -----------------------------------------------------获取UI在Canvas下的2D坐标:3d坐标:&transform.postion2d坐标:&rectTransform.anchoredPositionpublic&Canvas&canvas;&void&Start(){Vector2&pos;if(RectTransformUtility.ScreenPointToLocalPointInRectangle(canvas.transform&as&RectTransform,&transform.position,&canvas.camera,&out&pos)){Debug.Log(pos);}&}代码就是用UI元素的世界坐标和canvas的RectTrasform再加上UI摄像机，换算出元素在Canvas的2D坐标。最后在想需要赋值的UI 用&rectTransform.anchoredPosition ＝ pos 就可以了// -----------------------------------------------------两张图片局部遮挡的事件相应问题:(如果一个按钮有一半的区域被Image挡住，那么被挡住的按钮区域的点击事件就会被拦截掉。解决这个问题有两个方法。)加個UGUI內建的CanvasGroup組件, 把Interactable和Blocks Raycasts選項取消。(不会增加多余dc)// -----------------------------------------------------Sprite Packer压缩规则 图集分配错误:(u3d bug).bug: 一张1024的rgba32图片被莫名其妙分切成2张图;图集打包部分分类:大致3类1.带透明通道2.不带透明通道3.手动设置的格式// -----------------------------------------------------UGUI 字体组件加阴影特效:.解决方案在Text组件下增加component中的UI/EFFECTS/Shadow (Script);// -----------------------------------------------------UGUI 字体组件加富文本:&color=#00ffffff&&// 颜色&size=50&largely&/size& //字体&&i&usually&/i& // 斜体&&b&not&/b& //粗体sample:&size=30&Some&color=yellow&RICH&/color& text&/size&// -----------------------------------------------------UGUI&设置半透明遮罩与3d模型显示在ui前方做法：游戏中设置3个相机分别是.mainCamera: 主透视相机 &&&&&&&&&&&&&&&&&&&&&遮罩: 取消ui与要显示的层 &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&depth:-1;.ForwardUICamera: 跟随视相机透视&& &&&&&遮罩: 只渲染要显示在最前方的层（ForwardUICamera）& &&& && depth:10.UICamera: 跟随UGUI正交相机&&&&&&&&&&&&& & 遮罩: 只渲染UI层&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&depth:0游戏中层级普通游戏层:.Default:0.TransparentFx:1.Ignore Raycast:2....:3.Water:4.UI:5....:6....:7LayerGround:8LayerFloor:9LayerMapObject:10最前方层:.定义一个显示比ui高的层:FORWORD_UI ：20;逻辑处理当需要显示在base前方的模型或者特效方法:.激活ForwardUIC.调整现实对象的layer进入ForwardUICamera渲染区域;.使用后，设置原先的游戏对象还原到之前的layer层级;// -----------------------------------------------------UGUI 事件处理:public&class&HLEventTriggerListener&:&EventTrigger{&&&&public&delegate&void&VoidDelegate&(GameObject&sender);&&&&public&VoidDelegate&onClick;&&&&public&VoidDelegate&onDown;&&&&public&VoidDelegate&onEnter;&&&&public&VoidDelegate&onExit;&&&&public&VoidDelegate&onUp;&&&&public&VoidDelegate&onSelect;&&&&public&VoidDelegate&onUpdateSelect;&&&&&&&&static&public&HLEventTriggerListener&AddEeventListener&(GameObject&sender)&&&&{&&&&&&&&HLEventTriggerListener&listener&=&sender.GetComponent&HLEventTriggerListener&();&&&&&&&&if&(listener&==&null)&&&&&&&&&&&&listener&=&sender.AddComponent&HLEventTriggerListener&();&&&&&&&&return&listener;&&&&}&&&&public&override&void&OnPointerClick(PointerEventData&eventData)&&&&{&&&&&&&&if(onClick&!=&null)&&&&&&&&&&&&onClick(gameObject);&&&&}&&&&public&override&void&OnPointerDown&(PointerEventData&eventData){&&&&&&&&if(onDown&!=&null)&&&&&&&&&&&&onDown(gameObject);&&&&}&&&&public&override&void&OnPointerEnter&(PointerEventData&eventData){&&&&&&&&if(onEnter&!=&null)&&&&&&&&&&&&onEnter(gameObject);&&&&}&&&&public&override&void&OnPointerExit&(PointerEventData&eventData){&&&&&&&&if(onExit&!=&null)&&&&&&&&&&&&onExit(gameObject);&&&&}&&&&public&override&void&OnPointerUp&(PointerEventData&eventData){&&&&&&&&if(onUp&!=&null)&&&&&&&&&&&&onUp(gameObject);&&&&}&&&&public&override&void&OnSelect&(BaseEventData&eventData){&&&&&&&&if(onSelect&!=&null)&&&&&&&&&&&&onSelect(gameObject);&&&&}&&&&public&override&void&OnUpdateSelected&(BaseEventData&eventData){&&&&&&&&if(onUpdateSelect&!=&null)&&&&&&&&&&&&onUpdateSelect(gameObject);&&&&}}Sample:void Start(){ HLEventTriggerListener.AddEeventListener(this.gameObject).onClick&=&OnButtonClick; public&void&OnButtonClick(GameObject&sender) {
Debug.Log(sender.name); }}// -----------------------------------------------------UGUI 自适应问题:(这里我使用的方案与NGUI的双相机类同)设置一下参数即可;// -----------------------------------------------------随后继续补充,ugui征服ngui指日可待了;
12345678910
12345678910
12345678910 上一篇：下一篇：文章评论相关解决方案 1234567891011 Copyright & &&版权所有scroll down for more
Brand Canvas
Brands don’t fail because they choose the wrong course, but instead because they lose relevance or become stagnant due to the inability to imagine a new course. So how can you revitalize a stagnant brand and correct the course? Brand Canvas(TM): our proprietary design methodology. Brand Canvas(TM) is a dynamic and immersive collaboration of creative juices including design, photography and culinary arts, and it’s our answer to dreaming up a new course of brand possibilities.
Consider this: there are more than 30,000 items in an average supermarket – and 42,000 new products entering the market each year. Brands that lack the ability to achieve a memorable and iconic presentation will be lost in a sea of similarity. Most are doomed to failure because no one notices them.
Traditionally, food presentation is resolved during the last stage of the design process: final photography. However, most final photography is not immersive, curious or investigative, which are all crucial pieces to the finality of brand design. Countless hours and funds have been sacrificed for stock images and design development around a generic and unrealistic product presentation. This waste of resources, which results in generic food presentation development, is the root of the problem. Your brand should be unique and the last thing it needs is to look like everyone else in the marketplace.
Brand Canvas(TM) has shifted this paradigm. We start by investigating the product as a major point of difference. What are its unique attributes? How can we convey the product or brand’s story? How can we put emotion into presentation? This level of creative thinking leads to a powerful product presentation.
Brand Canvas(TM) involves photography, design, strategy and prop and food styling. Each discipline brings artistry and a unique lens to the category and product. There is a special kind of magic that happens when you dream and innovate on set. This magic results in a range of design solutions with unique product imagery that is strategically provocative and highly differentiated at the shelf.
We believe that Brand Canvas(TM) is the future of brand exploration because it is an antidote to shelf clutter. Over the past five years we have perfected this technique to create memorable, breakthrough results. Whether you’re working on a new brand or revitalizing an old one, Brand Canvas(TM) is the compass that sets you on the right course.}