GUI

๊ฐœ์š”

GUI๋Š” ๊ฒŒ์ž„ ๋‚ด์—์„œ ํ”Œ๋ ˆ์ด์–ด์™€ ์ƒํ˜ธ์ž‘์šฉํ•  ์ˆ˜ ์žˆ๋Š” ๊ทธ๋ž˜ํ”ฝ ์š”์†Œ๋ฅผ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค. GUI๋ฅผ ํ™œ์šฉํ•˜๋ฉด ๋ฒ„ํŠผ, ํ…์ŠคํŠธ, ์ด๋ฏธ์ง€, ์ง„ํ–‰ ๋ฐ” ๋“ฑ ๋‹ค์–‘ํ•œ ์š”์†Œ๋ฅผ ๊ฒŒ์ž„ ํ™”๋ฉด์— ์ถ”๊ฐ€ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์ข…๋ฅ˜

์˜ค๋ธŒ์ ํŠธ
์„ค๋ช…

ScreenGui

2D ๊ธฐ๋ฐ˜ ์˜ค๋ธŒ์ ํŠธ๋“ค์„ ํ™”๋ฉด์— ๋ณด์—ฌ์ฃผ๊ธฐ ์œ„ํ•œ ์˜ค๋ธŒ์ ํŠธ์ž…๋‹ˆ๋‹ค. 2D ๊ธฐ๋ฐ˜ ์˜ค๋ธŒ์ ํŠธ์ธ Frame, TextButton, ImageButton ๋“ฑ์€ ScreenGui/SurfaceGui ๋“ฑ Gui ์˜ค๋ธŒ์ ํŠธ์˜ ์ž์‹์œผ๋กœ ์กด์žฌํ•ด์•ผ๋งŒ ํ™”๋ฉด์— ํ‘œ์‹œ๋ฉ๋‹ˆ๋‹ค. ScreenGui ์ž์ฒด๋Š” ํ™”๋ฉด์— ์–ด๋– ํ•œ ์ •๋ณด๋„ ํ‘œ์‹œํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค.

SurfaceGui

Surface GUI๋Š” 3D ๊ณต๊ฐ„์—์„œ 2D UI๋ฅผ ๋ณด์—ฌ์ฃผ๊ธฐ ์œ„ํ•œ ์˜ค๋ธŒ์ ํŠธ์ž…๋‹ˆ๋‹ค. ๊ฒŒ์ž„ ๋‚ด์˜ ํ‘œ๋ฉด์ด๋‚˜ ์˜ค๋ธŒ์ ํŠธ์— GUI๋ฅผ ๋ถ™์—ฌ์„œ ์ƒํ˜ธ์ž‘์šฉ์„ ๊ฐ€๋Šฅํ•˜๊ฒŒ ํ•ฉ๋‹ˆ๋‹ค.

Frame

๋ ˆ์ด์•„์›ƒ์„ ๋””์ž์ธ ํ•˜๊ฑฐ๋‚˜ TextLabel, TextButton, ImageLabel, ImageButton ๋“ฑ์˜ ์˜ค๋ธŒ์ ํŠธ๋ฅผ ๊ทธ๋ฃนํ™”ํ•  ์ˆ˜ ์žˆ๋Š” ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•˜๋Š” 2D ๊ธฐ๋ฐ˜ ์˜ค๋ธŒ์ ํŠธ์ž…๋‹ˆ๋‹ค.

TextLabel

ํ…์ŠคํŠธ๋ฅผ ํ‘œ์‹œํ•  ์ˆ˜ ์žˆ๋Š” ์˜ค๋ธŒ์ ํŠธ์ž…๋‹ˆ๋‹ค.

ImageLabel

์ด๋ฏธ์ง€๋ฅผ ํ‘œ์‹œํ•  ์ˆ˜ ์žˆ๋Š” ์˜ค๋ธŒ์ ํŠธ์ž…๋‹ˆ๋‹ค.

TextButton

ํ…์ŠคํŠธ๋ฅผ ํ‘œ์‹œํ•  ์ˆ˜ ์žˆ๋Š” ๋ฒ„ํŠผ์ž…๋‹ˆ๋‹ค.

ImageButton

์ด๋ฏธ์ง€๋ฅผ ํ‘œ์‹œํ•  ์ˆ˜ ์žˆ๋Š” ๋ฒ„ํŠผ์ž…๋‹ˆ๋‹ค.

UIAspectRatioConstraint

2D ๊ธฐ๋ฐ˜ ์˜ค๋ธŒ์ ํŠธ๋“ค์˜ ๊ฐ€๋กœ ์„ธ๋กœ ๋น„์œจ์„ ์„ค์ •ํ•  ์ˆ˜ ์žˆ๋Š” ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•˜๋Š” ์˜ค๋ธŒ์ ํŠธ์ž…๋‹ˆ๋‹ค. Frame/ImageLabel/ImageButton/TextButton ๋“ฑ์˜ ๋น„์œจ ์„ค์ •์„ ์›ํ•  ๊ฒฝ์šฐ, ์ž์‹์œผ๋กœ UIAspectRatioConstraint๋ฅผ ๋‘๊ณ  ๋น„์œจ์„ ์ˆ˜์ •ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋ถ€๋ชจ ์˜ค๋ธŒ์ ํŠธ์˜ ํ˜„์žฌ Size๋ฅผ ๊ธฐ์ค€์œผ๋กœ ๋น„์œจ์„ ์œ ์ง€ํ•˜๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.

ScreenGui์˜ ํ”„๋กœํผํ‹ฐ

ํ”„๋กœํผํ‹ฐ
์„ค๋ช…

Enabled

ScreenGui๊ฐ€ ์ž์‹์œผ๋กœ ํ•˜๋Š” ๋ชจ๋“  ์˜ค๋ธŒ์ ํŠธ๋ฅผ ํ™”๋ฉด์—์„œ ๋ณด์—ฌ์ค„ ์ง€ ์—ฌ๋ถ€๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

SurfaceGui์˜ ํ”„๋กœํผํ‹ฐ

ํ”„๋กœํผํ‹ฐ
์„ค๋ช…

Enabled

SurfaceGui๊ฐ€ ์ž์‹์œผ๋กœ ํ•˜๋Š” ๋ชจ๋“  ์˜ค๋ธŒ์ ํŠธ๋ฅผ ํ™”๋ฉด์—์„œ ๋ณด์—ฌ์ค„ ์ง€ ์—ฌ๋ถ€๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Always on Top

๋‹ค๋ฅธ 3D ์˜ค๋ธŒ์ ํŠธ ์œ„์— ํ•ญ์ƒ SurfaceGui๊ฐ€ ๋ Œ๋”๋ง๋˜๋„๋ก ์„ค์ •ํ•ฉ๋‹ˆ๋‹ค.

Light Influence

SurfaceGUI๊ฐ€ ์กฐ๋ช…์— ์˜ํ–ฅ์„ ๋ฐ›๋Š” ์ •๋„๋ฅผ ์„ค์ •ํ•ฉ๋‹ˆ๋‹ค.

Max Distance

SurfaceGUI๊ฐ€ ํ”Œ๋ ˆ์ด์–ด๋กœ๋ถ€ํ„ฐ ๋ฉ€๋ฆฌ ๋–จ์–ด์ ธ ์žˆ์–ด๋„ ๋ณด์ผ ์ˆ˜ ์žˆ๋Š” ์ตœ๋Œ€ ๊ฑฐ๋ฆฌ๋ฅผ ์„ค์ •ํ•˜๋Š” ๋ฐ ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค.

Active

SurfaceGUI์— ํฌํ•จ๋œ ๋ฒ„ํŠผ, ํ…์ŠคํŠธ ๋ฐ•์Šค ๋“ฑ๊ณผ ๊ฐ™์€ UI ์š”์†Œ๋“ค์ด ํด๋ฆญ, ํ„ฐ์น˜ ๋˜๋Š” ํ‚ค๋ณด๋“œ ์ž…๋ ฅ์„ ์ฒ˜๋ฆฌํ•  ์ˆ˜ ์žˆ๋Š”์ง€ ์—ฌ๋ถ€๋ฅผ ๊ฒฐ์ •ํ•ฉ๋‹ˆ๋‹ค.

Adornee

SurfaceGUI๊ฐ€ ๋ Œ๋”๋ง๋˜๋Š” ์˜ค๋ธŒ์ ํŠธ๋ฅผ ์„ค์ •ํ•ฉ๋‹ˆ๋‹ค.

Face

Part์˜ ์–ด๋А ๋ฉด์— GUI๊ฐ€ ํ‘œ์‹œ๋ ์ง€๋ฅผ ์„ค์ •ํ•ฉ๋‹ˆ๋‹ค.

Gui ์š”์†Œ์˜ ํ”„๋กœํผํ‹ฐ

๊ณตํ†ต ํ”„๋กœํผํ‹ฐ

ํ”„๋กœํผํ‹ฐ
์„ค๋ช…

Position

ํ™”๋ฉด ์ƒ ์œ„์น˜๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

UDim2 ํ˜•์‹์„ ์‚ฌ์šฉํ•˜๋ฉฐ, ScaleX, OffsetX, ScaleY, OffsetY ๊ฐ’์„ ์ˆœ์„œ๋Œ€๋กœ ์ž…๋ ฅํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

  • Scale: 0.0 ~ 1.0 ์‚ฌ์ด์˜ ๋น„์œจ ๋‹จ์œ„์ด๋ฉฐ, 0.1์€ 10%๋ฅผ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค.

  • Offset: Pixel ๋‹จ์œ„์ด๋ฉฐ, 10์€ 10Pixel์„ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค.

Scale๊ณผ Offset ๊ฐ’์€ ํ•ฉ์‚ฐํ•˜์—ฌ ํ™”๋ฉด์— ํ‘œํ˜„ ๋ฉ๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด ScaleX ๊ฐ’์ด 0.25์ด๊ณ  OffsetX ๊ฐ’์ด 10์ด๋ฉด, ์„ค์ •๋œ Anchor Point(Frame์˜ ์ค‘์‹ฌ์ )์„ ๊ธฐ์ค€์œผ๋กœ ์ขŒ์ธก์œผ๋กœ๋ถ€ํ„ฐ 25% ๋งŒํผ ์šฐ์ธก์œผ๋กœ ์ด๋™ํ•˜๊ณ  OffsetX์ธ 10Pixel ๋งŒํผ ์ถ”๊ฐ€๋กœ ์šฐ์ธก์œผ๋กœ ์ด๋™ ๋ฉ๋‹ˆ๋‹ค.

Rotation

ํšŒ์ „ ๊ฐ๋„๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค. 360.0์€ 360๋„๋ฅผ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค.

Size

ํฌ๊ธฐ๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค. Position๊ณผ ๋งˆ์ฐฌ๊ฐ€์ง€๋กœ UDim2 ํ˜•์‹์„ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค.

Visible

๋ณด์ด๊ฑฐ๋‚˜ ๋ณด์ด์ง€ ์•Š๊ฒŒ ์„ค์ •ํ•˜๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Anchor Point

์ค‘์‹ฌ์ ์„ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค. Vector2 ํ˜•์‹์„ ์‚ฌ์šฉํ•˜๋ฉฐ ๊ธฐ๋ณธ๊ฐ’ 0.0, 0.0์ด๋ฉด Frame์˜ ์ขŒ์ธก ์ƒ๋‹จ์ด ์ค‘์‹ฌ์  ์ž…๋‹ˆ๋‹ค.

ZIndex

UI ์š”์†Œ์˜ ์Šคํƒ ์ˆœ์„œ๋ฅผ ์ •์˜ํ•˜๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค. FrameA๊ฐ€ FrameB์™€ ์œ„์น˜ ์ƒ FrameB์— ๊ฐ€๋ ค์ง€๋Š” ๊ฒฝ์šฐ ZIndex ๊ฐ’์— ๋”ฐ๋ผ FrameB ๋ณด๋‹ค ์œ„์— FrameA๊ฐ€ ๋ณด์ด๋„๋ก ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Frame

ํ”„๋กœํผํ‹ฐ
์„ค๋ช…

Border Pixel Size

Frame์˜ ํ…Œ๋‘๋ฆฌ ๋‘๊ป˜๋ฅผ ์„ค์ •ํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Border Mode

ํ…Œ๋‘๋ฆฌ๋ฅผ Frame์˜ ๊ฐ€์žฅ์ž๋ฆฌ ๊ธฐ์ค€์œผ๋กœ insert(์•ˆ์ชฝ)/middle(์ค‘์•™)/Outline(๋ฐ”๊นฅ์ชฝ) ์ค‘ ์–ด๋А ๊ธฐ์ค€์œผ๋กœ ๋ณด์—ฌ์ค„ ์ง€ ์„ค์ •ํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Border Color 3

ํ…Œ๋‘๋ฆฌ ์ƒ‰์„ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Background Color 3

Frame์˜ ๋ฐฐ๊ฒฝ ์ƒ‰์„ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Background Trnasparency

Frame์˜ ๋ฐฐ๊ฒฝ ํˆฌ๋ช…๋„๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

TextLabel

ํ”„๋กœํผํ‹ฐ
์„ค๋ช…

Text

๋ณด์—ฌ์ค„ ํ…์ŠคํŠธ๋ฅผ ์ž…๋ ฅํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

TextScaled

๋ณด์—ฌ์ค„ ํ…์ŠคํŠธ์˜ ํฌ๊ธฐ๋ฅผ Text Size ๊ฐ’์„ ๋ฌด์‹œํ•˜๊ณ  ์˜ค๋ธŒ์ ํŠธ์˜ Size ๊ฐ’์— ๋งž๊ฒŒ ์ž๋™์œผ๋กœ ๋ณ€ํ™”ํ•  ์ˆ˜ ์žˆ๋„๋ก ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•˜๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Bold

๋ณด์—ฌ์ค„ ํ…์ŠคํŠธ์˜ ๋‘๊ป˜๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Text Size

๋ณด์—ฌ์ค„ ํ…์ŠคํŠธ์˜ ํฌ๊ธฐ๋ฅผ Pixel ๋‹จ์œ„๋กœ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Text Color 3

๋ณด์—ฌ์ค„ ํ…์ŠคํŠธ์˜ ์ƒ‰์ƒ์„ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Text Transparency

๋ณด์—ฌ์ค„ ํ…์ŠคํŠธ์˜ ํˆฌ๋ช…๋„๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Background Color 3

๋ฐฐ๊ฒฝ ์ƒ‰์„ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Background Transparency

๋ฐฐ๊ฒฝ ํˆฌ๋ช…๋„๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

ImageLabel

ํ”„๋กœํผํ‹ฐ
์„ค๋ช…

Image

์ด๋ฏธ์ง€๋ฅผ ๋ณด์—ฌ์ฃผ๊ธฐ ์œ„ํ•œ AssetId๋ฅผ ์ž…๋ ฅํ•˜๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค. Asset Manager ๋˜๋Š” Asset Drawer์— ๋“ฑ๋ก๋œ ์ด๋ฏธ์ง€์˜ AssetId ๊ฐ’์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Image Transparency

์ด๋ฏธ์ง€์˜ ํˆฌ๋ช…๋„๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Background Color 3

๋ฐฐ๊ฒฝ ์ƒ‰์„ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Background Transparency

๋ฐฐ๊ฒฝ ํˆฌ๋ช…๋„๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

TextButton

ํ”„๋กœํผํ‹ฐ
์„ค๋ช…

Text

๋ณด์—ฌ์ค„ ํ…์ŠคํŠธ๋ฅผ ์ž…๋ ฅํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

TextScaled

๋ณด์—ฌ์ค„ ํ…์ŠคํŠธ์˜ ํฌ๊ธฐ๋ฅผ Text Size ๊ฐ’์„ ๋ฌด์‹œํ•˜๊ณ  ์˜ค๋ธŒ์ ํŠธ์˜ Size ๊ฐ’์— ๋งž๊ฒŒ ์ž๋™์œผ๋กœ ๋ณ€ํ™”ํ•  ์ˆ˜ ์žˆ๋„๋ก ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•˜๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Bold

๋ณด์—ฌ์ค„ ํ…์ŠคํŠธ์˜ ๋‘๊ป˜๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Text Size

๋ณด์—ฌ์ค„ ํ…์ŠคํŠธ์˜ ํฌ๊ธฐ๋ฅผ Pixel ๋‹จ์œ„๋กœ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Text Color 3

๋ณด์—ฌ์ค„ ํ…์ŠคํŠธ์˜ ์ƒ‰์ƒ์„ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Text Transparency

๋ณด์—ฌ์ค„ ํ…์ŠคํŠธ์˜ ํˆฌ๋ช…๋„๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Background Color 3

๋ฐฐ๊ฒฝ ์ƒ‰์„ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Background Transparency

๋ฐฐ๊ฒฝ ํˆฌ๋ช…๋„๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

ImageButton

ํ”„๋กœํผํ‹ฐ
์„ค๋ช…

Image

์ด๋ฏธ์ง€๋ฅผ ๋ณด์—ฌ์ฃผ๊ธฐ ์œ„ํ•œ AssetId๋ฅผ ์ž…๋ ฅํ•˜๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค. Asset Manager ๋˜๋Š” Asset Drawer์— ๋“ฑ๋ก๋œ ์ด๋ฏธ์ง€์˜ AssetId ๊ฐ’์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Image Transparency

์ด๋ฏธ์ง€์˜ ํˆฌ๋ช…๋„๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Background Color 3

๋ฐฐ๊ฒฝ ์ƒ‰์„ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

Background Transparency

๋ฐฐ๊ฒฝ ํˆฌ๋ช…๋„๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ ์ž…๋‹ˆ๋‹ค.

UIAspectRatioConstraint

ImageLabel์˜ Size๊ฐ€ { 0.5, 0, 0.5, 0 }์œผ๋กœ X์ถ•๊ณผ Y์ถ• ๋ชจ๋‘ ํด๋ผ์ด์–ธํŠธ ๊ธฐ๊ธฐ์˜ 50% ํฌ๊ธฐ๋กœ ์„ค์ •๋˜์–ด ์žˆ์„ ๋•Œ, UIAspetRatioConstraint๋ฅผ ์ž์‹์œผ๋กœ ๋‘๊ณ  Aspect Ratio ์†์„ฑ์„ 1.0์œผ๋กœ ์„ค์ •ํ•˜๋ฉด ImageLabel์˜ Size์— 1:1 ๋น„์œจ์ด ์ ์šฉ๋˜์–ด ์ขŒ์šฐ ๋˜๋Š” ์ƒํ•˜๋กœ ์ด๋ฏธ์ง€๊ฐ€ ๋Š˜์–ด๋‚˜์ง€ ์•Š๋„๋ก ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

ํ”„๋กœํผํ‹ฐ
์„ค๋ช…

Aspect Ratio

๋ถ€๋ชจ ์˜ค๋ธŒ์ ํŠธ์— ๋Œ€ํ•ด ๋ณด์—ฌ์ฃผ๊ณ  ์‹ถ์€ ๋น„์œจ์„ ์„ค์ •ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๊ธฐ๋ณธ๊ฐ’์€ 1.0์ด๋ฉฐ, x, y๊ฐ€ ๊ฐ๊ฐ 1:1 ๋น„์œจ์„ ๊ฐ–์Šต๋‹ˆ๋‹ค.

Aspect Type

UI ์š”์†Œ์˜ ๋น„์œจ์„ ์–ด๋–ป๊ฒŒ ์œ ์ง€ํ• ์ง€๋ฅผ ๊ฒฐ์ •ํ•˜๋Š” ์†์„ฑ์ž…๋‹ˆ๋‹ค.

  • FitWithinMaxSize : UI ์š”์†Œ๊ฐ€ ์ตœ๋Œ€ ํฌ๊ธฐ ๋‚ด์—์„œ ๋น„์œจ์„ ์œ ์ง€ํ•˜๋ฉฐ ์ถ•์†Œ๋จ

  • ScaleWithParentSize : ๋ถ€๋ชจ UI ์š”์†Œ์˜ ํฌ๊ธฐ์— ๋งž์ถฐ ๋น„์œจ์„ ์œ ์ง€ํ•˜๋ฉฐ ์กฐ์ •๋จ

  • SizeRelativeXY : X, Y ๋ฐฉํ–ฅ ๋ชจ๋‘ ์ƒ๋Œ€์ ์ธ ํฌ๊ธฐ๋ฅผ ์œ ์ง€ํ•จ

Dominant Axis

UI์˜ ํฌ๊ธฐ๊ฐ€ ๋ณ€๊ฒฝ๋  ๋•Œ ์–ด๋А ์ถ•์„ ๊ธฐ์ค€์œผ๋กœ ๋น„์œจ์„ ์œ ์ง€ํ• ์ง€๋ฅผ ๊ฒฐ์ •ํ•ฉ๋‹ˆ๋‹ค.

  • Width : ๊ฐ€๋กœ ๊ธฐ์ค€์œผ๋กœ ๋†’์ด ์กฐ์ •

  • Height : ์„ธ๋กœ ๊ธฐ์ค€์œผ๋กœ ๋„ˆ๋น„ ์กฐ์ •

Last updated