78 lines
5.6 KiB
Plaintext
78 lines
5.6 KiB
Plaintext
<!--
|
|
ISOPChart.uxml - ISOP 간트 차트 레이아웃
|
|
|
|
[개요]
|
|
간트 차트(Gantt Chart) UI의 메인 레이아웃을 정의합니다.
|
|
3단 타임라인 헤더(월/주/일)와 작업 목록을 표시합니다.
|
|
|
|
[UI 구조]
|
|
Root
|
|
├── gantt-container - 간트 차트 전체 컨테이너
|
|
│ ├── header-container - 헤더 영역 (스크롤 시 고정)
|
|
│ │ └── header - 헤더 내부 (수평 배치)
|
|
│ │ ├── header-title - 작업 레벨(L1~L8) 컬럼 헤더
|
|
│ │ └── header-timeline - 타임라인 헤더 (3단)
|
|
│ │ ├── timeline-months - 월 레이어 (최상단)
|
|
│ │ ├── timeline-weeks - 주 레이어 (중간)
|
|
│ │ └── timeline-days - 일 레이어 (최하단)
|
|
│ └── content-scroll - 스크롤 가능한 작업 목록 영역
|
|
│ └── content - 작업 행(ISOPChartRow)들이 추가되는 컨테이너
|
|
└── expand-btn - 차트 확장 버튼 (전체화면)
|
|
|
|
[3단 헤더 구조]
|
|
- timeline-months: "2025년 1월", "2025년 2월" 등 월 단위
|
|
- timeline-weeks: "1주", "2주" 등 주 단위
|
|
- timeline-days: "1", "2", "3" 등 일 단위 (각 셀 18px)
|
|
|
|
[동적 렌더링]
|
|
- ISOPChart.cs에서 JSON 데이터 기반으로 content에 행 추가
|
|
- 스크롤 시 header의 left 위치를 조정하여 타임라인 동기화
|
|
|
|
[연관 파일]
|
|
- ISOPChart.uss : 스타일시트
|
|
- ISOPChartRow.uxml : 개별 작업 행 템플릿
|
|
- ISOPChart.cs : C# 컨트롤러
|
|
|
|
[사용되는 리소스]
|
|
- Fonts/Pretendard/Pretendard-Bold : 헤더 제목 폰트
|
|
- SHI/Images/btn_expand_36 : 확장 버튼 이미지
|
|
-->
|
|
<ui:UXML xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements" noNamespaceSchemaLocation="../../../../../UIElementsSchema/UIElements.xsd" editor-extension-mode="False">
|
|
<Style src="project://database/Assets/Resources/SHI/Modal/ISOP/ISOPChart.uss?fileID=7433441132597879392&guid=c17ad7709c5ace142abe32467f16815b&type=3#ISOPChart" />
|
|
|
|
<!-- 간트 차트 전체 컨테이너 -->
|
|
<ui:VisualElement name="gantt-container" style="flex-grow: 1; height: 100%; flex-direction: column; min-width: 0; overflow: hidden;">
|
|
|
|
<!-- 헤더 영역: 스크롤해도 상단에 고정됨 -->
|
|
<ui:VisualElement name="header-container" style="flex-grow: 0; height: 56px; min-height: 56px; flex-shrink: 0; overflow: hidden;">
|
|
<!-- 헤더 내부: 작업 컬럼 + 타임라인 수평 배치 -->
|
|
<ui:VisualElement name="header" style="flex-grow: 0; height: 56px; flex-direction: row; min-height: 56px; flex-shrink: 0; position: relative;">
|
|
|
|
<!-- 작업 레벨 헤더: L1~L8 컬럼 (너비는 C#에서 동적 설정) -->
|
|
<ui:VisualElement name="header-title" style="flex-grow: 0; background-color: rgb(123, 183, 226); flex-shrink: 0; height: 56px; border-bottom-width: 1px; border-bottom-color: rgb(141, 141, 141);">
|
|
<ui:Label text="BLOCK STRUCTURE" style="margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0; padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; -unity-font-definition: resource('Fonts/Pretendard/Pretendard-Bold'); color: rgb(34, 34, 34); font-size: 12px; -unity-text-align: middle-center; width: 100%; height: 100%;" />
|
|
</ui:VisualElement>
|
|
|
|
<!-- 타임라인 헤더: 3단 구조 (월/주/일) -->
|
|
<ui:VisualElement name="header-timeline" style="flex-grow: 0; flex-shrink: 0; background-color: rgb(240, 240, 240); border-left-width: 1px; border-left-color: rgb(255, 255, 255); height: 56px; border-bottom-width: 1px; border-bottom-color: rgb(141, 141, 141);">
|
|
<!-- 월 레이어 (최상단, 18px 높이) -->
|
|
<ui:VisualElement name="timeline-months" style="flex-grow: 0; height: 18px; flex-shrink: 0; flex-direction: row; border-bottom-width: 1px; border-bottom-color: rgb(255, 255, 255);" />
|
|
<!-- 주 레이어 (중간, 18px 높이) -->
|
|
<ui:VisualElement name="timeline-weeks" style="flex-grow: 0; height: 18px; flex-shrink: 0; flex-direction: row; border-bottom-color: rgb(255, 255, 255); border-bottom-width: 1px;" />
|
|
<!-- 일 레이어 (최하단, 18px 높이) -->
|
|
<ui:VisualElement name="timeline-days" style="flex-grow: 0; height: 18px; flex-direction: row; flex-shrink: 0;" />
|
|
</ui:VisualElement>
|
|
</ui:VisualElement>
|
|
</ui:VisualElement>
|
|
|
|
<!-- 작업 목록 스크롤 영역: 수평/수직 스크롤 지원 -->
|
|
<ui:ScrollView name="content-scroll" mode="VerticalAndHorizontal" horizontal-scroller-visibility="Auto" vertical-scroller-visibility="Auto" style="flex-grow: 1;">
|
|
<!-- 작업 행 컨테이너: ISOPChartRow 인스턴스들이 여기에 추가됨 -->
|
|
<ui:VisualElement name="content" style="flex-grow: 0; flex-shrink: 0; flex-direction: column;" />
|
|
</ui:ScrollView>
|
|
</ui:VisualElement>
|
|
|
|
<!-- 확장 버튼: 간트 차트를 전체 화면으로 확장 -->
|
|
<ui:Button name="expand-btn" style="position: absolute; top: 20px; left: 10px; width: 36px; height: 36px; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0; padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; border-top-width: 0; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; background-color: rgba(255, 255, 255, 0); background-image: resource('SHI/Images/btn_expand_36');" />
|
|
</ui:UXML>
|