82 lines
6.5 KiB
XML
82 lines
6.5 KiB
XML
<?xml version="1.0" encoding="utf-8"?>
|
|
<UXML xmlns="UnityEngine.UIElements" xmlns:utk="UVC.UIToolkit">
|
|
<Style src="../UTKSampleCommon.uss" />
|
|
<Style src="UTKButtonSample.uss" />
|
|
|
|
<VisualElement class="utk-sample-container">
|
|
<!-- Description -->
|
|
<Label class="utk-sample-desc" text="다양한 스타일의 버튼 컴포넌트" />
|
|
|
|
<!-- Filled Buttons -->
|
|
<VisualElement class="utk-sample-section">
|
|
<Label class="utk-sample-section__title" text="Filled Buttons" />
|
|
<VisualElement class="utk-sample-row">
|
|
<utk:UTKButton name="btn-primary" text="Primary" variant="Primary" />
|
|
<utk:UTKButton name="btn-normal" text="Normal" variant="Normal" />
|
|
<utk:UTKButton name="btn-danger" text="Danger" variant="Danger" />
|
|
</VisualElement>
|
|
</VisualElement>
|
|
|
|
<!-- Outline Buttons -->
|
|
<VisualElement class="utk-sample-section">
|
|
<Label class="utk-sample-section__title" text="Outline Buttons" />
|
|
<VisualElement class="utk-sample-row">
|
|
<utk:UTKButton name="btn-outline-primary" text="Outline Primary" variant="OutlinePrimary" />
|
|
<utk:UTKButton name="btn-outline-normal" text="Outline Normal" variant="OutlineNormal" />
|
|
<utk:UTKButton name="btn-outline-danger" text="Outline Danger" variant="OutlineDanger" />
|
|
</VisualElement>
|
|
</VisualElement>
|
|
|
|
<!-- Icon Only -->
|
|
<VisualElement class="utk-sample-section">
|
|
<Label class="utk-sample-section__title" text="Icon Only" />
|
|
<VisualElement class="utk-sample-row" name="icon-only-row">
|
|
<!-- Icons will be set via C# code -->
|
|
</VisualElement>
|
|
</VisualElement>
|
|
|
|
<!-- Ghost -->
|
|
<VisualElement class="utk-sample-section">
|
|
<Label class="utk-sample-section__title" text="Ghost" />
|
|
<VisualElement class="utk-sample-row" name="ghost-row">
|
|
<utk:UTKButton name="btn-ghost" text="Ghost" variant="Ghost" />
|
|
<!-- Ghost icon button will be set via C# -->
|
|
</VisualElement>
|
|
</VisualElement>
|
|
|
|
<!-- Text -->
|
|
<VisualElement class="utk-sample-section">
|
|
<Label class="utk-sample-section__title" text="Text (Label/Icon Only)" />
|
|
<VisualElement class="utk-sample-row" name="text-row">
|
|
<utk:UTKButton name="btn-text-only" text="Text Only" variant="Text" />
|
|
<utk:UTKButton name="btn-text-link" text="Link Style" variant="Text" />
|
|
<!-- Text with icon will be set via C# -->
|
|
</VisualElement>
|
|
</VisualElement>
|
|
|
|
<!-- Text Icon Only (Circle) -->
|
|
<VisualElement class="utk-sample-section">
|
|
<Label class="utk-sample-section__title" text="Text Icon Only (Circle)" />
|
|
<VisualElement class="utk-sample-row" name="text-icon-only-row">
|
|
<!-- Circle icon buttons will be set via C# -->
|
|
</VisualElement>
|
|
</VisualElement>
|
|
|
|
<!-- Disabled -->
|
|
<VisualElement class="utk-sample-section">
|
|
<Label class="utk-sample-section__title" text="Disabled" />
|
|
<VisualElement class="utk-sample-row">
|
|
<utk:UTKButton name="btn-disabled-primary" text="Disabled" variant="Primary" is-enabled="false" />
|
|
<utk:UTKButton name="btn-disabled-normal" text="Disabled" variant="Normal" is-enabled="false" />
|
|
<utk:UTKButton name="btn-disabled-text" text="Disabled" variant="Text" is-enabled="false" />
|
|
</VisualElement>
|
|
</VisualElement>
|
|
|
|
<!-- Code Sample -->
|
|
<VisualElement class="utk-code-sample-container">
|
|
<utk:UTKCodeBlock title="C#" code="// 기본 버튼 생성 var btn = new UTKButton("확인"); btn.OnClicked += () => Debug.Log("클릭됨!"); // 텍스트와 Material Icon이 있는 버튼 var saveBtn = new UTKButton("저장", UTKMaterialIcons.Save, UTKButton.ButtonVariant.Primary); // 텍스트와 아이콘 (크기 지정) var largeIconBtn = new UTKButton("설정", UTKMaterialIcons.Settings, UTKButton.ButtonVariant.Primary, 28); var smallImageBtn = new UTKButton("닫기", UTKImageIcons.BtnClose22, UTKButton.ButtonVariant.Danger, 20); // Image Icon 설정 var imgBtn = new UTKButton("닫기"); imgBtn.SetImageIcon(UTKImageIcons.BtnClose22); imgBtn.SetImageIconByName("icon_setting_22"); // 비동기 아이콘 설정 await btn.SetMaterialIconAsync(UTKMaterialIcons.Search); await btn.SetImageIconAsync(UTKImageIcons.IconSetting22); // 아이콘만 표시하는 버튼 var iconOnlyBtn = new UTKButton { IconOnly = true }; iconOnlyBtn.SetMaterialIcon(UTKMaterialIcons.Close); // 버튼 스타일 변형 btn.Variant = UTKButton.ButtonVariant.Primary; btn.Variant = UTKButton.ButtonVariant.Danger; btn.Variant = UTKButton.ButtonVariant.Ghost; // 버튼 크기 btn.Size = UTKButton.ButtonSize.Small; btn.Size = UTKButton.ButtonSize.Large; // 아이콘 제거 btn.ClearIcon();" />
|
|
<utk:UTKCodeBlock title="UXML" code="<!-- 기본 버튼 --> <utk:UTKButton text="확인" /> <!-- 버튼 변형 --> <utk:UTKButton text="저장" variant="Primary" /> <utk:UTKButton text="삭제" variant="Danger" /> <utk:UTKButton text="취소" variant="Ghost" /> <utk:UTKButton text="링크" variant="Text" /> <!-- 외곽선 변형 --> <utk:UTKButton text="확인" variant="OutlinePrimary" /> <utk:UTKButton text="삭제" variant="OutlineDanger" /> <!-- 크기 변형 --> <utk:UTKButton text="작은 버튼" size="Small" /> <utk:UTKButton text="큰 버튼" size="Large" /> <!-- 아이콘만 표시 --> <utk:UTKButton icon="&#xe5cd;" icon-only="true" /> <!-- 비활성화 --> <utk:UTKButton text="비활성화" is-enabled="false" /> <!-- 외곽선 굵기 --> <utk:UTKButton text="두꺼운 외곽선" border-width="2" />" />
|
|
</VisualElement>
|
|
</VisualElement>
|
|
</UXML>
|