Files
XRLib/Assets/Scripts/UVC/UIToolkit/ToolBar/CLAUDE.md
2026-02-19 18:40:37 +09:00

123 lines
4.2 KiB
Markdown

# UTKToolBar
UIToolkit 기반 툴바 컴포넌트입니다. 가로/세로 배치 전환을 지원하며, 4가지 버튼 타입과 구분선을 제공합니다.
## 구조
```
ToolBar/
├── Data/ # 데이터 레이어
│ ├── IUTKToolBarItem.cs # 아이템 인터페이스
│ ├── UTKToolBarButtonData.cs # 버튼 데이터 추상 클래스
│ ├── UTKToolBarStandardButtonData.cs
│ ├── UTKToolBarToggleButtonData.cs
│ ├── UTKToolBarRadioButtonData.cs
│ ├── UTKToolBarRadioButtonGroup.cs
│ ├── UTKToolBarExpandableButtonData.cs
│ └── UTKToolBarSeparatorData.cs
├── Items/ # View 아이템
│ ├── UTKToolBarButtonBase.cs # 버튼 View 추상 클래스
│ ├── UTKToolBarStandardButton.cs
│ ├── UTKToolBarToggleButton.cs
│ ├── UTKToolBarRadioButton.cs
│ ├── UTKToolBarExpandableButton.cs
│ └── UTKToolBarSeparator.cs
├── UTKToolBar.cs # 메인 View
├── UTKToolBarModel.cs # 데이터 모델 (팩토리)
└── UTKToolBarEnums.cs # 열거형, 이벤트 인자
```
## 버튼 타입
| 타입 | 설명 |
|------|------|
| **Standard** | 단순 클릭 버튼 |
| **Toggle** | On/Off 상태 전환 |
| **Radio** | 그룹 내 상호 배타적 선택 |
| **Expandable** | 서브 메뉴 확장 (Lazy Loading) |
| **Separator** | 시각적 구분선 |
## 사용법
### 기본 (View 직접 사용)
```csharp
// 1. 모델 생성
var model = new UTKToolBarModel();
model.AddStandardButton("저장", UTKMaterialIcons.Save);
model.AddSeparator();
model.AddToggleButton("그리드", false, UTKMaterialIcons.GridOn, UTKMaterialIcons.GridOff);
model.AddRadioButton("tool", "선택", true, UTKMaterialIcons.NearMe);
model.AddRadioButton("tool", "이동", false, UTKMaterialIcons.OpenWith);
// 2. View 생성 및 빌드
var toolbar = new UTKToolBar();
toolbar.Orientation = UTKToolBarOrientation.Horizontal;
parent.Add(toolbar);
toolbar.BuildToolBar(model);
// 3. 이벤트 구독
toolbar.OnAction += args => Debug.Log($"{args.Text}: {args.ActionType}");
// 4. 배치 방향 전환
toolbar.SetOrientation(UTKToolBarOrientation.Vertical);
```
### Controller 사용 (MonoBehaviour)
```csharp
var controller = gameObject.AddComponent<UTKToolBarController>();
var model = new UTKToolBarModel();
// ... 모델 설정 ...
controller.SetData(model);
controller.Initialize();
controller.OnAction += args => Debug.Log($"{args.Text}: {args.ActionType}");
```
### 확장 버튼 (서브 메뉴)
```csharp
var shapes = model.AddExpandableButton("도형", UTKMaterialIcons.Category, updateIconOnSelection: true);
shapes.SubButtons.Add(new UTKToolBarStandardButtonData { Text = "사각형", IconPath = UTKMaterialIcons.CropSquare, UseMaterialIcon = true });
shapes.SubButtons.Add(new UTKToolBarStandardButtonData { Text = "원형", IconPath = UTKMaterialIcons.Circle, UseMaterialIcon = true });
```
## API
### UTKToolBarModel
| 메서드 | 설명 |
|--------|------|
| `AddStandardButton()` | 일반 버튼 추가 |
| `AddToggleButton()` | 토글 버튼 추가 |
| `AddRadioButton()` | 라디오 버튼 추가 (자동 그룹 등록) |
| `AddExpandableButton()` | 확장 버튼 추가 |
| `AddSeparator()` | 구분선 추가 |
| `SetRadioButtonSelectionByText()` | 텍스트로 라디오 선택 |
| `SetToggleButtonStateByText()` | 텍스트로 토글 상태 변경 |
| `GetToggleButtonState()` | 토글 상태 조회 |
### UTKToolBar (View)
| 멤버 | 설명 |
|------|------|
| `Orientation` | 배치 방향 (Horizontal/Vertical) |
| `BuildToolBar(model)` | 모델로 툴바 빌드 |
| `ClearToolBar()` | 모든 아이템 제거 |
| `SetOrientation()` | 배치 방향 변경 |
| `OnAction` | 버튼 액션 이벤트 |
### 리소스 경로
```
Resources/UIToolkit/ToolBar/
├── UTKToolBar.uxml / UTKToolBarUss.uss
├── UTKToolBarButton.uxml / UTKToolBarButtonUss.uss
├── UTKToolBarToggleButton.uxml / UTKToolBarToggleButtonUss.uss
├── UTKToolBarExpandableButton.uxml / UTKToolBarExpandableButtonUss.uss
├── UTKToolBarSeparator.uxml / UTKToolBarSeparatorUss.uss
└── UTKToolBarSubMenu.uxml / UTKToolBarSubMenuUss.uss
```