NGUI:限定圖片拉伸縮放的區域?

Tags: 圖片, 區域,

在做Unity3D開發的時候,我們經常要將控件調整成我們需要的大小,這個時候圖片會被拉伸,有些不想被拉伸的地方,比如圖片的邊緣,就會變形,這個時候,我們就要限定一下圖片的拉伸縮放區域了。

工具/原料

Unity3D

NGUI

方法/步驟

先上效果圖,沒有限定圖片拉伸縮放的區域的效果是這樣的。

NGUI:限定圖片拉伸縮放的區域

有限定圖片拉伸縮放的區域的效果是這樣的。

NGUI:限定圖片拉伸縮放的區域

打開Unity3D,並導入NGUI插件,這裡用的是NGUI3.7.4,如果需要的可以到下面的網盤下載,

NGUI:限定圖片拉伸縮放的區域

打開NGUI創建控件創建嚮導,NGUI->Open->Widget Wizard(Legacy)

NGUI:限定圖片拉伸縮放的區域

添加一個sprite到UI Root上,圖片選擇NGUI例子裡面的任意圖片

NGUI:限定圖片拉伸縮放的區域

創建成功後,在Inspector面板上找到UISprite的Sprite的Edit,如下圖:

NGUI:限定圖片拉伸縮放的區域

點擊了Edit界面,進入下面的界面,找到Border一欄,調節Left,Right,Bottom,Top。

NGUI:限定圖片拉伸縮放的區域

通過調節Left,Right,Bottom,Top的數值,改變虛線的位置,虛線以內的位置就是伸縮區域,如下圖紅色區域。

NGUI:限定圖片拉伸縮放的區域

虛線以外的區域,就是不變的區域,也就是說,無論Sprite長寬如何變,虛線以外的區域都不會被拉伸,不會變形,拉伸縮放的只是虛線以內的區域。如下圖:

NGUI:限定圖片拉伸縮放的區域

調完之後按Return to Sprite

NGUI:限定圖片拉伸縮放的區域

如果調節完之後,效果沒有出來,看看Sprite的Type是否設置成Sliced。

NGUI:限定圖片拉伸縮放的區域

是不是很簡單`(*∩_∩*)′

注意事項

記得將Sprite的Type設置成Sliced

圖片, 區域,
相關問題答案