====== 테이블뷰 DragDrop 기능 가이드 ======
이 화면은 테이블뷰 컴포넌트의 드래그&드랍 기능에 대한 샘플 화면이다.
컴포넌트 드랍 가능 여부는 테이블뷰 accept_drop 속성 및 테이블뷰 아이템의 accept_drop 속성을 통해서 허용 여부가 결정된다.
관련 속성으로 accept_drop이 있다.
관련 이벤트로 on_dropcomplete, on_dragenter, on_dragleave가 있다.
===== 예시 =====
템플릿 위치: /HTML5/COMPONENT/TABLEVIEW/tableview_dragdrop
템플릿 파일
* [[xf5projecthome>template/screen/HTML5/COMPONENT/TABLEVIEW/tableview_dragdrop.xml|tableview_dragdrop.xml]]
* [[xf5projecthome>template/screen/HTML5/COMPONENT/TABLEVIEW/tableview_dragdrop.js|tableview_dragdrop.js]]
* [[xf5projecthome>template/template.html?xframe_screen_url=/HTML5/COMPONENT/TABLEVIEW/tableview_dragdrop|새창으로 실행]]
echo '';
echo '';
echo '';
==== 화면 스크립트 ====
// 테이블뷰 드랍 완료 이벤트
function tview_on_dropcomplete(objInst, nRow, nColumn, src_screeninst, src_objinst)
{
// 컴포넌트 삭제 처리
src_objinst.destroy();
// 테이블뷰 아이템내 컴포넌트 새로 생성
this.tview.createobjectex(nRow, nColumn, XFD_CTRLKIND_PUSHBUTTON, {
"anchor": src_objinst.prop("anchor"),
"x": src_objinst.getleft(),
"y": src_objinst.gettop(),
"width": src_objinst.getwidth(),
"height": src_objinst.getheight(),
"text": nRow + "행 " + nColumn + "열",
"name": src_objinst.getname(),
"dragable": 1,
"on_click": "btn_dragdrop_on_click"
});
}
// 버튼 클릭 이벤트
function btn_dragdrop_on_click(objInst)
{
var tableview_pos;
// 컴포넌트의 테이블 뷰 아이템 위치를 표시
tableview_pos = objInst.gettableviewpos();
screen.alert("버튼 위치 - 행: " + tableview_pos.row + ", 열: " + tableview_pos.column);
}