關於Unity中UI中的RawImage節點以及制作地圖滾動效果


一、貼圖的Texture Type屬性類型

Texture:會把貼圖的大小轉換為最相近的2的n次方,比如400X1369會轉換為512X1024。

Sprite 2D:是貼圖的原始大小。

 

 

二、RawImage的UI節點

1.創建一個RawImage類型的UI節點,貼圖屬性是Texture,與Image是不一樣的,Image是Sprite2D類型的。

2.RawImage比Image多一個Raw Image組件,里面的UV rect屬性是比較特殊的。

3.UV rect的x,y的意思就是從貼圖的哪個地方開始顯示在Canvas中的。以左下角為(0,0),右上角為(1,1)。

如果是x,y是(0,0.5),表示從貼圖的中部(0,0.5)的坐標開始往上和往右顯示,超出的部分有兩種模式來填補,受貼圖的Wrap Mode屬性影響,Clamp表示用最后的像素填充,另一種是Repeat表示從頭開始貼,Sprite類型的只能Clamp。

4.UV rect的w,h的意思就是顯示在Canvas中的大小,以左下角為(0,0),右上角為(1,1),如果是w,h是(0.5,0.5),表示在Canvas中顯示原來貼圖的四分之一。

 

 

三、Image和RawImage區別和優勢

區別:

1.Sprite 只能用在 Image 組件上,做2D and UI;
2.Sprite可以做九宮格;
3.Sprite一般用在小圖.可以打Atlas(圖集);
4.Texture基於紋理尋址模式,不能打包Atlas;
5. UI 需要修改UV rect和用到尋址模式的,用Texture,否則用Sprite;

優勢:

1.Image有Image的優勢,Image可以九宮格拉伸。

2.RawImage有RawImage的優勢,RawImage可以UV rect貼圖的紋理尋址。

3.一般用Image,除了地圖尋址,滾動之類的,從貼圖哪個位置開始顯示。

 

 

四、RawImage應用--飛行類游戲場景的滾動效果

1.創建一個叫做sky的RawImage的UI節點。

2.把Texture類型的貼紙拖進sky節點的RawImage組件的Teture屬性中。貼圖必須是Texture類型的,不能是Sprite2D,Sprite2D會有空白。而且Wrap Mode必須是Repeat,不然會把最后一行的像素重復顯示。

2.設置sky節點的Scale,x和y都設置為1.25,覆蓋好Canvas。只有x,y相同才能不變形。

3.創建一個叫sky的腳本,掛載到sky節點下。

4.sky腳本代碼

using UnityEngine;
using System.Collections;
using UnityEngine.UI;
public class sky : MonoBehaviour {
    RawImage img;
    float speed = 0.1f;
    // Use this for initialization
    void Start () {
        this.img = this.GetComponent<RawImage>();
    }
    
    // Update is called once per frame
    void Update () {
        float s = this.speed * Time.deltaTime;
        Rect r = this.img.uvRect;
        r.y += s;
        this.img.uvRect = r;
    }
}

5.可以實現地圖的滾動

 

 

五、創建完一個Canvas后需要做的事情

1.把Canvas節點的Canvas組件的Render Mode改為Screen Space-Overlay

2.把Canvas節點的Canvas Scaler組件的UI Scale Mode改為Scale With Screen Size

3.把Canvas節點的Canvas Scaler組件的Reference Resolution改為640X960

4.把Canvas節點的Canvas Scaler組件的Match拉到Width那一邊

5.把Canvas節點的Canvas Scaler組件的Reference Pixels Per改為100

 

注意:Canvas節點的Canvas組件的Render Mode為Screen Space-Overlay時是繪制不出帶材質球的UI節點,必須換成Screen Space-Camera,並且把Main Camera拉到Canvas節點的Canvas組件的Render Camera屬性中才會顯示。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM