UGUI筆記2-Image、RawImage和Text控件

Image控件是用來顯示一張圖片的,sprite類型的

一.Image的組件介紹

image.png

CanvasRenderer:負責(zé)UI元素的渲染,所有UI控件都需要一個CanvasRenderer,它繼承自Componet
SpriteRenderer(渲染sprite用的)、MeshRenderer(渲染三維物體用的)、SkinnedMeshRenderer(渲染蒙皮的物體),它們都繼承自Renderer負責(zé)渲染的

image.png

SourceImage:是你要顯示的圖片,下面的有一個對應(yīng)的Set Native Size按鈕,圖片有可能會被拉伸,按這個按鈕可以讓Image控件的寬高設(shè)置為和圖片原始的寬高一樣,
Material:材質(zhì),當(dāng)我們需要一些比較高級的效果,比如你要為這張圖片編寫自己的shader的時候,才會用到材質(zhì)
ImageType:表示圖片展示的類型,默認是Simple,就是正常顯示,對應(yīng)一個Preserve Aspect選項,意思是,是否保持比例(寬高比),在屏幕適配的時候,圖片有可能會拉伸,這時候為了不讓圖片失真,一般會勾選這個選項

  • Tiled:重復(fù)平鋪


    image.png
  • Filled:填充模式,用于制作進度條、血條、技能冷卻之類的


    image.png

    Fill Method:填充方法可以是360度,180度,90度,垂直方向,水平方向
    Fill Origin:填充起始點
    Fill Amount:填充量,它是通過圖片來填充Image控件,0的時候是沒有,1就是完整填充

  • Sliced:九宮格模式,某一個部分不想讓它縮放,因為縮放拉伸會使圖片失真,比如圖片的四個角,這個時候可以用九宮切圖,分成九個部分,只讓中間進行縮放,一般是用于背景

代碼獲取方式

1.引入命名空間
using UnityEngine.UI
2.獲取組件
Image image = GetComponent<Image>();
3.改變屬性
image.sprite = xxx;

RawImage控件

RawImage控件也是用來顯示一張圖片的,但是顯示的圖片是Texture類型的圖片.

image.png

這個控件在通過網(wǎng)絡(luò)加載圖片的時候用的比較多一點,例如:

image.png

Text控件

用于顯示文本,這個和一些應(yīng)用里面的字體差不多,沒什么好說的
Line Spacing:行距
Rich Text:是否使用富文本,就是會檢測到尖括號
Best Fit:根據(jù)Text控件的大小來顯示合適的字體大小,字體大小會受控件大小的限制,即文本會完整顯示


image.png
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 178,937評論 25 709
  • ¥開啟¥ 【iAPP實現(xiàn)進入界面執(zhí)行逐一顯】 〖2017-08-25 15:22:14〗 《//首先開一個線程,因...
    小菜c閱讀 7,319評論 0 17
  • -20170622 雨- 一場雨,沖刷著聒噪內(nèi)心中的泥濘。 我們盼望著,盼望著,仿佛置身在城市中央, 終于等到了一...
    nancyaway閱讀 243評論 3 2
  • 安裝包 http://edadownload.software.keysight.com/akdlm/downlo...
    WICKII閱讀 1,162評論 0 0
  • 印象筆記是很多人進行知識管理的重要工具,我最近也對此進行了一定的研究,特別是讀了李參老師的書,并做了筆記。要點如下...
    海哥0001閱讀 646評論 6 3

友情鏈接更多精彩內(nèi)容