Unity UGUI教程:UISprite 应用方式

发表于2017-03-26
评论0 1.4k浏览
在前面几篇中都有提到如何创建 UISprite,但是关于它的说明却不多,所以本篇文章要给大家介绍的是UGUI中UISprite 的应用方式,不了解UISprite 应用的可以看一看。

首先我们先新增三个同样的图片到场景中
可以看到在预设的情况下
UISprit 中的 Type 栏位为 Simple
可以看到图片的原始解析度为 13 x 13
但我刻意将 UISprit 中的 Size 栏位调整为 256 x 256
显现出来的结果非常不理想

接下来将三个图片的 Type 依序调整为 Simple、Sliced、Tiled
我们先来看看调整为 Tiled 的情况
图片会保持原始解析度显示 ( 13 x 13 )
多馀的位置则会依序显示图片
例如:256 / 13 = 19.6923….
所以显示出来的图片会产生19.69个相同图片

而再来比较 Sliced 跟 Simple
乍看之下两者并没有什么差别
差别只在于 Sliced 图片比 Simple 大了一点
不过我们来到 Project 中找到使用的图集
选择该图片
这里可以看到在 Sprite Details 选项中
有 Dimensions、Border、Padding 三个不同的栏位
这裡的单位都是 Pixel
Dimensions:这张图片在图集中所包含的位置资料
Border:设定图片的边缘
Padding:图片的留白程度

将 Border 栏位输入适当参数后
可以发现 Border 的用处就是将边缘的 Pixel 单位固定
显示结果为
也可以试试将 UISprite 中的 Fill Center 选项取消
这种情况下图片只会显示出边缘所包含的 Pixel
使用这种方法
可以在某些限定条件下
利用解析度较小的图产生大图
以降低游戏中的记忆体用量

如社区发表内容存在侵权行为,您可以点击这里查看侵权投诉指引