unityUGUI九宫格纹理拉伸的使⽤
转载⾃注明:
本篇⽂章我们来学习下在unity new ui即UGUI九宫格纹理拉伸的使⽤，不论是游戏中的UI，还是应⽤中的UI，纹理九宫格拉伸都是必不可少的，因为采⽤这种拉伸⽅式，可以最⼤化的节省纹理资源，任意缩放图⽚还能保持⼀个不错的效果，因此在⼿游和app中⽤的较多。我们先学习下九宫格拉伸的原理先，如下图所⽰！
原理
1.
规则的图形在拉伸之后的效果是⽐较好的，如果是不规则的图形，则会在拉伸之后变形！
根据上图做拉伸制定规则：
（1）保证四个⾓1,3,9,7不做任何拉伸
（2）与四个⾓有公共边的四个矩形2,6,8,4做单向拉伸，即保证与四个⾓的公共边不拉伸，例如2,8只进⾏横向拉伸，4,6只进⾏纵向拉伸
（3）中间部分5做双向拉伸，即横向，纵向同事拉伸Array下⾯就讲讲Unity3d中使⽤ugui中如何使⽤九宫格：
选中纹理资源，点击下图中红框按钮，打开sprite编辑器：
设置sprite的边界，其中蓝⾊的为可⽤图⽚边界，绿⾊线则为九宫格的裁剪线，初始时，蓝⾊和绿⾊重叠，⿏标放在下图中绿⾊节点上即可编辑九宫格裁剪线：
unity 教程
设置好图⽚后，就可以把sprite赋值给ui，看效果去了，并将图⽚类型选择为sliced，还要记得勾上Fill Center，你可以试试不勾选看看效果：
然后你就能看到的效果：
好吧，绿⾊线条的作⽤知道了，现在就看看蓝⾊线条的作⽤吧。。
看到了吧，蓝⾊线条是对图⽚做裁剪的，当然⼀张图⽚上可以有多个裁剪图，每个裁剪图可以有⼀个九宫格。但是sprite就需要改成multiple咯。
最终，本⽂想说的其实是我⾃⼰遇到的⼀个坑。希望后来的⼈能轻松解决：
其实unity3d的九宫格⼀直都知道怎么⽤，但是突然我发现我⽤不了，操作步骤也没错，弄了⼀下午头都⼤了。结果我靠搜索技术，在这篇博客上发现了⼀点⼉蛛丝马迹然后解决了问题：
修改下⾯红⾊地⽅的参数，默认是100
各位应该是看到区别了，当canvas或者是图⽚的每单位多少像素修改后，图⽚⼤⼩显⽰⼤⼩其实是不⼀样的。如果图⽚设置为10，canvas 设置为100，那就相当于九宫格中⾮中⼼的图⽚区域⼤⼩缩放了10倍，⽽我由于测试过canvas参数，将其改为1，后来见没效果，没有改为100，结果可想⽽知，我所有九宫格在sliced模式下，只能看到九宫格中⼼区域。如果不仔细看，边缘区域根本不可见。
⾄此，我的问题解决了，相信⼤家也会使⽤unity3d中UGUI的九宫格了。
好了本篇unity3d教程到此结束，下篇我们再会！

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。