·來源于唐老獅的視頻教學,僅作記錄和感悟記錄,方便日后復習或者查找
一.導入TextMeshPro
對于新創建的工程,可以直接在這里導入TMP必要的資源(上面),以及TMP的實例和擴展(下面)
導入之后如果要更新版本,可以去PackageManager中搜索,可以更新的話右上角會有一個更新的按鈕的(我這里已經點擊更新到最新版本了,所以沒有了)
二.UI文本控件
在層級窗口中右鍵UI中可以直接找到TMP文本控件并創建,它本身和老的Text控件很像,都是用來顯示文本的控件
1.參數設置
1.1.文本輸入與字體設置
- Text Input:輸入什么文本,控件上就會顯示什么文本
- Enable RTL Editor:輸入的文本會反向顯示出來(本來從左到右,勾選之后顯示順序是從右到左)
- Text Style:選擇文本提前在樣式表中設定好的樣式
- Font Asset:字體資源。選用不同的字體資源能夠讓控件顯示的文本樣式和字符范圍不同
- Material Preset:字體的材質
- Font Style:B調節字符加粗,I斜體,U下劃線,S刪除線,ab全部小寫,AB全部大寫,SC大寫文本但是以實際輸入的字母大小顯示
- Font Size:字體大小
- Auto Size:根據文本框大小自動調節字體大小。下方可以調節最大最小字體
1.2.文本顏色設置
- Vertex Color:頂點顏色。看成是字體顏色就好了
- Color Gradient:勾選后會給字體添加顏色漸變效果
- Color Preset:顏色漸變的預設
- Color? Mode:
Single和頂點顏色疊加,Horizontal Gradient橫向漸變,Vertical縱向漸變,Four Corners?Gradient四角漸變
- Override Tags:是否忽略富文本標簽設定的顏色(一般不用勾選)
1.3.文本布局設置
Spaceing Options(em):字符間隔設置
- Character:單個字符之間的間距
- Word:每個單詞之間的間距(空格來判斷是否為單詞)
- Line:每行之間的間隔(包含自動換行)
- Paragraph:每個段落的間隔(不包含自動換行,以回車來判斷)
Alignment:對齊方式
- 左/中/右對對齊;左平齊(增加單詞和字符之間的間距填滿每一行 最后一行不會拉伸
/同上,最后一行會拉伸
),以網格居中對齊
- 頂部 /中部/底部對齊,基線對齊/中線對齊/卡普賴恩對齊(使第一行中間與 顯示區域的中間對齊)
1.4.文本自動換行與溢出設置
Warpping:決定是否啟動自動換行
Overflow:對于溢出的字符如何處理
- Overflow/Masking/:不管,就讓他溢出了
- Ellipsis:溢出的地方標記省略號
- Truncate:直接截斷
- Scroll Rect:滾動矩形 此選項僅用于與較舊的 TextMesh Pro 項目兼容。對于新項目,請改用遮罩模式
- Page:翻頁模式
。注意要搭配自動換行來使用。
- Link:連接其他文本控件以顯示溢出的內容。
1.5.UV映射調整設置
Horizontal Mapping: 水平映射
Vertical Mapping: 垂直映射
Line Offset: 設置為 線段、段落、匹配模式時,會出現該參數 用于控制偏移位置
1.6.其他額外參數
- Margins:頁邊。設定當前文本和文本框四周的間隔距離
- Geometry Sorting:幾何排序。
Normal就是離攝像機近先渲染,Reverse就是離攝像機遠先渲染
- Is Scale Static:告訴TMP文本系統該文本不會發生縮放相關變化 TMP會跳過與縮放相關的計算,從而減少CPU和GPU的負擔,提升性能
- Rich Text:是否支持富文本
- Raycast Target:是否會被點擊
- Maskable:是否會被遮罩
- Parse Escape Characters:是否使用轉義字符
- Visible Descender:可見下降 使用腳本緩慢顯示文本時,啟用該選項 啟用它可現實底部文本,并在顯示新行時向上移動 需要把垂直對齊改為Bottom下部對齊
- Sprite Asset:Sprite 資源 允許文本中嵌入精靈2D圖片,用于處理圖文混排時很重要 比如嵌入表情符號等等
- Style Sheet Asset:管理和應用文本樣式,使文本格式更加高效和統一 TMP_Style Sheet文件可以定義多種文本樣式,并在多個文本組件中重復使用,確保一致性
- Kerning:自動調整字符間距,提高文本可讀性和美感
- Extra Padding:額外填充 為文本的邊界添加額外填充,避免文本與邊界過于靠近,提升視覺效果
2.腳本控制
2.1.腳本獲取UI文本控件
1.需要引用TMP命名空間 TMPPro
2.TMP UI組件名為 TextMeshProUGUI
2.2.TMP常用的屬性
//1.文本內容//text;tmpUIText.text = "123123adfasdklf545454564654654646454564654132156465424";//2.字體//font//tmpUIText.font//3.字體大小//fontSize//tmpUIText.fontSize = 10;//4.顏色//colortmpUIText.color = Color.black;//5.對齊方式//alignmenttmpUIText.alignment = TextAlignmentOptions.Center;//6.行間距//lineSpacingtmpUIText.lineSpacing = 50;//7.是否啟用富文本//richText;tmpUIText.richText = false;
2.3.TMP常用的方法
//1.設置文本內容,支持富文本格式//SetText("<color=blue>Hello, World!</color>");tmpUIText.SetText("123123123123123");//2.強制重新構建文本網格,通常在文本內容或樣式更改后使用// Prelayout 布局前調用// Layout 布局時調用// PostLayout 布局后調用// PreRender 渲染前調用// LatePreRender 渲染后調用// MaxUpdateValue 最后調用//Rebuild(UnityEngine.UI.CanvasUpdate.LatePreRender);tmpUIText.Rebuild(UnityEngine.UI.CanvasUpdate.Prelayout);//3.強制更新文本網格,運行時動態更改文本時//ForceMeshUpdate();tmpUIText.ForceMeshUpdate();//4.獲取文本中字符數//text.Length;print(tmpUIText.text.Length);
2.4.事件監聽
通過添加Event Trigger組件后,選擇對應要監聽的事件,并提供相應的函數即可
具體關于Event Trigger怎么使用可以回顧之前的筆記:UGUI學習--進階--EventTrigger事件觸發器與RectTransformUtility
2.5.更多API
https://docs.unity3d.com/Packages/com.unity.textmeshpro@4.0/api/TMPro.TextMeshProUGUI.html
去官方手冊中查看
三.3D文本控件
3D文本控件和UI文本控件差不多,只是它是可以當成是一個被渲染顯示在場景上的3D物體,而不是一個UI。
可以在層級視圖中右鍵后在3D Object中找到并創建出來
3D文本和UI文本的區別
1.組件不同
- ?3D:TextMeshPro
- ?UI:TextMeshProUGUI
2.用途不同
- 3D:主要用于在3D場景中顯示文字
- UI:主要用于在UI中顯示文字,具備UI相關的一些屬性
3.渲染方式
- 3D:直接渲染在場景上
- UI:通過UGUI的Canvas系統渲染
4.交互方式
- 3D:一般通關添加碰撞器進行碰撞檢測判斷交互
- UI:一般利用UI系統的交互規則,比如EventTrigger
如何選擇?
- 文本需要與3D場景交互需要在3D場景上顯示,選擇3D文本 TextMeshPro, 就把他當成3D物體處理即可
- 文本需要在UI系統中使用,選擇 TextMeshProUGUI, 把它當成UI組件使用即可
參數和腳本控制與UI文本控件差不多的
更多API可以去官網看:https://docs.unity3d.com/Packages/com.unity.textmeshpro@4.0/api/TMPro.TextMeshPro.html
四.字體資源相關
1.創建一個字體資源
我們可以去電腦上隨便找一個字體(后綴為 .ttf 或 .otf 格式的文件),拖入到工程中
一般拖進來之后,我們放置在這個文件夾下面
選中字體,右鍵后按如圖點擊即可創建一個對應的字體資源了
創建好的字體資源,我們一般移動到這個文件夾下面
2.字體資源的參數設置
2.0.字體資源生成窗口
如果需要用到的字符已經提前知道并固定了,就可以用這種。或者有的藝術字需要專門用一個資源
- Sources Font File:用于生成資源的字體
- Sampling Point Size:采樣點大小 設置用于生成字體紋理的字體大小(以磅為單位)
- Padding:生成的紋理中字符的間距(一般不用改它)
- Packing Method:包裝方式 如何在字體紋理中調整字體布局
- Atlas Resolution:圖集分辨率 如果只有ASCII字符,用512*512即可。 中文字體時,需要更大更多的圖集。(比如1024*1024)
- Character Set:字符集 確定想要生成字體紋理的字符集
- Select Font Asset:選擇對應的字體資源
- Character Sequence:當選擇需要自己輸入字體的的相關模式時,會出現
- Render Mode:渲染模式
(一般用SDF效果是最好的,SMOOTH其次,位圖渲染最差)
- Get Kerning Pairs:用于在字體資源中獲取字偶間距調整(Kerning)對。字偶間距調整是指根據相鄰字符的組合來調整它們之間的間距,以實現更好的視覺效果和可讀性
- Generate Font Atlas:生成字體圖集
- Save:保存圖集
- Save as...:另存為
2.1.基礎信息設置
Scale:縮放 對字體進行縮放,1為原始大小,不縮放
Line Height:行高。表示每行文本的高度,通常是基于最大字形的高度計算的
Ascent Line: 上升線 字形中最高的點到基線的垂直距離。表示子母中最高部分(大寫字母或某字符的上部)的位置 控制字形可以延伸到基線上方的最大距離。 它對應了線條的頂部
Cap Line:大寫字母線 表示所有大寫字母的頂部所處的水平線,通常略低于上升線 控制基線與大寫字形頂部之間的距離
Mean Line:中線 表示小寫字母的頂部所處的水平線,表示小寫字母的標準高度 圓角字形的頂部有時會略高于中線
BaseLine:基線 所有字母字符所處的水平線,大多數字符都在這條線的上方,除了下延字符(g、y、q等) 控制基線的高度 基線是字符所在的水平線
Descent Line:下行線 字形中最低的點到基線的垂直距離,表示子母中最低部分的水平線(比如字母 g 的底部) 控制字形可以延伸到基線以下的最大距離
Underline Offset:下劃線偏移 下劃線相對基線的位置
Underline Thickness:下劃線粗細 控制下劃線的粗細
Strikethrough Offset:刪除線偏移 控制刪除線相對于基線的位置
Superscript Offset:上標偏移量 使上標文本相對基線偏移
Superscript Size:上標大小 相對于正常字體大小縮放上標文本
Subscript Offset:下表偏移量 是下表文本相對基線偏移
Subscript Size:下表大小 相對于正常字體大小縮放下表文本
Tab Width:指定TAB字符的寬度
2.2.生成設置 和 圖集紋理
主要用來設置字體資源使用的紋理是動態生成的還是靜態生成的
Source Font File: 字體文件
Atlas Population Mode: 紋理圖集生成方式
Atlas Render Mode:字體渲染模式(和之前在資源生成窗口中的差不多,不記得了可以劃上去看)
Sampling Point Size:采樣點大小 設置用于生成字體紋理的字體大小(以磅為單位)(動態生成的時候有用)
Padding:填充 指定字體紋理中字符之間的間距(以像素為單位) 填充越大,過渡越平滑。
Atlas Width:圖集寬
Atlas Height:圖集高
Multi Atlas Textures:是否采用多圖紋理 允許在字體資源中生成多個紋理圖集(Atlas),而不僅僅是一個。這樣可以更靈活地管理不同字符集或不同字體樣式 提高性能和內存使用效率,尤其是在需要渲染大量不同字符的情況下建議使用
Clear Dynamic Data On Build: 在構建時清除動態生成的數據 這意味著如果你選擇了動態字體模式,構建時會移除不再需要的動態字符數據,以節省內存 可以減少最終構建包的大小,確保只包含必要的字符數據
Font Atlas:生成字符資源時創建的字體紋理圖集
Font Material:生成字體資源時創建的字體材質
2.3.字體粗細
Normal Weight:正常粗細 沒有字體資源用時使用的常規字體粗細
Bold Weight:粗體粗細 沒有字體資源用時使用的粗體字體粗細
Spacing Offset:間距偏移 使用普通文本樣式時,在字符之間的間隙偏移
Bold Spacing:粗體間隙 沒有指定粗體資源時,粗體文本字符之間的間距偏移
ltalic Style:斜體樣式 400 - Regular > Italic Style 變體指定字體資源沒有設置時 TMP將使用常規樣式字體資源中的字符傾斜該字段中的量來達到斜體效果
Tab Multiple:多制表符 該值乘以字體空格符的寬度,用來表示制表符的大小
2.4.其他設置
備用字體資源:
可以創建相應文本資源的變體,從而在里面提供更多的字符。
Fallback List: 列出所有備用字體資產。 當主字體中缺少某些字符時,系統會按順序嘗試使用這些備用字體進行查找
Character Table 字符表:
如果有需要某個字符特殊的偏移間隔效果,可以來這里找到并給他單獨設置
Glyph Table: 字形表:
和字符表作用差不多其實。這里還可以設置每個字符的采樣位置。
- X、Y、W、H:字符在紋理中對應的位置范圍
- W、H:字形的寬高
- BX、BY:相對基線的左上角位置(X方向,Y方向)
- AD:和下一個字符間隔的寬
- Scale:縮放大小
- Atlas Index:圖集索引 在第幾個圖集中(開啟了多圖集時)
Glyph Adjustment Table: 字形調整表
字形調整表控制特定字符對之間的間距
- Adjustment Pair Search:調整對搜索
- Char 左和右:想要查找的字符
- ID 左和右:唯一標識符,一般顯示左右字符的ASCII十進制編碼
- OX 左和右:字符原點坐標X
- OY 左和右:字符原點坐標Y
- AX 左和右:字符的寬度
- Add New Glyph Adjustment Record: 添加新的字形調整記錄
五.富文本標簽
#region 知識點三 常用富文本標簽
//1.換行<br>//2.文本加粗<b></b>//3.文本斜體<i></i>//4.加下劃線<u></u>//5.改變大小<size=數值></size>//6.改變顏色<color=#RGBA 16進制></color>//7.對齊方式<align=left、center、right、justified、flush></align>//8.背景高亮<mark=#RGBA 16進制></mark>//9.透明度<alpha=#A 16進制>//10.全部大寫<allcaps></allcaps>//11.改字體和材質(可選)<font="字體名" material="材質名"></font>//12.加上標(平方)<sup></sup>//13.加下標(化學式)<sub></sub>//14.超鏈接<link="鏈接"></link>
#endregion
更多的富文本標簽可以去手冊查看:https://docs.unity3d.com/Packages/com.unity.textmeshpro@4.0/manual/RichTextSupportedTags.html
六.總結
①TextMeshPro是比老Text控件渲染更加清晰,功能更加強大豐富的上位替代。我們需要手動導入與更新這它的相關文件
②TextMeshPro的UI控件可以調節多種顏色和字體,以及布局設置,還有文本在溢出時候如何處理。
③TextMeshPro的3D文本控件的參數和UI文本控件差不多,只是渲染,交互方式有所不同。
④我們可以將一個字體拖入工程后為他生成相應的字體資源以給TMP使用。如果提前知道了所有可能的字符,用靜態的比較好。否則用動態的,動態的能夠根據我們輸入的字符,動態生成沒有的字符到紋理中。
⑤TMP中同樣可以使用富文本標簽進行編輯