๐Ÿ“˜TIL-Selection Multi ๊ตฌ์กฐ ํ™•์žฅ ๋ฐ Command ๊ต์ง‘ํ•ฉ ์ฒ˜๋ฆฌ ๊ตฌํ˜„

HappyCircleยท2026๋…„ 4์›” 3์ผ

Unreal ๊ฐœ๋ฐœ

๋ชฉ๋ก ๋ณด๊ธฐ
100/163

๋ฌธ์ œ

DataTable ๊ธฐ๋ฐ˜ ๊ตฌ์กฐ๋กœ UI ์•„ํ‚คํ…์ฒ˜๋ฅผ ์ •๋ฆฌํ•œ ์ดํ›„,
๊ธฐ๋ณธ์ ์ธ Single Selection๊ณผ CommandPanel ๋™์ž‘์€ ์•ˆ์ •์ ์œผ๋กœ ๋™์ž‘ํ–ˆ์ง€๋งŒ
๋‹ค์Œ๊ณผ ๊ฐ™์€ ํ•œ๊ณ„๊ฐ€ ๋‚จ์•„ ์žˆ์—ˆ๋‹ค.


๊ตฌ์กฐ์  ๋ฌธ์ œ

๊ตฌ๋ถ„๋ฌธ์ œ
SelectionPanel๋‹จ์ผ ์„ ํƒ ๊ธฐ์ค€์œผ๋กœ๋งŒ ์„ค๊ณ„๋˜์–ด ๋‹ค์ค‘ ์„ ํƒ ํ‘œํ˜„ ๋ถˆ๊ฐ€
Multi Selection์„ ํƒ๋œ ์œ ๋‹› ๋ชฉ๋ก์„ ํ‘œํ˜„ํ•  ๊ตฌ์กฐ ์—†์Œ
CommandPanel๋‹ค์ค‘ ์„ ํƒ ์‹œ ์–ด๋–ค ์ปค๋งจ๋“œ๋ฅผ ๋ณด์—ฌ์ค„์ง€ ๊ธฐ์ค€ ๋ถ€์žฌ
UI ์ƒํƒœNone / Single / Multi ์ƒํƒœ ๊ตฌ๋ถ„ ์—†์Œ
ํ‘œํ˜„ ๋ฐฉ์‹๋‹ค์ค‘ ์„ ํƒ ์‹œ ๋‹จ์ˆœ ํ…์ŠคํŠธ ๋‚˜์—ด ์ˆ˜์ค€

๊ธฐ์กด ์ƒํƒœ

Selection
โ†’ ViewModel (Single ๊ธฐ์ค€)
โ†’ SelectionPanel ์ถœ๋ ฅ

์ด ๊ตฌ์กฐ์—์„œ๋Š”:

  • ๋‹ค์ค‘ ์„ ํƒ ์‹œ ์ •๋ณด ํ‘œํ˜„ ๋ถˆ๊ฐ€
  • CommandPanel์€ ๋‹จ์ผ ๊ธฐ์ค€์œผ๋กœ๋งŒ ๋™์ž‘
  • RTS UI์—์„œ ํ•„์ˆ˜์ ์ธ ๊ทธ๋ฃน ์„ ํƒ UX ๋ถ€์žฌ

๋ถ„์„

๋ฌธ์ œ์˜ ํ•ต์‹ฌ์€ ๋‹ค์Œ ๋‘ ๊ฐ€์ง€์˜€๋‹ค.


1. Selection ์ƒํƒœ๊ฐ€ ๋‹จ์ผ ๊ธฐ์ค€์œผ๋กœ ๊ณ ์ •๋˜์–ด ์žˆ์Œ

๊ธฐ์กด ๊ตฌ์กฐ์—์„œ๋Š” Selection์ด ํ•ญ์ƒ ํ•˜๋‚˜์˜ ์—”ํ‹ฐํ‹ฐ ๊ธฐ์ค€์œผ๋กœ ์ฒ˜๋ฆฌ๋˜์—ˆ๋‹ค.

SelectionId
โ†’ DisplayName
โ†’ TypeLabel
โ†’ HP

ํ•˜์ง€๋งŒ ์‹ค์ œ RTS์—์„œ๋Š”:

๋‹จ์ผ ์„ ํƒ โ†’ ์ƒ์„ธ ์ •๋ณด
๋‹ค์ค‘ ์„ ํƒ โ†’ ์š”์•ฝ ์ •๋ณด + ๊ทธ๋ฃน ์ƒํƒœ

์ฆ‰, Selection ์ž์ฒด์˜ ์ƒํƒœ ๋ชจ๋ธ์ด ๋ถ€์กฑํ•œ ์ƒํ™ฉ์ด์—ˆ๋‹ค.


2. ๋‹ค์ค‘ ์„ ํƒ ์‹œ Command ๊ธฐ์ค€์ด ์ •์˜๋˜์ง€ ์•Š์Œ

๋‹ค์ค‘ ์„ ํƒ์—์„œ ๊ฐ€์žฅ ์ค‘์š”ํ•œ ๊ฒƒ์€:

์„ ํƒ๋œ ๋ชจ๋“  ์œ ๋‹›์ด ๊ณตํ†ต์œผ๋กœ ์ˆ˜ํ–‰ ๊ฐ€๋Šฅํ•œ ํ–‰๋™๋งŒ ํ‘œ์‹œ

ํ•˜์ง€๋งŒ ๊ธฐ์กด ๊ตฌ์กฐ์—์„œ๋Š”:

  • ๋‹จ์ผ Command ๋ชฉ๋ก๋งŒ ์กด์žฌ
  • ๋‹ค์ค‘ ์„ ํƒ ๊ธฐ์ค€ ์—†์Œ
  • Provider๊ฐ€ ์ž„์˜๋กœ ์ปค๋งจ๋“œ ๊ตฌ์„ฑ

์ฆ‰, Command ํ‘œ์‹œ ๊ธฐ์ค€์ด UI๊ฐ€ ์•„๋‹ˆ๋ผ ๋กœ์ง์— ์˜์กดํ•˜๋Š” ๊ตฌ์กฐ์˜€๋‹ค.


3. UI๊ฐ€ ์ƒํƒœ์— ๋”ฐ๋ผ ๋ถ„๊ธฐ๋˜์ง€ ์•Š์Œ

SelectionPanel์€ ํ•ญ์ƒ ๋™์ผํ•œ ๋ ˆ์ด์•„์›ƒ์„ ์‚ฌ์šฉํ–ˆ๋‹ค.

Portrait + Name + HP

์ด ๊ตฌ์กฐ์—์„œ๋Š”:

  • Multi ์ƒํƒœ ํ‘œํ˜„ ๋ถˆ๊ฐ€๋Šฅ
  • Summary ๊ตฌ์กฐ ํ™•์žฅ ๋ถˆ๊ฐ€

ํ•ด๊ฒฐ

ํ•ต์‹ฌ ๋ฐฉํ–ฅ์€ ๋‹ค์Œ ์„ธ ๊ฐ€์ง€๋กœ ์ •๋ฆฌํ–ˆ๋‹ค.


1. Selection ์ƒํƒœ๋ฅผ ๊ตฌ์กฐ์ ์œผ๋กœ ํ™•์žฅ

SelectionViewModel์— ์ƒํƒœ ๊ฐœ๋…์„ ์ถ”๊ฐ€ํ–ˆ๋‹ค.

ESelectionViewMode
- None
- Single
- Multi

์ถ”๊ฐ€๋œ ๋ฐ์ดํ„ฐ:

ํ•ญ๋ชฉ์—ญํ• 
ViewModeSelection ์ƒํƒœ ๊ตฌ๋ถ„
TotalSelectedCount์ด ์„ ํƒ ์ˆ˜
SummaryItems๋‹ค์ค‘ ์„ ํƒ ์š”์•ฝ ์ •๋ณด

๊ตฌ์กฐ ๋ณ€ํ™”

๊ธฐ์กด
โ†’ SelectionId ๊ธฐ๋ฐ˜ ๋‹จ์ผ ๊ตฌ์กฐ

๋ณ€๊ฒฝ ํ›„
โ†’ ViewMode ๊ธฐ๋ฐ˜ ์ƒํƒœ ๋ถ„๊ธฐ ๊ตฌ์กฐ

2. Multi Selection Summary ๊ตฌ์กฐ ๋„์ž…

๋‹ค์ค‘ ์„ ํƒ์„ ํ‘œํ˜„ํ•˜๊ธฐ ์œ„ํ•ด Summary ๊ตฌ์กฐ๋ฅผ ์ถ”๊ฐ€ํ–ˆ๋‹ค.

FSelectionSummaryItemViewModel
- EntityId
- DisplayName
- Count
- Icon

UI ํ‘œํ˜„ ๋ฐฉ์‹

[Icon] Marine     x5
[Icon] SCV        x2

๊ตฌํ˜„ ๋ฐฉ์‹

  • SummaryContainer (PanelWidget)
  • SummaryItemWidget ๋™์  ์ƒ์„ฑ
  • ๊ฐ ์•„์ดํ…œ๋ณ„ ViewModel ์ „๋‹ฌ

๊ฒฐ๊ณผ

  • ๋‹จ์ˆœ ํ…์ŠคํŠธ โ†’ UI ์นด๋“œ ํ˜•ํƒœ๋กœ ๊ฐœ์„ 
  • ์•„์ด์ฝ˜ + ์ด๋ฆ„ + ๊ฐœ์ˆ˜ ๋ถ„๋ฆฌ
  • ํ™•์žฅ ๊ฐ€๋Šฅํ•œ ๊ตฌ์กฐ ํ™•๋ณด

3. Command ๊ต์ง‘ํ•ฉ ๊ธฐ๋ฐ˜ ์ฒ˜๋ฆฌ ๋„์ž…

๋‹ค์ค‘ ์„ ํƒ ์‹œ Command ํ‘œ์‹œ ๊ธฐ์ค€์„ ๋ณ€๊ฒฝํ–ˆ๋‹ค.


๊ธฐ์กด

Provider โ†’ Command ๋ชฉ๋ก ์ง์ ‘ ์ „๋‹ฌ

๋ฌธ์ œ:

  • ์œ ๋‹›๋งˆ๋‹ค ๋‹ค๋ฅธ ์ปค๋งจ๋“œ ์ถฉ๋Œ ๋ฐœ์ƒ
  • UI ์ผ๊ด€์„ฑ ๊นจ์ง

๋ณ€๊ฒฝ

SelectionSummary
โ†’ EntityId ๋ชฉ๋ก ์ถ”์ถœ
โ†’ ๊ฐ Entity์˜ Command ๋ชฉ๋ก ์กฐํšŒ
โ†’ ๊ต์ง‘ํ•ฉ ๊ณ„์‚ฐ
โ†’ UI ํ‘œ์‹œ

ํ•ต์‹ฌ ๋กœ์ง

Marine: Move, Attack, Stop, Patrol
SCV:    Move, Attack, Stop, Patrol, BuildMenu

โ†’ ๊ฒฐ๊ณผ
Move, Attack, Stop, Patrol

์—ญํ•  ๋ถ„๋ฆฌ

์˜์—ญ์—ญํ• 
ProviderEntityId ๊ธฐ๋ฐ˜ Command ๋ชฉ๋ก ์ œ๊ณต
Coordinator๊ต์ง‘ํ•ฉ ๊ณ„์‚ฐ
UI๊ฒฐ๊ณผ ์ถœ๋ ฅ

4. SelectionPanel ์ƒํƒœ ๊ธฐ๋ฐ˜ UI ๋ถ„๋ฆฌ

SelectionPanel์„ ์ƒํƒœ๋ณ„๋กœ ๋ถ„๋ฆฌํ–ˆ๋‹ค.


๊ตฌ์กฐ

StateSwitcher
โ”œโ”€ EmptyState
โ”œโ”€ SingleState
โ””โ”€ MultiState

์ƒํƒœ๋ณ„ ์—ญํ• 

์ƒํƒœUI ๊ตฌ์„ฑ
None์•ˆ๋‚ด ํ…์ŠคํŠธ
SinglePortrait + ์ƒ์„ธ ์ •๋ณด
MultiSummary ๋ฆฌ์ŠคํŠธ

๊ฒฐ๊ณผ

  • UI ๋ถ„๊ธฐ ๋ช…ํ™•ํ•ด์ง
  • ์ƒํƒœ๋ณ„ ์ฑ…์ž„ ๋ถ„๋ฆฌ
  • ์œ ์ง€๋ณด์ˆ˜ ์šฉ์ด

5. UI โ†’ ์™„์ „ํ•œ ๋ฐ์ดํ„ฐ ์†Œ๋น„ ๊ตฌ์กฐ ์œ ์ง€

์ด๋ฒˆ ๋‹จ๊ณ„์—์„œ๋„ ๊ธฐ์กด ์›์น™ ์œ ์ง€:

UI๋Š” ๋ฐ์ดํ„ฐ๋ฅผ ์ƒ์„ฑํ•˜์ง€ ์•Š๋Š”๋‹ค

์ตœ์ข… ํ๋ฆ„

SelectionSource / ResourceSource
โ†’ Coordinator
โ†’ ViewModel ์ƒ์„ฑ
โ†’ HUDRoot
โ†’ SelectionPanel / CommandPanel

Multi ๊ตฌ์กฐ ํฌํ•จ ํ๋ฆ„

SelectionSource
โ†’ SummaryItems + EntityId ๋ชฉ๋ก
โ†’ Coordinator
โ†’ Command ๊ต์ง‘ํ•ฉ ๊ณ„์‚ฐ
โ†’ ViewModel ๊ตฌ์„ฑ
โ†’ UI ์ถœ๋ ฅ

๊ฒฐ๊ณผ

ํ•ญ๋ชฉ๋ณ€ํ™”
Selection ๊ตฌ์กฐSingle โ†’ Multi ํ™•์žฅ
UI ์ƒํƒœNone / Single / Multi ๋ถ„๋ฆฌ
Command ์ฒ˜๋ฆฌ๊ต์ง‘ํ•ฉ ๊ธฐ๋ฐ˜
Summary UIํ…์ŠคํŠธ โ†’ ์นด๋“œํ˜• UI
๊ตฌ์กฐ ์•ˆ์ •์„ฑ์œ ์ง€
ํ™•์žฅ์„ฑ์‹ค์ œ RTS ์‹œ์Šคํ…œ ๋Œ€์‘ ๊ฐ€๋Šฅ

์˜ค๋Š˜์˜ ์ •๋ฆฌ

  • ์ด๋ฒˆ ์ž‘์—…์€ ๋‹จ์ˆœ ๊ธฐ๋Šฅ ์ถ”๊ฐ€๊ฐ€ ์•„๋‹ˆ๋ผ
    Selection์„ ์ค‘์‹ฌ์œผ๋กœ UI ์ƒํƒœ ๋ชจ๋ธ์„ ํ™•์žฅํ•˜๊ณ ,
    ๋‹ค์ค‘ ์„ ํƒ๊ณผ Command ์ฒ˜๋ฆฌ ๊ธฐ์ค€์„ ๊ตฌ์กฐ์ ์œผ๋กœ ์ •์˜ํ•œ ๋‹จ๊ณ„์˜€๋‹ค.
  • UI๋Š” ์—ฌ์ „ํžˆ ๋ฐ์ดํ„ฐ๋ฅผ ์†Œ๋น„ํ•˜๋Š” ์—ญํ• ์„ ์œ ์ง€ํ•˜๋ฉด์„œ,
    Coordinator๋ฅผ ํ†ตํ•ด ๋ณต์žกํ•œ ์ƒํƒœ๋ฅผ ์กฐํ•ฉํ•˜๋Š” ๋ฐฉํ–ฅ์œผ๋กœ ํ™•์žฅํ–ˆ๋‹ค.
profile
๊ฐœ๋ฐœํ•ฉ์‹œ๋‹ค!

0๊ฐœ์˜ ๋Œ“๊ธ€