Unity iOS图片格式配置与UI图像优化

unity iOS图片格式设置 unity ui image_ugui


img组件有四种基本的类型:

分别是simple,sliced,tilled,filled四种

首先我们跳过simple,直接开始sliced,按字面意思为切割,自然填充方式就是切割。

切割逻辑如下,将图片切割成九宫格,当你选中会出现两种情况:

unity iOS图片格式设置 unity ui image_unity iOS图片格式设置_02


该图片没有边界,以及:

unity iOS图片格式设置 unity ui image_unity_03


上面是状态,下面是九宫格模式,先不讲参数意义,我们先看参数变化,导致的结果,通过他来引导

fill center参数

子如起名:

unity iOS图片格式设置 unity ui image_unity_04


前面是未选,后面是选中,就是是否填充中心

pixels per unit

我将他分别设置成0.01,0.1,1,10

unity iOS图片格式设置 unity ui image_unity_05


在细看一下最后一个图片的边界发现:

unity iOS图片格式设置 unity ui image_unity iOS图片格式设置_06


因此我们可以看出他的填充方式大概就是边界分别有九宫格四角填充,普通边界由九宫格上下左右图填充,所有非边界由中间图填充

系数则表示,一种对应关系,系数越大则表示填充该img所使用的图片每快(九块)所占的比例越低,简单说就是系数越大,就会使用越多的快填充。系数大可以达到一个按钮看起来月完美的感觉。

tilled平铺,如图

unity iOS图片格式设置 unity ui image_九宫格_07


将值分别设置为1,2

unity iOS图片格式设置 unity ui image_image_08


类似就不多说了下面将最后一个filled

unity iOS图片格式设置 unity ui image_image_09


unity iOS图片格式设置 unity ui image_unity_10


unity iOS图片格式设置 unity ui image_ugui_11


看了三种情况我想你已经明白了使用下面看他的妙用与进度条

我们使用两张图片,一张做背景,一张做进度条,

unity iOS图片格式设置 unity ui image_九宫格_12


背景图片设置为普通就行了,但是进入图片设置为水平填充,通过调节fill Amount参数就可以模拟进度条了。

进度条还有很多模拟方式,例如slider组件模拟

免责声明:本文系网络转载或改编,未找到原创作者,版权归原作者所有。如涉及版权,请联系删

QR Code
微信扫一扫,欢迎咨询~

联系我们
武汉格发信息技术有限公司
湖北省武汉市经开区科技园西路6号103孵化器
电话:155-2731-8020 座机:027-59821821
邮件:tanzw@gofarlic.com
Copyright © 2023 Gofarsoft Co.,Ltd. 保留所有权利
遇到许可问题?该如何解决!?
评估许可证实际采购量? 
不清楚软件许可证使用数据? 
收到软件厂商律师函!?  
想要少购买点许可证,节省费用? 
收到软件厂商侵权通告!?  
有正版license,但许可证不够用,需要新购? 
联系方式 155-2731-8020
预留信息,一起解决您的问题
* 姓名:
* 手机:

* 公司名称:

姓名不为空

手机不正确

公司不为空