khi/XRLib
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Dropdown popup 스타일 가이드 적용 및 다중 선택 Dropdown 추가

Browse Source
This commit is contained in:
logonkhi
2026-02-06 19:54:11 +09:00
parent 18af2fc9c6
commit a7fc12f32f
44 changed files with 3477 additions and 326 deletions
Download Patch File Download Diff File Expand all files Collapse all files

413
Assets/Scripts/UVC/UIToolkit/Dropdown/UTKDropdown.cs
View File

@@ -8,8 +8,8 @@ namespace UVC.UIToolkit
{
/// <summary>
/// 드롭다운 메뉴 컴포넌트.
/// Unity DropdownField를 래핑하여 커스텀 스타일을 적용합니다.
/// 여러 옵션 중 하나를 선택할 수 있는 UI 컨트롤입니다.
/// 선택된 항목은 체크 아이콘으로 표시됩니다.
/// </summary>
/// <remarks>
/// <para><b>드롭다운(Dropdown)이란?</b></para>
@@ -21,20 +21,27 @@ namespace UVC.UIToolkit
///
/// <para><b>주요 속성:</b></para>
/// <list type="bullet">
/// <item><description><c>choices</c> - 선택 가능한 옵션 목록 (List<string>)</description></item>
/// <item><description><c>index</c> - 현재 선택된 인덱스 (0부터 시작)</description></item>
/// <item><description><c>value</c> - 현재 선택된 텍스트 값</description></item>
/// <item><description><c>SelectedIndex</c> - index의 별칭</description></item>
/// <item><description><c>SelectedValue</c> - value의 별칭 (읽기 전용)</description></item>
/// <item><description><c>Label</c> - 드롭다운 라벨 텍스트</description></item>
/// <item><description><c>Choices</c> - 선택 가능한 옵션 목록 (쉼표로 구분된 문자열)</description></item>
/// <item><description><c>SelectedIndex</c> - 현재 선택된 인덱스 (0부터 시작, -1은 선택 안 됨)</description></item>
/// <item><description><c>SelectedValue</c> - 현재 선택된 텍스트 값 (읽기 전용)</description></item>
/// <item><description><c>Placeholder</c> - 선택되지 않았을 때 표시되는 텍스트</description></item>
/// <item><description><c>IsEnabled</c> - 활성화/비활성화 상태</description></item>
/// </list>
///
/// <para><b>주요 메서드:</b></para>
/// <list type="bullet">
/// <item><description><c>SetOptions(List<string>)</c> - 전체 옵션 목록 교체</description></item>
/// <item><description><c>AddOption(string)</c> - 옵션 하나 추가</description></item>
/// <item><description><c>SetSelectedIndex(int, bool)</c> - 인덱스로 선택 (notify: 이벤트 발생 여부)</description></item>
/// <item><description><c>SetSelectedValue(string, bool)</c> - 값으로 선택 (notify: 이벤트 발생 여부)</description></item>
/// </list>
///
/// <para><b>주요 이벤트:</b></para>
/// <list type="bullet">
/// <item><description><c>OnSelectionChanged</c> - 선택 변경 시 발생 (인덱스, 값 전달)</description></item>
/// </list>
///
/// <para><b>실제 활용 예시:</b></para>
/// <list type="bullet">
/// <item><description>정렬 옵션 - 이름순, 날짜순, 크기순</description></item>
@@ -49,7 +56,7 @@ namespace UVC.UIToolkit
/// <code>
/// // 국가 선택 드롭다운
/// var countryDropdown = new UTKDropdown();
/// countryDropdown.label = "국가 선택";
/// countryDropdown.Label = "국가 선택";
/// countryDropdown.SetOptions(new List<string> { "한국", "미국", "일본", "중국" });
///
/// // 선택 변경 이벤트 (인덱스와 값 모두 전달)
@@ -61,7 +68,7 @@ namespace UVC.UIToolkit
/// var sortDropdown = new UTKDropdown("정렬", new List<string> { "이름", "날짜", "크기" });
///
/// // 기본값 설정 (인덱스로)
/// sortDropdown.index = 0; // 첫 번째 항목 선택
/// sortDropdown.SelectedIndex = 0; // 첫 번째 항목 선택
///
/// // 기본값 설정 (값으로)
/// sortDropdown.SetSelectedValue("날짜");
@@ -82,38 +89,111 @@ namespace UVC.UIToolkit
/// choices="한국어,English,日本語"
/// index="0" />
///
/// <!-- 플레이스홀더 사용 -->
/// <utk:UTKDropdown label="국가"
/// choices="한국,미국,일본,중국"
/// placeholder="국가를 선택하세요" />
///
/// <!-- 비활성화 상태 -->
/// <utk:UTKDropdown label="선택" is-enabled="false"
/// choices="옵션1,옵션2,옵션3" />
/// choices="옵션1,옵션2,옵션3"
/// index="1" />
/// </code>
/// </example>
[UxmlElement]
public partial class UTKDropdown : DropdownField, IDisposable
public partial class UTKDropdown : VisualElement, IDisposable
{
#region Constants
private const string USS_PATH = "UIToolkit/Dropdown/UTKDropdown";
private const string USS_PATH = "UIToolkit/Dropdown/UTKDropdownUss";
private const string DEFAULT_PLACEHOLDER = "Select";
#endregion
#region Fields
private bool _disposed;
private Label? _labelElement;
private VisualElement? _inputContainer;
private Label? _displayLabel;
private VisualElement? _dropdownIconContainer;
private UTKLabel? _dropdownIcon;
private VisualElement? _popupContainer;
private ScrollView? _optionsScrollView;
private string _label = "";
private List<string> _choices = new();
private int _selectedIndex = -1;
private string _placeholder = DEFAULT_PLACEHOLDER;
private bool _isEnabled = true;
private bool _isPopupOpen;
private readonly StyleSheet? _loadedUss;
// 옵션 항목과 체크 아이콘 추적
private readonly List<(VisualElement container, UTKLabel checkIcon)> _optionItems = new();
#endregion
#region Events
/// <summary>선택 변경 이벤트</summary>
/// <summary>선택 변경 이벤트 (선택된 인덱스, 선택된 값)</summary>
public event Action<int, string>? OnSelectionChanged;
#endregion
#region Properties
/// <summary>선택된 인덱스</summary>
public int SelectedIndex
/// <summary>라벨 텍스트</summary>
[UxmlAttribute("label")]
public string Label
{
get => index;
set => index = value;
get => _label;
set
{
_label = value;
if (_labelElement != null)
{
_labelElement.text = value;
_labelElement.style.display = string.IsNullOrEmpty(value) ? DisplayStyle.None : DisplayStyle.Flex;
}
}
}
/// <summary>선택된 값</summary>
public string? SelectedValue => value;
/// <summary>선택 가능한 옵션 목록</summary>
[UxmlAttribute("choices")]
public string Choices
{
get => string.Join(",", _choices);
set
{
if (string.IsNullOrEmpty(value))
{
_choices.Clear();
}
else
{
_choices = new List<string>(value.Split(','));
}
RebuildOptions();
}
}
/// <summary>선택된 인덱스</summary>
[UxmlAttribute("index")]
public int SelectedIndex
{
get => _selectedIndex;
set => SetSelectedIndex(value, true);
}
/// <summary>선택된 값 (읽기 전용)</summary>
public string? SelectedValue => _selectedIndex >= 0 && _selectedIndex < _choices.Count ? _choices[_selectedIndex] : null;
/// <summary>플레이스홀더 텍스트</summary>
[UxmlAttribute("placeholder")]
public string Placeholder
{
get => _placeholder;
set
{
_placeholder = value;
UpdateDisplayText();
}
}
/// <summary>활성화 상태</summary>
[UxmlAttribute("is-enabled")]
@@ -138,32 +218,76 @@ namespace UVC.UIToolkit
if (uss != null)
{
styleSheets.Add(uss);
_loadedUss = uss;
}
SetupStyles();
CreateUI();
SetupEvents();
SubscribeToThemeChanges();
}
public UTKDropdown(string label, List<string>? options = null) : this()
{
this.label = label;
Label = label;
if (options != null)
{
choices = options;
SetOptions(options);
}
}
#endregion
#region Setup
private void SetupStyles()
#region UI Creation
private void CreateUI()
{
AddToClassList("utk-dropdown");
focusable = true;
// 라벨
_labelElement = new Label();
_labelElement.AddToClassList("utk-dropdown__label");
Add(_labelElement);
// 입력 컨테이너
_inputContainer = new VisualElement();
_inputContainer.AddToClassList("utk-dropdown__input");
Add(_inputContainer);
// 표시 라벨
_displayLabel = new Label(_placeholder);
_displayLabel.AddToClassList("utk-dropdown__display");
_displayLabel.AddToClassList("utk-dropdown__display--placeholder");
_inputContainer.Add(_displayLabel);
// 드롭다운 아이콘 컨테이너
_dropdownIconContainer = new VisualElement();
_dropdownIconContainer.AddToClassList("utk-dropdown__icon-container");
_inputContainer.Add(_dropdownIconContainer);
// 드롭다운 아이콘
_dropdownIcon = new UTKLabel(UTKMaterialIcons.ArrowDropDown, 24);
_dropdownIcon.AddToClassList("utk-dropdown__icon");
_dropdownIconContainer.Add(_dropdownIcon);
// 팝업 컨테이너
_popupContainer = new VisualElement();
_popupContainer.AddToClassList("utk-dropdown__popup");
_popupContainer.style.display = DisplayStyle.None;
Add(_popupContainer);
// 옵션 스크롤뷰
_optionsScrollView = new ScrollView(ScrollViewMode.Vertical);
_optionsScrollView.AddToClassList("utk-dropdown__options");
_popupContainer.Add(_optionsScrollView);
}
private void SetupEvents()
{
RegisterCallback<ChangeEvent<string>>(OnDropdownValueChanged);
// 입력 컨테이너 클릭 시 팝업 토글
_inputContainer?.RegisterCallback<ClickEvent>(OnInputClicked);
// 외부 클릭 감지를 위한 루트 패널 이벤트
RegisterCallback<AttachToPanelEvent>(OnAttachedToPanel);
RegisterCallback<DetachFromPanelEvent>(OnDetachedFromPanel);
}
private void SubscribeToThemeChanges()
@@ -182,9 +306,129 @@ namespace UVC.UIToolkit
#endregion
#region Event Handlers
private void OnDropdownValueChanged(ChangeEvent<string> evt)
private void OnInputClicked(ClickEvent evt)
{
OnSelectionChanged?.Invoke(index, evt.newValue);
if (!_isEnabled) return;
_isPopupOpen = !_isPopupOpen;
if (_popupContainer != null)
{
if (_isPopupOpen)
{
OpenPopup();
}
else
{
ClosePopup();
}
}
EnableInClassList("utk-dropdown--open", _isPopupOpen);
evt.StopPropagation();
}
private void OpenPopup()
{
if (_popupContainer == null || _inputContainer == null || panel == null) return;
// 아이콘 변경
if (_dropdownIcon is UTKLabel iconLabel)
{
iconLabel.SetMaterialIcon(UTKMaterialIcons.ArrowDropUp);
}
// 팝업을 루트로 이동
if (_popupContainer.parent != panel.visualTree)
{
_popupContainer.RemoveFromHierarchy();
panel.visualTree.Add(_popupContainer);
UTKThemeManager.Instance.ApplyThemeToElement(_popupContainer);
if (_loadedUss != null)
{
_popupContainer.styleSheets.Add(_loadedUss);
}
}
// 드롭다운의 월드 위치 계산
var inputBounds = _inputContainer.worldBound;
_popupContainer.style.position = Position.Absolute;
_popupContainer.style.left = inputBounds.x;
_popupContainer.style.top = inputBounds.yMax + 2; // 2px 간격
_popupContainer.style.width = inputBounds.width;
_popupContainer.style.display = DisplayStyle.Flex;
}
private void ClosePopup()
{
_isPopupOpen = false;
// 아이콘 복원
if (_dropdownIcon is UTKLabel iconLabel)
{
iconLabel.SetMaterialIcon(UTKMaterialIcons.ArrowDropDown);
}
if (_popupContainer != null)
{
_popupContainer.style.display = DisplayStyle.None;
// 팝업을 원래 위치(드롭다운 내부)로 되돌림
if (_popupContainer.parent != this)
{
_popupContainer.RemoveFromHierarchy();
Add(_popupContainer);
}
}
EnableInClassList("utk-dropdown--open", false);
}
private void OnAttachedToPanel(AttachToPanelEvent evt)
{
if (panel != null)
{
panel.visualTree.RegisterCallback<PointerDownEvent>(OnPanelPointerDown, TrickleDown.TrickleDown);
}
}
private void OnDetachedFromPanel(DetachFromPanelEvent evt)
{
if (panel != null)
{
panel.visualTree.UnregisterCallback<PointerDownEvent>(OnPanelPointerDown, TrickleDown.TrickleDown);
}
}
private void OnPanelPointerDown(PointerDownEvent evt)
{
if (!_isPopupOpen) return;
var target = evt.target as VisualElement;
if (target == null) return;
// 입력 컨테이너 클릭 확인
if (_inputContainer != null && target.FindCommonAncestor(_inputContainer) == _inputContainer)
{
return; // 입력 영역 클릭이면 무시
}
// 팝업 컨테이너 클릭 확인
if (_popupContainer != null && target.FindCommonAncestor(_popupContainer) == _popupContainer)
{
return; // 팝업 내부 클릭이면 무시
}
// 외부 클릭이면 팝업 닫기
ClosePopup();
}
private void OnOptionClicked(int index)
{
SetSelectedIndex(index, true);
ClosePopup();
}
#endregion
@@ -194,7 +438,8 @@ namespace UVC.UIToolkit
/// </summary>
public void SetOptions(List<string> options)
{
choices = options ?? new List<string>();
_choices = options ?? new List<string>();
RebuildOptions();
}
/// <summary>
@@ -202,8 +447,26 @@ namespace UVC.UIToolkit
/// </summary>
public void AddOption(string option)
{
var list = new List<string>(choices) { option };
choices = list;
_choices.Add(option);
RebuildOptions();
}
/// <summary>
/// 선택된 인덱스 설정
/// </summary>
public void SetSelectedIndex(int index, bool notify)
{
if (index < -1 || index >= _choices.Count) return;
if (_selectedIndex == index) return;
_selectedIndex = index;
UpdateDisplayText();
UpdateCheckIcons();
if (notify && _selectedIndex >= 0)
{
OnSelectionChanged?.Invoke(_selectedIndex, _choices[_selectedIndex]);
}
}
/// <summary>
@@ -213,21 +476,87 @@ namespace UVC.UIToolkit
{
if (selectedValue == null)
{
index = -1;
SetSelectedIndex(-1, notify);
return;
}
var idx = choices.IndexOf(selectedValue);
var idx = _choices.IndexOf(selectedValue);
if (idx >= 0)
{
if (notify)
SetSelectedIndex(idx, notify);
}
}
private void RebuildOptions()
{
if (_optionsScrollView == null) return;
_optionItems.Clear();
_optionsScrollView.Clear();
for (int i = 0; i < _choices.Count; i++)
{
var index = i; // 클로저 캡처 방지
var optionContainer = new VisualElement();
optionContainer.AddToClassList("utk-dropdown__option");
// 체크 아이콘 (선택된 항목 표시)
var checkIcon = new UTKLabel(UTKMaterialIcons.Check, 16);
checkIcon.AddToClassList("utk-dropdown__check-icon");
checkIcon.style.display = _selectedIndex == i ? DisplayStyle.Flex : DisplayStyle.None;
optionContainer.Add(checkIcon);
// 옵션 라벨
var optionLabel = new Label(_choices[i]);
optionLabel.AddToClassList("utk-dropdown__option-label");
optionContainer.Add(optionLabel);
// 클릭 이벤트
optionContainer.RegisterCallback<ClickEvent>(evt =>
{
index = idx;
}
else
OnOptionClicked(index);
evt.StopPropagation();
});
// 마우스 호버 이벤트
optionContainer.RegisterCallback<MouseEnterEvent>(_ =>
{
SetValueWithoutNotify(selectedValue);
}
optionContainer.AddToClassList("utk-dropdown__option--hover");
});
optionContainer.RegisterCallback<MouseLeaveEvent>(_ =>
{
optionContainer.RemoveFromClassList("utk-dropdown__option--hover");
});
_optionItems.Add((optionContainer, checkIcon));
_optionsScrollView.Add(optionContainer);
}
UpdateDisplayText();
}
private void UpdateDisplayText()
{
if (_displayLabel == null) return;
if (_selectedIndex < 0 || _selectedIndex >= _choices.Count)
{
_displayLabel.text = _placeholder;
_displayLabel.AddToClassList("utk-dropdown__display--placeholder");
}
else
{
_displayLabel.text = _choices[_selectedIndex];
_displayLabel.RemoveFromClassList("utk-dropdown__display--placeholder");
}
}
private void UpdateCheckIcons()
{
for (int i = 0; i < _optionItems.Count; i++)
{
var (_, checkIcon) = _optionItems[i];
checkIcon.style.display = _selectedIndex == i ? DisplayStyle.Flex : DisplayStyle.None;
}
}
#endregion
@@ -240,7 +569,15 @@ namespace UVC.UIToolkit
UTKThemeManager.Instance.OnThemeChanged -= OnThemeChanged;
OnSelectionChanged = null;
UnregisterCallback<ChangeEvent<string>>(OnDropdownValueChanged);
_inputContainer?.UnregisterCallback<ClickEvent>(OnInputClicked);
if (panel != null)
{
panel.visualTree.UnregisterCallback<PointerDownEvent>(OnPanelPointerDown);
}
_optionItems.Clear();
}
#endregion
}

389
Assets/Scripts/UVC/UIToolkit/Dropdown/UTKEnumDropDown.cs
View File

@@ -1,5 +1,6 @@
#nullable enable
using System;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UIElements;
@@ -7,8 +8,8 @@ namespace UVC.UIToolkit
{
/// <summary>
/// Enum 선택 드롭다운 컴포넌트.
/// Unity EnumField를 래핑하여 커스텀 스타일을 적용합니다.
/// C# Enum 타입을 자동으로 드롭다운 옵션으로 변환합니다.
/// 여러 옵션 중 하나를 선택할 수 있는 UI 컨트롤입니다.
/// 선택된 항목은 체크 아이콘으로 표시됩니다.
/// </summary>
/// <remarks>
/// <para><b>Enum 드롭다운이란?</b></para>
@@ -31,13 +32,21 @@ namespace UVC.UIToolkit
///
/// <para><b>주요 속성:</b></para>
/// <list type="bullet">
/// <item><description><c>Label</c> - 드롭다운 라벨 텍스트</description></item>
/// <item><description><c>Value</c> - 현재 선택된 Enum 값</description></item>
/// <item><description><c>Placeholder</c> - 선택되지 않았을 때 표시되는 텍스트</description></item>
/// <item><description><c>IsEnabled</c> - 활성화/비활성화 상태</description></item>
/// </list>
///
/// <para><b>중요한 메서드:</b></para>
/// <para><b>주요 메서드:</b></para>
/// <list type="bullet">
/// <item><description><c>Init(Enum)</c> - Enum 타입과 기본값으로 초기화 (필수!)</description></item>
/// <item><description><c>SetValue(Enum, bool)</c> - 값 설정 (notify: 이벤트 발생 여부)</description></item>
/// </list>
///
/// <para><b>주요 이벤트:</b></para>
/// <list type="bullet">
/// <item><description><c>OnValueChanged</c> - 선택 변경 시 발생 (Enum 값 전달)</description></item>
/// </list>
///
/// <para><b>UXML 사용 시 주의:</b></para>
@@ -67,7 +76,7 @@ namespace UVC.UIToolkit
/// <code>
/// // 난이도 선택 드롭다운
/// var difficultyDropdown = new UTKEnumDropDown();
/// difficultyDropdown.label = "난이도";
/// difficultyDropdown.Label = "난이도";
/// difficultyDropdown.Init(Difficulty.Normal); // 기본값: Normal
///
/// // 값 변경 이벤트
@@ -88,8 +97,8 @@ namespace UVC.UIToolkit
/// </code>
/// <para><b>UXML에서 사용:</b></para>
/// <code>
/// <!-- UXML에서는 name만 지정 -->
/// <utk:UTKEnumDropDown name="difficulty-dropdown" label="난이도" />
/// <!-- UXML에서는 name과 label만 지정 -->
/// <utk:UTKEnumDropDown name="difficulty-dropdown" label="난이도" placeholder="난이도를 선택하세요" />
/// <utk:UTKEnumDropDown name="quality-dropdown" label="품질" />
/// </code>
/// <para><b>UXML 로드 후 C#에서 초기화:</b></para>
@@ -103,28 +112,78 @@ namespace UVC.UIToolkit
/// </code>
/// </example>
[UxmlElement]
public partial class UTKEnumDropDown : EnumField, IDisposable
public partial class UTKEnumDropDown : VisualElement, IDisposable
{
#region Constants
private const string USS_PATH = "UIToolkit/Dropdown/UTKEnumDropDown";
private const string USS_PATH = "UIToolkit/Dropdown/UTKEnumDropDownUss";
private const string DEFAULT_PLACEHOLDER = "Select";
#endregion
#region Fields
private bool _disposed;
private Label? _labelElement;
private VisualElement? _inputContainer;
private Label? _displayLabel;
private VisualElement? _dropdownIconContainer;
private UTKLabel? _dropdownIcon;
private VisualElement? _popupContainer;
private ScrollView? _optionsScrollView;
private string _label = "";
private Type? _enumType;
private Enum? _value;
private string _placeholder = DEFAULT_PLACEHOLDER;
private bool _isEnabled = true;
private bool _isPopupOpen;
private readonly StyleSheet? _loadedUss;
// 옵션 항목과 체크 아이콘 추적
private readonly List<(VisualElement container, UTKLabel checkIcon, Enum enumValue)> _optionItems = new();
#endregion
#region Events
/// <summary>값 변경 이벤트</summary>
/// <summary>값 변경 이벤트 (선택된 Enum 값)</summary>
public event Action<Enum?>? OnValueChanged;
#endregion
#region Properties
/// <summary>현재 값</summary>
/// <summary>라벨 텍스트</summary>
[UxmlAttribute("label")]
public string Label
{
get => _label;
set
{
_label = value;
if (_labelElement != null)
_labelElement.text = value;
}
}
/// <summary>현재 선택된 Enum 값</summary>
public Enum? Value
{
get => value;
set => this.value = value;
get => _value;
set
{
if (_value?.Equals(value) == true) return;
_value = value;
UpdateDisplayText();
UpdateCheckIcons();
}
}
/// <summary>플레이스홀더 텍스트 (선택되지 않았을 때 표시)</summary>
[UxmlAttribute("placeholder")]
public string Placeholder
{
get => _placeholder;
set
{
_placeholder = value;
UpdateDisplayText();
}
}
/// <summary>활성화 상태</summary>
@@ -146,33 +205,69 @@ namespace UVC.UIToolkit
{
UTKThemeManager.Instance.ApplyThemeToElement(this);
var uss = Resources.Load<StyleSheet>(USS_PATH);
if (uss != null)
_loadedUss = Resources.Load<StyleSheet>(USS_PATH);
if (_loadedUss != null)
{
styleSheets.Add(uss);
styleSheets.Add(_loadedUss);
}
SetupStyles();
SetupEvents();
CreateUI();
SubscribeToThemeChanges();
}
public UTKEnumDropDown(string label, Enum defaultValue) : this()
{
this.label = label;
Label = label;
Init(defaultValue);
}
#endregion
#region Setup
private void SetupStyles()
private void CreateUI()
{
AddToClassList("utk-enum-dropdown");
}
private void SetupEvents()
{
RegisterCallback<ChangeEvent<Enum>>(OnFieldValueChanged);
// Label
_labelElement = new Label(_label);
_labelElement.AddToClassList("utk-enum-dropdown__label");
Add(_labelElement);
// Input Container
_inputContainer = new VisualElement();
_inputContainer.AddToClassList("utk-enum-dropdown__input");
Add(_inputContainer);
// Display Label
_displayLabel = new Label(_placeholder);
_displayLabel.AddToClassList("utk-enum-dropdown__display");
_displayLabel.AddToClassList("utk-enum-dropdown__display--placeholder");
_inputContainer.Add(_displayLabel);
// Icon Container
_dropdownIconContainer = new VisualElement();
_dropdownIconContainer.AddToClassList("utk-enum-dropdown__icon-container");
_inputContainer.Add(_dropdownIconContainer);
// Dropdown Icon
_dropdownIcon = new UTKLabel(UTKMaterialIcons.ArrowDropDown, 24);
_dropdownIcon.AddToClassList("utk-enum-dropdown__icon");
_dropdownIconContainer.Add(_dropdownIcon);
// Popup Container
_popupContainer = new VisualElement();
_popupContainer.AddToClassList("utk-enum-dropdown__popup");
_popupContainer.style.display = DisplayStyle.None;
_popupContainer.style.position = Position.Absolute;
// Options ScrollView
_optionsScrollView = new ScrollView(ScrollViewMode.Vertical);
_optionsScrollView.AddToClassList("utk-enum-dropdown__options");
_popupContainer.Add(_optionsScrollView);
// Events
_inputContainer.RegisterCallback<ClickEvent>(OnInputClicked);
RegisterCallback<AttachToPanelEvent>(OnAttachedToPanel);
RegisterCallback<DetachFromPanelEvent>(OnDetachedFromPanel);
}
private void SubscribeToThemeChanges()
@@ -188,12 +283,240 @@ namespace UVC.UIToolkit
{
UTKThemeManager.Instance.ApplyThemeToElement(this);
}
private void OnAttachedToPanel(AttachToPanelEvent evt)
{
if (panel != null)
{
panel.visualTree.RegisterCallback<PointerDownEvent>(OnPanelPointerDown, TrickleDown.TrickleDown);
}
}
private void OnDetachedFromPanel(DetachFromPanelEvent evt)
{
if (panel != null)
{
panel.visualTree.UnregisterCallback<PointerDownEvent>(OnPanelPointerDown, TrickleDown.TrickleDown);
}
}
#endregion
#region Event Handlers
private void OnFieldValueChanged(ChangeEvent<Enum> evt)
#region Public Methods
/// <summary>
/// Enum 타입과 기본값으로 초기화합니다.
/// </summary>
/// <param name="defaultValue">기본값으로 설정할 Enum 값</param>
public void Init(Enum defaultValue)
{
OnValueChanged?.Invoke(evt.newValue);
_enumType = defaultValue.GetType();
_value = defaultValue;
RebuildOptions();
UpdateDisplayText();
}
/// <summary>
/// 현재 값을 특정 Enum 값으로 설정합니다.
/// </summary>
/// <param name="enumValue">설정할 Enum 값</param>
/// <param name="notify">이벤트 발생 여부</param>
public void SetValue(Enum? enumValue, bool notify = true)
{
if (_value?.Equals(enumValue) == true) return;
_value = enumValue;
UpdateDisplayText();
UpdateCheckIcons();
if (notify)
{
OnValueChanged?.Invoke(_value);
}
}
#endregion
#region Private Methods
private void RebuildOptions()
{
if (_optionsScrollView == null || _enumType == null) return;
// Clear existing options
_optionsScrollView.Clear();
_optionItems.Clear();
// Get all enum values
var enumValues = Enum.GetValues(_enumType);
// Create option for each enum value
foreach (Enum enumValue in enumValues)
{
var optionContainer = new VisualElement();
optionContainer.AddToClassList("utk-enum-dropdown__option");
// Check icon
var checkIcon = new UTKLabel(UTKMaterialIcons.Check, 16);
checkIcon.AddToClassList("utk-enum-dropdown__check-icon");
checkIcon.style.display = _value?.Equals(enumValue) == true ? DisplayStyle.Flex : DisplayStyle.None;
optionContainer.Add(checkIcon);
// Option label
var optionLabel = new Label(enumValue.ToString());
optionLabel.AddToClassList("utk-enum-dropdown__option-label");
optionContainer.Add(optionLabel);
// Click event
optionContainer.RegisterCallback<ClickEvent>(evt =>
{
evt.StopPropagation();
OnOptionSelected(enumValue);
});
// 마우스 호버 이벤트
optionContainer.RegisterCallback<MouseEnterEvent>(_ =>
{
optionContainer.AddToClassList("utk-enum-dropdown__option--hover");
});
optionContainer.RegisterCallback<MouseLeaveEvent>(_ =>
{
optionContainer.RemoveFromClassList("utk-enum-dropdown__option--hover");
});
_optionsScrollView.Add(optionContainer);
_optionItems.Add((optionContainer, checkIcon, enumValue));
}
}
private void UpdateDisplayText()
{
if (_displayLabel == null) return;
if (_value != null)
{
_displayLabel.text = _value.ToString();
_displayLabel.RemoveFromClassList("utk-enum-dropdown__display--placeholder");
}
else
{
_displayLabel.text = _placeholder;
_displayLabel.AddToClassList("utk-enum-dropdown__display--placeholder");
}
}
private void UpdateCheckIcons()
{
foreach (var (_, checkIcon, enumValue) in _optionItems)
{
checkIcon.style.display = _value?.Equals(enumValue) == true ? DisplayStyle.Flex : DisplayStyle.None;
}
}
private void OnOptionSelected(Enum enumValue)
{
SetValue(enumValue, notify: true);
ClosePopup();
}
private void OnInputClicked(ClickEvent evt)
{
if (!_isEnabled) return;
_isPopupOpen = !_isPopupOpen;
if (_popupContainer != null)
{
if (_isPopupOpen)
{
OpenPopup();
}
else
{
ClosePopup();
}
}
EnableInClassList("utk-enum-dropdown--open", _isPopupOpen);
evt.StopPropagation();
}
private void OpenPopup()
{
if (_popupContainer == null || _inputContainer == null || panel == null) return;
// 아이콘 변경
if (_dropdownIcon is UTKLabel iconLabel)
{
iconLabel.SetMaterialIcon(UTKMaterialIcons.ArrowDropUp);
}
// 팝업을 루트로 이동
if (_popupContainer.parent != panel.visualTree)
{
_popupContainer.RemoveFromHierarchy();
panel.visualTree.Add(_popupContainer);
UTKThemeManager.Instance.ApplyThemeToElement(_popupContainer);
if (_loadedUss != null)
{
_popupContainer.styleSheets.Add(_loadedUss);
}
}
// 드롭다운의 월드 위치 계산
var inputBounds = _inputContainer.worldBound;
_popupContainer.style.position = Position.Absolute;
_popupContainer.style.left = inputBounds.x;
_popupContainer.style.top = inputBounds.yMax + 2; // 2px 간격
_popupContainer.style.width = inputBounds.width;
_popupContainer.style.display = DisplayStyle.Flex;
}
private void ClosePopup()
{
_isPopupOpen = false;
// 아이콘 복원
if (_dropdownIcon is UTKLabel iconLabel)
{
iconLabel.SetMaterialIcon(UTKMaterialIcons.ArrowDropDown);
}
if (_popupContainer != null)
{
_popupContainer.style.display = DisplayStyle.None;
// 팝업을 원래 위치(드롭다운 내부)로 되돌림
if (_popupContainer.parent != this)
{
_popupContainer.RemoveFromHierarchy();
Add(_popupContainer);
}
}
// 포커스 상태 클래스 제거
EnableInClassList("utk-enum-dropdown--open", false);
}
private void OnPanelPointerDown(PointerDownEvent evt)
{
if (!_isPopupOpen) return;
var target = evt.target as VisualElement;
if (target == null) return;
// 입력 컨테이너 클릭 확인
if (_inputContainer != null && target.FindCommonAncestor(_inputContainer) == _inputContainer)
{
return; // 입력 영역 클릭이면 무시
}
// 팝업 컨테이너 클릭 확인
if (_popupContainer != null && target.FindCommonAncestor(_popupContainer) == _popupContainer)
{
return; // 팝업 내부 클릭이면 무시
}
// 외부 클릭이면 팝업 닫기
ClosePopup();
}
#endregion
@@ -204,8 +527,20 @@ namespace UVC.UIToolkit
_disposed = true;
UTKThemeManager.Instance.OnThemeChanged -= OnThemeChanged;
UnregisterCallback<ChangeEvent<Enum>>(OnFieldValueChanged);
OnValueChanged = null;
_inputContainer?.UnregisterCallback<ClickEvent>(OnInputClicked);
if (panel != null)
{
panel.visualTree.UnregisterCallback<PointerDownEvent>(OnPanelPointerDown);
}
foreach (var (container, checkIcon, _) in _optionItems)
{
checkIcon.Dispose();
}
_optionItems.Clear();
}
#endregion
}

610
Assets/Scripts/UVC/UIToolkit/Dropdown/UTKMultiSelectDropdown.cs Normal file
View File

@@ -0,0 +1,610 @@
#nullable enable
using System;
using System.Collections.Generic;
using System.Linq;
using UnityEngine;
using UnityEngine.UIElements;
namespace UVC.UIToolkit
{
/// <summary>
/// 다중 선택 드롭다운 컴포넌트.
/// 체크박스를 통해 여러 항목을 동시에 선택할 수 있는 드롭다운입니다.
/// </summary>
/// <remarks>
/// <para><b>다중 선택 드롭다운이란?</b></para>
/// <para>
/// 일반 드롭다운과 달리 여러 옵션을 동시에 선택할 수 있는 UI 컴포넌트입니다.
/// 각 옵션에 체크박스가 있어 다중 선택을 직관적으로 표현합니다.
/// 선택된 항목들은 메인 필드에 쉼표로 구분되어 표시됩니다.
/// </para>
///
/// <para><b>주요 속성:</b></para>
/// <list type="bullet">
/// <item><description><c>Choices</c> - 선택 가능한 옵션 목록 (List<string>)</description></item>
/// <item><description><c>SelectedIndices</c> - 선택된 항목들의 인덱스 목록</description></item>
/// <item><description><c>SelectedValues</c> - 선택된 항목들의 값 목록</description></item>
/// <item><description><c>Placeholder</c> - 아무것도 선택되지 않았을 때 표시할 텍스트</description></item>
/// </list>
///
/// <para><b>주요 메서드:</b></para>
/// <list type="bullet">
/// <item><description><c>SetOptions(List<string>)</c> - 전체 옵션 목록 교체</description></item>
/// <item><description><c>SetSelectedIndices(List<int>)</c> - 인덱스로 선택 설정</description></item>
/// <item><description><c>SetSelectedValues(List<string>)</c> - 값으로 선택 설정</description></item>
/// <item><description><c>SelectAll()</c> - 모든 항목 선택</description></item>
/// <item><description><c>ClearSelection()</c> - 모든 선택 해제</description></item>
/// </list>
///
/// <para><b>실제 활용 예시:</b></para>
/// <list type="bullet">
/// <item><description>필터 선택 - 여러 카테고리 동시 필터링</description></item>
/// <item><description>태그 선택 - 여러 태그 동시 적용</description></item>
/// <item><description>권한 설정 - 여러 권한 동시 부여</description></item>
/// <item><description>레이어 선택 - 여러 레이어 동시 표시/숨김</description></item>
/// </list>
/// </remarks>
/// <example>
/// <para><b>C# 코드에서 사용:</b></para>
/// <code>
/// // 기본 사용
/// var categoryDropdown = new UTKMultiSelectDropdown();
/// categoryDropdown.Label = "카테고리 선택";
/// categoryDropdown.SetOptions(new List<string> { "과일", "채소", "육류", "유제품" });
///
/// // 선택 변경 이벤트
/// categoryDropdown.OnSelectionChanged += (indices, values) => {
/// Debug.Log($"선택된 개수: {values.Count}");
/// Debug.Log($"선택 항목: {string.Join(", ", values)}");
/// };
///
/// // 생성자로 한 번에 설정
/// var tagDropdown = new UTKMultiSelectDropdown(
/// "태그",
/// new List<string> { "중요", "긴급", "검토 필요", "완료" }
/// );
///
/// // 기본값 설정 (인덱스로)
/// tagDropdown.SetSelectedIndices(new List<int> { 0, 1 });
///
/// // 기본값 설정 (값으로)
/// tagDropdown.SetSelectedValues(new List<string> { "중요", "긴급" });
///
/// // 전체 선택/해제
/// tagDropdown.SelectAll();
/// tagDropdown.ClearSelection();
/// </code>
/// <para><b>UXML에서 사용:</b></para>
/// <code>
/// <!-- 기본 드롭다운 -->
/// <utk:UTKMultiSelectDropdown label="카테고리"
/// choices="과일,채소,육류,유제품" />
///
/// <!-- 기본값 지정 (인덱스로) -->
/// <utk:UTKMultiSelectDropdown label="태그"
/// choices="중요,긴급,검토 필요,완료"
/// selected-indices="0,1" />
///
/// <!-- Placeholder 지정 -->
/// <utk:UTKMultiSelectDropdown label="옵션"
/// choices="옵션1,옵션2,옵션3"
/// placeholder="선택하세요" />
/// </code>
/// </code>
/// </example>
[UxmlElement]
public partial class UTKMultiSelectDropdown : VisualElement, IDisposable
{
#region Constants
private const string USS_PATH = "UIToolkit/Dropdown/UTKMultiSelectDropdownUss";
private const string DEFAULT_PLACEHOLDER = "Select";
#endregion
#region Fields
private bool _disposed;
private Label? _labelElement;
private VisualElement? _inputContainer;
private Label? _displayLabel;
private VisualElement? _dropdownIconContainer;
private UTKLabel? _dropdownIcon;
private VisualElement? _popupContainer;
private ScrollView? _optionsScrollView;
private string _label = "";
private List<string> _choices = new();
private HashSet<int> _selectedIndices = new();
private string _placeholder = DEFAULT_PLACEHOLDER;
private bool _isEnabled = true;
private bool _isPopupOpen;
private StyleSheet? _loadedUss;
// 메모리 누수 방지: 생성된 체크박스와 핸들러 추적
private readonly List<(UTKCheckBox checkBox, Action<bool> handler)> _checkBoxHandlers = new();
#endregion
#region Events
/// <summary>선택 변경 이벤트 (선택된 인덱스 목록, 선택된 값 목록)</summary>
public event Action<List<int>, List<string>>? OnSelectionChanged;
#endregion
#region Properties
/// <summary>라벨 텍스트</summary>
[UxmlAttribute("label")]
public string Label
{
get => _label;
set
{
_label = value;
if (_labelElement != null)
{
_labelElement.text = value;
_labelElement.style.display = string.IsNullOrEmpty(value)
? DisplayStyle.None
: DisplayStyle.Flex;
}
}
}
/// <summary>선택 가능한 옵션 목록</summary>
[UxmlAttribute("choices")]
public List<string> Choices
{
get => _choices;
set
{
_choices = value ?? new List<string>();
_selectedIndices.Clear();
RebuildOptions();
UpdateDisplayText();
}
}
/// <summary>선택된 인덱스 목록</summary>
public List<int> SelectedIndices
{
get => _selectedIndices.OrderBy(x => x).ToList();
}
/// <summary>선택된 값 목록</summary>
public List<string> SelectedValues
{
get => _selectedIndices
.OrderBy(x => x)
.Where(i => i >= 0 && i < _choices.Count)
.Select(i => _choices[i])
.ToList();
}
/// <summary>아무것도 선택되지 않았을 때 표시할 텍스트</summary>
[UxmlAttribute("placeholder")]
public string Placeholder
{
get => _placeholder;
set
{
_placeholder = value;
UpdateDisplayText();
}
}
/// <summary>활성화 상태</summary>
[UxmlAttribute("is-enabled")]
public bool IsEnabled
{
get => _isEnabled;
set
{
_isEnabled = value;
SetEnabled(value);
EnableInClassList("utk-multiselect-dropdown--disabled", !value);
}
}
#endregion
#region Constructor
public UTKMultiSelectDropdown() : base()
{
UTKThemeManager.Instance.ApplyThemeToElement(this);
_loadedUss = Resources.Load<StyleSheet>(USS_PATH);
if (_loadedUss != null)
{
styleSheets.Add(_loadedUss);
}
CreateUI();
SetupEvents();
SubscribeToThemeChanges();
}
public UTKMultiSelectDropdown(string label, List<string>? choices = null) : this()
{
Label = label;
if (choices != null)
{
Choices = choices;
}
}
#endregion
#region Setup
private void CreateUI()
{
AddToClassList("utk-multiselect-dropdown");
// 라벨
_labelElement = new Label(_label);
_labelElement.AddToClassList("utk-multiselect-dropdown__label");
_labelElement.style.display = string.IsNullOrEmpty(_label)
? DisplayStyle.None
: DisplayStyle.Flex;
Add(_labelElement);
// 입력 컨테이너
_inputContainer = new VisualElement();
_inputContainer.AddToClassList("utk-multiselect-dropdown__input");
Add(_inputContainer);
// 표시 라벨
_displayLabel = new Label(_placeholder);
_displayLabel.AddToClassList("utk-multiselect-dropdown__display");
_inputContainer.Add(_displayLabel);
// 드롭다운 아이콘 컨테이너 (회전 시 위치 고정용)
_dropdownIconContainer = new VisualElement();
_dropdownIconContainer.AddToClassList("utk-multiselect-dropdown__icon-container");
_inputContainer.Add(_dropdownIconContainer);
// 드롭다운 아이콘 (Material Icons 사용)
_dropdownIcon = new UTKLabel(UTKMaterialIcons.ArrowDropDown, 24);
_dropdownIcon.AddToClassList("utk-multiselect-dropdown__icon");
_dropdownIconContainer.Add(_dropdownIcon);
// 팝업 컨테이너
_popupContainer = new VisualElement();
_popupContainer.AddToClassList("utk-multiselect-dropdown__popup");
_popupContainer.style.display = DisplayStyle.None;
Add(_popupContainer);
// 옵션 스크롤뷰
_optionsScrollView = new ScrollView(ScrollViewMode.Vertical);
_optionsScrollView.AddToClassList("utk-multiselect-dropdown__options");
_popupContainer.Add(_optionsScrollView);
}
private void SetupEvents()
{
// 입력 컨테이너 클릭 시 팝업 토글
_inputContainer?.RegisterCallback<ClickEvent>(OnInputClicked);
// 외부 클릭 감지를 위한 루트 패널 이벤트
RegisterCallback<AttachToPanelEvent>(OnAttachedToPanel);
RegisterCallback<DetachFromPanelEvent>(OnDetachedFromPanel);
}
private void SubscribeToThemeChanges()
{
UTKThemeManager.Instance.OnThemeChanged += OnThemeChanged;
RegisterCallback<DetachFromPanelEvent>(_ =>
{
UTKThemeManager.Instance.OnThemeChanged -= OnThemeChanged;
});
}
private void OnThemeChanged(UTKTheme theme)
{
UTKThemeManager.Instance.ApplyThemeToElement(this);
}
#endregion
#region Event Handlers
private void OnInputClicked(ClickEvent evt)
{
if (!_isEnabled) return;
_isPopupOpen = !_isPopupOpen;
if (_popupContainer != null)
{
if (_isPopupOpen)
{
OpenPopup();
}
else
{
ClosePopup();
}
}
EnableInClassList("utk-multiselect-dropdown--open", _isPopupOpen);
evt.StopPropagation();
}
private void OpenPopup()
{
if (_popupContainer == null || _inputContainer == null || panel == null) return;
// 아이콘 변경 (회전 대신 다른 아이콘 사용)
if (_dropdownIcon is UTKLabel iconLabel)
{
iconLabel.SetMaterialIcon(UTKMaterialIcons.ArrowDropUp);
}
// 팝업을 루트로 이동
if (_popupContainer.parent != panel.visualTree)
{
_popupContainer.RemoveFromHierarchy();
panel.visualTree.Add(_popupContainer);
UTKThemeManager.Instance.ApplyThemeToElement(_popupContainer);
if (_loadedUss != null)
{
_popupContainer.styleSheets.Add(_loadedUss);
}
foreach (var (checkBox, handler) in _checkBoxHandlers)
{
UTKThemeManager.Instance.ApplyThemeToElement(checkBox);
}
}
// 드롭다운의 월드 위치 계산
var inputBounds = _inputContainer.worldBound;
_popupContainer.style.position = Position.Absolute;
_popupContainer.style.left = inputBounds.x;
_popupContainer.style.top = inputBounds.yMax + 2; // 2px 간격
_popupContainer.style.width = inputBounds.width;
_popupContainer.style.display = DisplayStyle.Flex;
}
private void OnAttachedToPanel(AttachToPanelEvent evt)
{
if (panel != null)
{
panel.visualTree.RegisterCallback<PointerDownEvent>(OnPanelPointerDown, TrickleDown.TrickleDown);
}
}
private void OnDetachedFromPanel(DetachFromPanelEvent evt)
{
if (panel != null)
{
panel.visualTree.UnregisterCallback<PointerDownEvent>(OnPanelPointerDown, TrickleDown.TrickleDown);
}
}
private void OnPanelPointerDown(PointerDownEvent evt)
{
if (!_isPopupOpen) return;
var target = evt.target as VisualElement;
if (target == null) return;
// 입력 컨테이너 클릭 확인
if (_inputContainer != null && target.FindCommonAncestor(_inputContainer) == _inputContainer)
{
return; // 입력 영역 클릭이면 무시
}
// 팝업 컨테이너 클릭 확인 (팝업이 루트로 이동했으므로 직접 확인)
if (_popupContainer != null && target.FindCommonAncestor(_popupContainer) == _popupContainer)
{
return; // 팝업 내부 클릭이면 무시
}
// 외부 클릭이면 팝업 닫기
ClosePopup();
}
private void OnOptionToggled(int index, bool isChecked)
{
if (isChecked)
{
_selectedIndices.Add(index);
}
else
{
_selectedIndices.Remove(index);
}
UpdateDisplayText();
OnSelectionChanged?.Invoke(SelectedIndices, SelectedValues);
}
#endregion
#region Methods
/// <summary>
/// 옵션 목록 설정
/// </summary>
public void SetOptions(List<string> options)
{
Choices = options;
}
/// <summary>
/// 인덱스로 선택 설정 (알림 발생)
/// </summary>
public void SetSelectedIndices(List<int> indices, bool notify = true)
{
_selectedIndices.Clear();
foreach (var index in indices)
{
if (index >= 0 && index < _choices.Count)
{
_selectedIndices.Add(index);
}
}
RebuildOptions();
UpdateDisplayText();
if (notify)
{
OnSelectionChanged?.Invoke(SelectedIndices, SelectedValues);
}
}
/// <summary>
/// 값으로 선택 설정 (알림 발생)
/// </summary>
public void SetSelectedValues(List<string> values, bool notify = true)
{
var indices = new List<int>();
foreach (var value in values)
{
var index = _choices.IndexOf(value);
if (index >= 0)
{
indices.Add(index);
}
}
SetSelectedIndices(indices, notify);
}
/// <summary>
/// 모든 항목 선택
/// </summary>
public void SelectAll()
{
var allIndices = Enumerable.Range(0, _choices.Count).ToList();
SetSelectedIndices(allIndices, notify: true);
}
/// <summary>
/// 모든 선택 해제
/// </summary>
public void ClearSelection()
{
SetSelectedIndices(new List<int>(), notify: true);
}
private void ClosePopup()
{
_isPopupOpen = false;
// 아이콘 복원
if (_dropdownIcon is UTKLabel iconLabel)
{
iconLabel.SetMaterialIcon(UTKMaterialIcons.ArrowDropDown);
}
if (_popupContainer != null)
{
_popupContainer.style.display = DisplayStyle.None;
// 팝업을 원래 위치(드롭다운 내부)로 되돌림
if (_popupContainer.parent != this)
{
_popupContainer.RemoveFromHierarchy();
Add(_popupContainer);
// 원래 스타일 복원
_popupContainer.style.position = Position.Absolute;
_popupContainer.style.left = 0;
_popupContainer.style.right = 0;
_popupContainer.style.top = Length.Percent(100);
_popupContainer.style.width = StyleKeyword.Auto;
}
}
EnableInClassList("utk-multiselect-dropdown--open", false);
}
private void RebuildOptions()
{
if (_optionsScrollView == null) return;
// 기존 체크박스 이벤트 정리 및 Dispose
ClearCheckBoxes();
_optionsScrollView.Clear();
for (int i = 0; i < _choices.Count; i++)
{
var index = i; // 클로저 캡처 방지
var optionContainer = new VisualElement();
optionContainer.AddToClassList("utk-multiselect-dropdown__option");
var checkBox = new UTKCheckBox(_choices[i], _selectedIndices.Contains(i));
checkBox.AddToClassList("utk-multiselect-dropdown__toggle");
// 핸들러 생성 및 등록
Action<bool> handler = (isOn) =>
{
OnOptionToggled(index, isOn);
};
checkBox.OnValueChanged += handler;
// 체크박스와 핸들러를 함께 추적
_checkBoxHandlers.Add((checkBox, handler));
// 마우스 호버 이벤트
optionContainer.RegisterCallback<MouseEnterEvent>(_ =>
{
optionContainer.AddToClassList("utk-multiselect-dropdown__option--hover");
});
optionContainer.RegisterCallback<MouseLeaveEvent>(_ =>
{
optionContainer.RemoveFromClassList("utk-multiselect-dropdown__option--hover");
});
optionContainer.Add(checkBox);
_optionsScrollView.Add(optionContainer);
}
}
private void ClearCheckBoxes()
{
foreach (var (checkBox, handler) in _checkBoxHandlers)
{
checkBox.OnValueChanged -= handler;
checkBox.Dispose();
}
_checkBoxHandlers.Clear();
}
private void UpdateDisplayText()
{
if (_displayLabel == null) return;
if (_selectedIndices.Count == 0)
{
_displayLabel.text = _placeholder;
_displayLabel.AddToClassList("utk-multiselect-dropdown__display--placeholder");
}
else
{
var selectedValues = SelectedValues;
_displayLabel.text = string.Join(", ", selectedValues);
_displayLabel.RemoveFromClassList("utk-multiselect-dropdown__display--placeholder");
}
}
#endregion
#region IDisposable
public void Dispose()
{
if (_disposed) return;
_disposed = true;
// 체크박스 이벤트 정리
ClearCheckBoxes();
UTKThemeManager.Instance.OnThemeChanged -= OnThemeChanged;
OnSelectionChanged = null;
_inputContainer?.UnregisterCallback<ClickEvent>(OnInputClicked);
if (panel != null)
{
panel.visualTree.UnregisterCallback<PointerDownEvent>(OnPanelPointerDown);
}
}
#endregion
}
}

2
Assets/Scripts/UVC/UIToolkit/Dropdown/UTKMultiSelectDropdown.cs.meta Normal file
View File

@@ -0,0 +1,2 @@
fileFormatVersion: 2
guid: 8f3f5663c7d4cdd40875201e91f710bc

2
Assets/Scripts/UVC/UIToolkit/Property/Views/UTKBoolPropertyItemView.cs
View File

@@ -18,7 +18,7 @@ namespace UVC.UIToolkit
/// parent.Add(view);
///
/// // UXML에서 사용
/// &lt;utk:UTKBoolPropertyItemView label="활성화" value="true" /&gt;
/// <utk:UTKBoolPropertyItemView label="활성화" value="true" />
/// </code>
/// </summary>
[UxmlElement]

2
Assets/Scripts/UVC/UIToolkit/Property/Views/UTKColorPropertyItemView.cs
View File

@@ -198,7 +198,7 @@ namespace UVC.UIToolkit
{
_colorPreview?.SetEnabled(!isReadOnly);
if (_hexField != null) _hexField.isReadOnly = isReadOnly;
if (_pickerButton != null) _pickerButton.IsEnabled = !isReadOnly;
if (_pickerButton != null) _pickerButton.style.display = isReadOnly ? DisplayStyle.None : DisplayStyle.Flex;
}
#endregion

2
Assets/Scripts/UVC/UIToolkit/Property/Views/UTKColorStatePropertyItemView.cs
View File

@@ -185,7 +185,7 @@ namespace UVC.UIToolkit
protected override void OnReadOnlyStateChanged(bool isReadOnly)
{
if (_pickerButton != null) _pickerButton.IsEnabled = !isReadOnly;
if (_pickerButton != null) _pickerButton.style.display = isReadOnly ? DisplayStyle.None : DisplayStyle.Flex;
if (_colorPreview != null) _colorPreview.SetEnabled(!isReadOnly);
}
#endregion

2
Assets/Scripts/UVC/UIToolkit/Property/Views/UTKDatePropertyItemView.cs
View File

@@ -176,7 +176,7 @@ namespace UVC.UIToolkit
protected override void OnReadOnlyStateChanged(bool isReadOnly)
{
if (_dateField != null) _dateField.isReadOnly = isReadOnly;
if (_pickerButton != null) _pickerButton.IsEnabled = !isReadOnly;
if (_pickerButton != null) _pickerButton.style.display = isReadOnly ? DisplayStyle.None : DisplayStyle.Flex;
}
#endregion

6
Assets/Scripts/UVC/UIToolkit/Property/Views/UTKDateRangePropertyItemView.cs
View File

@@ -119,8 +119,6 @@ namespace UVC.UIToolkit
// Fallback: UXML에서 못 찾으면 생성
if (_valueContainer != null)
{
_valueContainer.style.flexDirection = FlexDirection.Row;
if (_startField == null)
{
_startField = new UTKInputField { name = "start-field" };
@@ -243,8 +241,8 @@ namespace UVC.UIToolkit
{
if (_startField != null) _startField.isReadOnly = isReadOnly;
if (_endField != null) _endField.isReadOnly = isReadOnly;
if (_startPickerBtn != null) _startPickerBtn.IsEnabled = !isReadOnly;
if (_endPickerBtn != null) _endPickerBtn.IsEnabled = !isReadOnly;
if (_startPickerBtn != null) _startPickerBtn.style.display = isReadOnly ? DisplayStyle.None : DisplayStyle.Flex;
if (_endPickerBtn != null) _endPickerBtn.style.display = isReadOnly ? DisplayStyle.None : DisplayStyle.Flex;
}
#endregion

2
Assets/Scripts/UVC/UIToolkit/Property/Views/UTKDateTimePropertyItemView.cs
View File

@@ -176,7 +176,7 @@ namespace UVC.UIToolkit
protected override void OnReadOnlyStateChanged(bool isReadOnly)
{
if (_dateTimeField != null) _dateTimeField.isReadOnly = isReadOnly;
if (_pickerButton != null) _pickerButton.IsEnabled = !isReadOnly;
if (_pickerButton != null) _pickerButton.style.display = isReadOnly ? DisplayStyle.None : DisplayStyle.Flex;
}
#endregion

6
Assets/Scripts/UVC/UIToolkit/Property/Views/UTKDateTimeRangePropertyItemView.cs
View File

@@ -119,8 +119,6 @@ namespace UVC.UIToolkit
// Fallback: UXML에서 못 찾으면 생성
if (_valueContainer != null)
{
_valueContainer.style.flexDirection = FlexDirection.Row;
if (_startField == null)
{
_startField = new UTKInputField { name = "start-field" };
@@ -243,8 +241,8 @@ namespace UVC.UIToolkit
{
if (_startField != null) _startField.isReadOnly = isReadOnly;
if (_endField != null) _endField.isReadOnly = isReadOnly;
if (_startPickerBtn != null) _startPickerBtn.IsEnabled = !isReadOnly;
if (_endPickerBtn != null) _endPickerBtn.IsEnabled = !isReadOnly;
if (_startPickerBtn != null) _startPickerBtn.style.display = isReadOnly ? DisplayStyle.None : DisplayStyle.Flex;
if (_endPickerBtn != null) _endPickerBtn.style.display = isReadOnly ? DisplayStyle.None : DisplayStyle.Flex;
}
#endregion

2
Assets/Scripts/UVC/UIToolkit/Property/Views/UTKFloatPropertyItemView.cs
View File

@@ -21,7 +21,7 @@ namespace UVC.UIToolkit
/// parent.Add(view);
///
/// // UXML에서 사용
/// &lt;utk:UTKFloatPropertyItemView label="속도" value="1.5" use-slider="true" min-value="0" max-value="10" /&gt;
/// <utk:UTKFloatPropertyItemView label="속도" value="1.5" use-slider="true" min-value="0" max-value="10" />
/// </code>
///
/// <para><b>사용법 (Data 바인딩):</b></para>

4
Assets/Scripts/UVC/UIToolkit/Property/Views/UTKIntPropertyItemView.cs
View File

@@ -26,8 +26,8 @@ namespace UVC.UIToolkit
/// stepperView.Step = 5;
///
/// // UXML에서 사용
/// &lt;utk:UTKIntPropertyItemView label="수량" value="10" use-slider="true" min-value="0" max-value="100" /&gt;
/// &lt;utk:UTKIntPropertyItemView label="개수" value="1" use-stepper="true" step="1" /&gt;
/// <utk:UTKIntPropertyItemView label="수량" value="10" use-slider="true" min-value="0" max-value="100" />
/// <utk:UTKIntPropertyItemView label="개수" value="1" use-stepper="true" step="1" />
/// </code>
/// </summary>
[UxmlElement]

2
Assets/Scripts/UVC/UIToolkit/Property/Views/UTKStringPropertyItemView.cs
View File

@@ -19,7 +19,7 @@ namespace UVC.UIToolkit
/// parent.Add(view);
///
/// // UXML에서 사용
/// &lt;utk:UTKStringPropertyItemView label="이름" value="홍길동" is-multiline="false" /&gt;
/// <utk:UTKStringPropertyItemView label="이름" value="홍길동" is-multiline="false" />
/// </code>
/// </summary>
[UxmlElement]

8
Assets/Scripts/UVC/UIToolkit/UTKThemeManager.cs
View File

@@ -101,11 +101,11 @@ namespace UVC.UIToolkit
/// <para><b>커스텀 스타일 값 가져오기:</b></para>
/// <code>
/// // USS 변수에서 색상 값 읽기
/// var primaryColor = new CustomStyleProperty&lt;Color&gt;("--color-btn-primary");
/// var primaryColor = new CustomStyleProperty<Color>("--color-btn-primary");
/// var color = UTKThemeManager.GetColor(myElement, primaryColor, Color.blue);
///
/// // USS 변수에서 float 값 읽기
/// var spacing = new CustomStyleProperty&lt;float&gt;("--space-m");
/// var spacing = new CustomStyleProperty<float>("--space-m");
/// var value = UTKThemeManager.GetFloat(myElement, spacing, 8f);
/// </code>
///
@@ -123,7 +123,7 @@ namespace UVC.UIToolkit
/// UTKThemeManager.Instance.OnThemeChanged += OnThemeChanged;
///
/// // 패널에서 분리될 때 구독 해제
/// RegisterCallback&lt;DetachFromPanelEvent&gt;(_ =&gt;
/// RegisterCallback<DetachFromPanelEvent>(_ =>
/// {
/// UTKThemeManager.Instance.OnThemeChanged -= OnThemeChanged;
/// });
@@ -139,7 +139,7 @@ namespace UVC.UIToolkit
/// <para><b>테마 전환 버튼 구현:</b></para>
/// <code>
/// var themeToggle = new UTKButton("테마 전환", UTKButtonVariant.Secondary);
/// themeToggle.clicked += () =&gt;
/// themeToggle.clicked += () =>
/// {
/// UTKThemeManager.Instance.ToggleTheme();
/// var icon = UTKThemeManager.Instance.IsDarkTheme