UIElement
GetObject
오브젝트 반환
Example
let ui = vizcore.UIElement;
let click = () => {
console.log("Clicked");
//버튼 클릭 이벤트
}
//버튼 오브젝트 반환
let button1 = ui.GetObject(ui.Enum.OBJECT_TYPE.BUTTON);
button1.id = "button1"; //버튼 ID
button1.text = "button1_text"; //버튼 텍스트
button1.icon.normal = './Resource/normal.png' //기본 아이콘 이미지
button1.icon.check = './Resource/check.png'; //체크 아이콘 이미지
button1.event.click = click; //클릭 시 이벤트
button1.status.visible = true; //버튼 보이기/ 숨기기
button1.status.enable = true; //버튼 활성/ 비활성화
button1.status.check = false; //버튼 체크/ 체크해제
//버튼 오브젝트 반환
let button2 = ui.GetObject(ui.Enum.OBJECT_TYPE.BUTTON);
button2.id = "button2"; //버튼 ID
button2.text = "button2_text"; //버튼 텍스트
button2.icon.normal = './Resource/normal.png'; //기본 아이콘 이미지
button2.icon.check = './Resource/check.png'; //체크 아이콘 이미지
button2.event.click = click; //클릭 시 이벤트
button2.style.type = ui.Enum.BUTTON_STYLE.NORMAL; //버튼 스타일
button2.style.size = ui.Enum.OBJECT_SIZE.SMALL; //버튼 크기
button2.status.visible = true; //버튼 보이기/ 숨기기
button2.status.enable = true; //버튼 활성/ 비활성화
button2.status.check = false; //버튼 체크/ 체크해제
button2.subButtons = [button1]; //버튼 하위 서브 버튼
//그룹 오브젝트 반환 -리본
let group = ui.GetObject(ui.Enum.OBJECT_TYPE.GROUP);
group.id = "group"; //그룹 ID
group.text = "group_text"; //그룹 텍스트
group.style.size = ui.Enum.OBJECT_SIZE.SMALL; //버튼 크기
group.buttons = [button] //그룹 하위 버튼
//탭 오브젝트 반환 -리본
let tab = ui.GetObject(ui.Enum.OBJECT_TYPE.TAB);
tab.id = "tab"; //탭 ID
tab.text = "tab_text"; //탭 텍스트
tab.groups = [group]; //탭 하위 그룹
Parameters
Name | Type | Description |
|---|
objectType | Enum | vizcore.UIElement.Enum.OBJECT_TYPE.TAB vizcore.UIElement.Enum.OBJECT_TYPE.GROUP vizcore.UIElement.Enum.OBJECT_TYPE.BUTTON |
Returns
Name | Type | Description |
|---|
id | String | 오브젝트 (탭/ 그룹/ 버튼) ID |
text | String | 리본 = 텍스트(탭/ 그룹/ 버튼) / 툴바 = 툴팁 텍스트 |
icon | String | 버튼 아이콘 관련 속성(기본, 체크 시) |
icon.normal | String | 기본 버튼 아이콘 이미지 |
icon.check | String | 체크 버튼 아이콘 이미지 |
event.click | Object | 버튼 클릭 이벤트 |
style | Enum | 스타일 관련 속성 (오브젝트의 타입, 크기) |
style.type | Enum | 오브젝트 타입 - vizcore.UIElement.Enum.BUTTON_STYLE.NORMAL; - vizcore.UIElement.Enum.BUTTON_STYLE.CHECK; |
style.size | Enum | 오브젝트 크기 - vizcore.UIElement.Enum.OBJECT_SIZE.LARGE; - vizcore.UIElement.Enum.OBJECT_SIZE.SMALL; |
status | Boolean | 버튼의 상태 관련 속성 (보이기/ 숨기기, 활성화/ 비활성화, 체크/체크 해제) |
status.visible | Boolean | 버튼 보이기/ 숨기기 |
status.enable | Boolean | 버튼 활성화/ 비활성화 |
status.check | Boolean | 버튼 체크/ 체크해제 |
groups | Array | 탭의 하위 그룹 배열 |
buttons | Array | 그룹의 하위 버튼 배열 |
subButtons | Array | 버튼의 하위 서브 버튼 배열 ＊툴바 전용 |
SetType
UI Type 설정
Example
// 리본바
vizcore.UIElement.SetType(vizcore.UIElement.Enum.UI_TYPE.RIBBONBAR);
// 툴바
vizcore.UIElement.SetType(vizcore.UIElement.Enum.UI_TYPE.TOOLBAR);
// UI 비활성화
vizcore.UIElement.SetType(vizcore.UIElement.Enum.UI_TYPE.NONE);
Parameters
Name | Type | Description |
|---|
objectType | Enum | 리본바 : vizcore.UIElement.Enum.UI_TYPE.RIBBONBAR 툴바 : vizcore.UIElement.Enum.UI_TYPE.TOOLBAR UI 비활성화 : vizcore.UIElement.Enum.UI_TYPE.NONE |
SetMode
테마 변경
Example
// 라이트 테마
vizcore.UIElement.SetMode(vizcore.UIElement.Enum.THEME_TYPE.LIGHT);
// 다크 테마
vizcore.UIElement.SetMode(vizcore.UIElement.Enum.THEME_TYPE.DARK);
// 라이트 & 오렌지 테마
vizcore.UIElement.SetMode(vizcore.UIElement.Enum.THEME_TYPE.LIGHT_ORANGE);
// 다크 & 오렌지 테마
vizcore.UIElement.SetMode(vizcore.UIElement.Enum.THEME_TYPE.DARK_ORANGE);
Parameters
Name | Type | Description |
|---|
objectType | Enum | 라이트 테마 : vizcore.UIElement.Enum.THEME_TYPE.LIGHT 다크 테마 : vizcore.UIElement.Enum.THEME_TYPE.DRAK 라이트 & 오렌지 테마 : vizcore.UIElement.Enum.THEME_TYPE.LIGHT_ORANGE 다크 & 오렌지 테마 : vizcore.UIElement.Enum.THEME_TYPE.DARK_ORANGE |
Last modified: 07 October 2024