====== 트리메뉴 기본 가이드 ====== 이 화면은 트리메뉴 컴포넌트에 대한 샘플 화면이다. 트리메뉴 컴포넌트는 메뉴를 트리형태로 표현하기 위한 컴포넌트이다. 연결된 데이터셋을 기준으로 아이템을 표시한다. 초기 로딩후 데이터셋이 변경되어도 트리메뉴는 실시간으로 반영되지 않는다.(트리메뉴의 refresh API를 호출해야 반영된다) 하나의 아이템은 아이콘+텍스트+상태이미지로 이루어진다.(하위메뉴가 없는 아이템은 상태이미지가 표시되지 않는다) ===== 예시 ===== 템플릿 위치: /HTML5/COMPONENT/TREEMENU/treemenu_basic 템플릿 파일 * [[xf5projecthome>template/screen/HTML5/COMPONENT/TREEMENU/treemenu_basic.xml|treemenu_basic.xml]] * [[xf5projecthome>template/screen/HTML5/COMPONENT/TREEMENU/treemenu_basic.js|treemenu_basic.js]] * [[xf5projecthome>template/template.html?xframe_screen_url=/HTML5/COMPONENT/TREEMENU/treemenu_basic|새창으로 실행]] echo ''; echo ''; echo ''; ==== 화면 스크립트 ==== function screen_on_load() { screen.loadcss("./template/HTML5/COMPONENT/TREEMENU/treemenu_scrollbar_custom.css"); } function treemenu01_on_itemchange(objInst, prev_index, curr_index) { var msg1 = objInst.getname() + "_on_itemchange : " + prev_index + " => " + curr_index; console.log(msg1); factory.consoleprint(msg1); } function treemenu01_on_itemclick(objInst, index, depth, type) { var msg = ""; if (type == 1) { msg = "Icon Click"; } else if (type == 2) { msg = "Text Click"; } else if (type == 3) { msg = "Status Image Click"; } else { msg = "Item Click"; } var msg1 = objInst.getname() + "_on_itemclick : " + index + " , " + depth + " , " + msg; console.log(msg1); factory.consoleprint(msg1); }