天天看點

Unity圖文混排的幾種方式

方法一:TextMesh  

- TextMesh是Unity原生的支援圖文混排的方式。  

- 使用方法  

    在GameObject下挂上TextMesh,會自動追加上MeshRender,之後在Materials裡追加對應的圖檔材質球,即可通過<quad material=1>來使用圖檔,還可以通過size、x、y、width、height來設定圖檔屬性。   

        各個屬性的含義  

        material=1 選擇的材質下标為1  

        size=20 圖像高度為20像素  

        x=0.5 y=0.7 顯示圖像的矩形區域的起點為x=0.5 y=0.7  

        width = 1 height = 0.5 顯示圖像的矩形寬度為1,高度為0.5  

- 優化空間:将所有需要圖文混排的圖檔打成一張圖集,并制作成一個統一的材質球,通過x、y、width、height去設定圖檔偏移來渲染不同的圖檔  

- 效果圖  

Unity圖文混排的幾種方式

方法二:TextMeshPro  

- TextMeshPro原本是一個第三方插件,後被Unity收購後并入Unity,現在可以免費使用,對于Unity2018及以後的版本,可以從菜單欄Window > Package Manager中安裝TextMesh Pro。

- 使用方法

    1. 将所需要的圖文混排圖檔資源的屬性設定為Sprite(2D and UI),SpriteMode設定為Multiple    

Unity圖文混排的幾種方式

    2. 打開SpriteEditor,将圖檔切割好,可通過Slice快速切割成多張圖檔,再根據所需慢慢調整  

Unity圖文混排的幾種方式

    3. 選中圖檔資源,通過Assets-Create-TextMeshPro-SpriteAsset,或者直接右鍵圖檔資源Create-TextMeshPro-SpriteAsset建立出對應的圖檔Asset  

    4. 在TextMeshPro元件中設定對應的SpriteAsset,然後通過<sprite=9>或者<sprite name="Grinning face">來渲染對應的圖檔,其中sprite=9代表Asset中的Index=9,"Grinning face"代表Asset中的Name="Grinning face"

    5. 如果遇到要使用多個圖檔Asset資源的情況,需要将圖檔Asset放在Editor-ProjectSettings-TextMeshPro-Setting裡的defaultSpriteAsset所設定的目錄下,該目錄的起始位置在Assets/TextMesh Pro/Rescources。之後使用<sprite="DefaultSprites" index=0>或者<sprite="DefaultSprites" name="Unity">來使用對應的圖檔,其中"DefaultSprites"是該圖檔Asset的名字,index=0代表Asset中的Index=0,name="Unity"代表Asset中的name="Unity"

Unity圖文混排的幾種方式

- 效果圖  

Unity圖文混排的幾種方式

方法三:Layout Group  

- Unity自帶的Layout Group的作用是讓在這個腳本Go下的子物體根據Layout Group所設定的進行自動對齊排序,這種方法不需要使用富文本,隻要設定好正确的對齊方式即可。

- 效果圖

Unity圖文混排的幾種方式