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去設置圖片偏移來渲染不同的圖片  

- 效果圖  

 

方法二:TextMeshPro  

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

- 使用方法

    1. 將所需要的圖文混排圖片資源的屬性設置爲Sprite(2D and UI),SpriteMode設置爲Multiple    

    

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

    

    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"

    

- 效果圖  

 

方法三:Layout Group  

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

- 效果圖

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章