NGUI 九宫格

我对九宫格的理解:九宫格是将一张图分为9个部分,在拉伸的时候针对这9个部分进行不同的拉伸处理。

《NGUI 九宫格》

                      图1-1 九宫格 – 说明

如图1-1 所示,顶点1、3、7、9所在的位置在拉伸时不会受到任何影响,2、8位置将进行水平拉伸,4、6位置会进行垂直 

拉伸,5位置是正常拉伸。
NGUI的Sprite自带了九宫格的处理,使用起来也很方便~~

《NGUI 九宫格》

                     图1-2 九宫格 – 编辑Sprite

如图1-2所示,点击“Edit”编辑精灵就可以看到编辑界面。

《NGUI 九宫格》

                                             图1-3 九宫格 – 调整Border

如图1-3所示,调整Border就可以划分九宫格了,点击“Return to Sprite Sliced”回到刚刚的界面。NGUI 
对Sprite提供了4种不同的处理方式,通过Sprite Type进行选择。

默认的Simple模式就是正常的拉伸;Sliced是切片模式,就是九宫格的应用,各个位置变化如上面图1-1所示; 
Tiled是平铺模式,将中心区域的图片进行平铺,如果Border设置为0,就是将整个图片进行平铺;Filled是填充 
模式,通过0~1的变化值来更改图片的显示,适用于制作血条或进度条等。

《NGUI 九宫格》

                                                                                               图1-4 九宫格 – 图片显示模式

各个模式示意图如图1-4所示。

    原文作者:九宫格问题
    原文地址: https://blog.csdn.net/luyuncsd123/article/details/17993463
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞