巧用九宫格以减少UI资源量

UI资源量对资源包大小和内存的影响

  UI资源具有以下特点:

    (1)UI资源几乎都是图片,而图片是最占资源量的资源类型之一。

    (2)Unity不支持外部压缩,即使在外部将一个10MB的图片压缩到只剩1MB,导入引擎之后它也会被解压出来变成10MB,然后转换为各平台特有的格式。

    (3)UI资源一般都贴着相机视窗显示在最上层,也是游戏中人机交互的重要部分,一般需要保证高质量,所以一般都使用RGB32位色(真彩色),这会让资源量更大。

    (4)UI资源一般涉及大量图标、背景框等,如果要保证高分辨率,它们将会导致资源量很大。

  而且因为UI资源几乎都是以图集形式展现,所以在加载的时候,它会被整个一块儿加载进内容,如果不优化好UI医院两,会增大内存的开销。

什么是九宫格UI

  九宫格,顾名思义,就是9个格子,这9个格子并不要求一定要相同大小,是一种做UI常见的方式,来增强UI资源的复用性并减少资源量。九宫格的主要目的是处理图片拉伸效果,因为图片一旦被拉伸,他就会出现形变、模糊等问题,但是,有的图片它的某一些部分又是允许被拉伸的。例如,一个UI背景框,它的中间部分几乎是一个纯色,允许被拉伸(纯色被拉伸不会发生质量问题),但是,边缘的4个角可能有一些特殊花纹或则倒角不允许被任意拉伸,这个时候即可以用九宫格,来使4个角不进行拉伸放大,只让中间部分进行拉伸放大,达到一个小框拉大成一个大背景框使用的同时图片质量又不会发生损伤的目的。

如何让美术提供合适的九宫格UI资源

  让美术尽量地提供九宫格资源,主要有以下一些原则:

    (1)不到万不得已的情况下,对于大面积地板性质的UI,尽量只在4个角上做文章,其他地方用可用于拉伸的纯色。

    (2)凡是左右可以缩短的UI、上下可以缩短的UI,都尽量使用九宫格切短了交给程序来做。九宫格不一定是9个格子,也可以是3个格子等。

如何在NGUI中划分九宫格

  当美术将一个资源图片合并成一个非常精简小巧的图片交给客户端程序后,客户端程序需要对这个图片进行切割九宫格。切割方法为如下。

    (1)将这个UI原件制作到图集中去。

    (2)选中图集的Atlas预设文件,在Inspector界面。

    (3)在Sprite Details中单击Sprite按钮,会弹出这个图集中所有精灵的预览图,从中选中要切割九宫格的那个Sprite。

    (4)调整Border设置项,这个Border就是切割九宫格所需要的设置。它一共需要设置4个参数:Left、Right、Bottom、Top,这4个项代表着:从左边朝右X像素位置处划一条竖着的线,从右边朝左X像素位置处划一条竖着的线,从下边朝上X像素处划一条横着的线,从上边朝下X像素处划一条横着的线。这样4条线就将一个Sprite切成了九宫格。

如何使用九宫格UI

  使用九宫格UI的时候,必须保证这个Sprite是已经切好了九宫格。然后创建这个Sprite,将它的模式设置为Sliced即可。

  Fill Center选项是自动拉伸九宫中的中心格子来充满中心被拉大的区域,如果不勾选Fill Center选项,则九宫格被拉伸之后,中心格子不会自动充满,会出现一个空隙。

  也可以将图片设置为Advance高级模式,高级模式的本质区别是,允许对划分的九宫格的每一块设置一个Type,比如左上角的格子平铺、中心各自拉伸等。

去掉Mipmap以进一步降低资源包大小和内存占用

  在Unity中,MipMap纹理图片的一个属性,有开启和关闭两种状态。比如说一张1024*1024的纹理图片,在导入引擎之后它的默认状态下MipMap是开启状态的,这会导致它会自动生成512*512、256*256、128*128、64*64、32*32的这么多张额外的图片。主要用途是,当这个纹理离摄像机足够远时(例如一个人跑到了很远的地方去),这个纹理图片在游戏摄像机中就会很小,这个时候为了节省性能和达到更好的显示效果,Unity会自动选用之前自动生成的众多MipMap小纹理中的一张来替代最初的纹理。

  NGUI生成的UI图集也是一张纹理图片,它的默认状态下也是选中了MipMap的,但是,UI是附着在摄像机视窗最上层的,几乎不会存在像人物一样跑到很远的地方去的情况。所以,可以选中UI图集的图片文件,在图片类型红选择Advance高级类型,然后取消掉MipMap的选项,再Apply应用保存即可。

时间: 2025-01-02 14:31:05

巧用九宫格以减少UI资源量的相关文章

巧用Drawable 实现Android UI 元素间距效果

源文地址: 巧用Drawable 实现Android UI 元素间距效果 在大部分的移动UI或者Web UI都是基于网格概念而设计的.这种网格一般都是有一些对其的方块组成.然后它们组合成为一个块. 使用网格这种设计原则能够有助于对齐UI元素,提升UI的一致性,同一时候还能让用户更加easy的获取UI上面包括的内容. 简而言之.网格是一个相当的强大的设计工具. 开发人员在使用网格设计原则的时候须要在UI 元素之间加入一些额外的间距,比方padding.margin或者spacing(依据你的设计方

PHP中巧用curl 并发减少获取第三方网页内容时间

前言: 在我们平时的程序中难免出现同时访问几个接口的情况,平时我们用curl进行访问的时候,一般都是单个.顺序访问,假如有3个接口,每个接口耗时500毫秒那么我们三个接口就要花费1500毫秒了,这个问题太头疼了严重影响了页面访问速度,有没有可能并发访问来提高速度呢?今天就简单的说一下,利用curl并发来提高页面访问速度, 希望大家多指导. 1.老的curl访问方式以及耗时统计 <?php function curl_fetch($url, $timeout=3){ $ch = curl_init

Android界面编程——Android高级UI组件(三)

Android界面编程 Android高级UI组件 2.4.1适配器组件 适配器的作用 适配器充当适配器控件和该视图数据之间的桥梁.适配器提供访问的数据项,并负责产生数据组中的每个项的视图. 常用的适配器 BaseAdapter:抽象类,具有较高的灵活性. ArrayAdapter:最为简单,智能展示一行文字. SimpleAdapter:有较好的扩充性,可以自定义出各种效果. SimpleCursorAdapter:主要用于操作数据库. 常用的适配器控制 适配器控件扩展自ViewAdapter

如何提高UI自动化测试的质量

背景 项目是基于Ruby on Rails开发的web程序,应该说项目中的测试实践是很好的,具有高覆盖率的单元测试以及比较合理的集成测试.存在的问题是,所有的单元测试和集成测试都是针对后端代码的,前端的JavaSript代码没有单元测试(这个是有历史原因的,暂时没法改变).这也就意味着针对前端UI的修改是没有底层的单元测试来保障的,只能依靠高层级的UI自动化测试和手工测试来保障. 我们最近刚刚完成了一个story,是纯前端的开发工作,结果在上线后发现我们在修改页面模板文件时,忘记了其他地方也在使

游戏UI框架设计(三) : 窗体的层级管理

游戏UI框架设计(三) ---窗体的层级管理 UI框架中UI窗体的"层级管理",最核心的问题是如何进行窗体的显示管理.窗体(预设)的显示我们前面定义了三种类型: 普通.隐藏其他.反向切换.代码如下: "普通显示"模式允许多个窗体同时显示,这种类型应用最多.例如RPG中的主城界面(见下图). "隐藏其他界面" 模式一般应用于全局性的窗体.我们在开发此类窗体时,为了减少UI渲染压力.提高Unity渲染效率,则设置被覆盖的窗体为"不可见&qu

Cocos2d-JS项目之四:UI界面的优化

测试环境: iphone4.iOS6.1.2.chrome 37.2062.60,Cocos2d-js 3.6 我知道,iPhone4已经是要被淘汰的东西了~~这样才能测出效果嘛.PS:pc上浏览器看到的效果和手机浏览器看到的效果差距很大,不仅仅是帧率~~还有渲染的节点数! 首先,手机浏览器上性能还是比较,怎么说呢,相对pc来说或者相对本地app来说还是差一大截吧,没有任何逻辑处理,纯粹加一点UI,帧数就开始掉了...所以UI的数量要尽量的少. 其次,button是个很坑的东西.不知道是我的用法

深入探讨ui框架

深入探讨前端UI框架 1 前言 先说说这篇文章的由来 最近看riot的源码,发现它很像angular的dirty check,每个component ( tag )都保存一个expressions数组,更新时,遍历expressions数组,重新求值,对比旧值,如果有变更则更新DOM. 这不就是dirty check吗?为什么riot还声称它实现了virtual DOM? 疑惑之下,就去复盘了一下各大前端框架,把一些收获分享给大家 本文内容很多,实在不知道怎么取标题,最终取了一个泛泛的标题,请读

给你一个全自动的屏幕适配方案(基于SW方案)!—— 解放你和UI的双手

Calces系列相关文章:Calces自动实现Android组件化模块构建 前言 屏幕适配一直是移动端开发热议的问题,但是适配方案往往在实际开发的时候会和UI提供的设计稿冲突.本文主要是基于官方推荐的配置限定符方案(Smallest Width目前Android屏幕适配的最优方案)来实现一个接近完美的屏幕适配方案. 对于完美的适配方案笔者是这样定义的: 能完美适配UI稿. 适配完毕后,在高清设备上不会出现模糊的现象. 尽量减少对项目的侵入性. 下面我会从屏幕适配的一些基础知识入手,向你慢慢展现一

怎样给你的Android 安装文件(APK)瘦身

本文源地址:怎样给你的Android 安装文件(APK)瘦身 Android的apk文件越来越大了这已经是一个不争的事实. 在Android 还是最初版本号的时候,一个app的apk文件大小也还仅仅有2 MB左右,到了如今.一个app的apk文件大小已经升级到10MB到20MB这个范围了.apk文件大小的爆炸式增长主要是由于用户对app质量的期待越来越高以及开发人员的开发经验增长,详细体如今下面几个方面: Android设备 dpi 的多样化 ([l|m|tv|h|x|xx|xxx]dpi) A