====== 위치 가이드======
컴포넌트 위치 기능에 대한 예시 화면이다.
관련 속성으로 x, y, right, bottom, anchor가 있다.
관련 API는 getrect, setrect, getleft, setleft, gettop, settop, getright, setright, getbottom, setbottom, setlefttop가 있다.
===== 예시 =====
템플릿 위치: /HTML5/COMPONENT/COMMON/pos_basic
템플릿 파일
* [[xf5projecthome>template/screen/HTML5/COMPONENT/COMMON/pos_basic.xml|pos_basic.xml]]
* [[xf5projecthome>template/screen/HTML5/COMPONENT/COMMON/pos_basic.js|pos_basic.js]]
* [[xf5projecthome>template/template.html?xframe_screen_url=/HTML5/COMPONENT/COMMON/pos_basic|새창으로 실행]]
echo '';
echo '';
echo '';
==== 화면 스크립트 ====
function btn_size_on_click(objInst)
{
// 컴포넌트 위치 정보 표시
screen.alert("NAME = " + objInst.getname() +
"\nLEFT(부모 기준) = " + objInst.getleft() +
"\nTOP(부모 기준) = " + objInst.gettop() +
"\nRIGHT(부모 기준) = " + objInst.getright(true) +
"\nRIGHT(컴포넌트 좌측 기준) = " + objInst.getright() +
"\nBOTTOM(부모 기준) = " + objInst.getbottom(true) +
"\nBOTTOM(컴포넌트 상단 기준) = " + objInst.getbottom());
}
// "getrect" 버튼 이벤트
function btn_getrect_on_click(objInst)
{
var rect_arr;
// 부모 기준 좌측/상단 좌표 및 컴포넌트 좌측 기준 우측/하단 좌표를 배열로 구함
rect_arr = btn_pos.getrect();
// 부모 기준 좌측/상단 좌표 및 컴포넌트 좌측 기준 우측/하단 좌표 표시
fld_getrectL.settext(rect_arr[0]);
fld_getrectT.settext(rect_arr[1]);
fld_getrectR.settext(rect_arr[2]);
fld_getrectB.settext(rect_arr[3]);
}
// "setrect" 버튼 이벤트
function btn_setrect_on_click(objInst)
{
// 버튼 컴포넌트 위치/크기 설정
btn_pos.setrect(
fld_setrectL.gettext(), // 부모 기준 좌측 좌표
fld_setrectT.gettext(), // 부무 기준 상단 좌표
fld_setrectR.gettext(), // 컴포넌트 좌측 기준 우측 좌표
fld_setrectB.gettext() // 컴포넌트 상단 기준 하단 좌표
);
}
// "setleft" 버튼 이벤트
function btn_setleft_on_click(objInst)
{
// 부모 기준 좌측 위치 설정
btn_left.setleft(fld_setleft.gettext());
}
// "settop" 버튼 이벤트
function btn_settop_on_click(objInst)
{
// 부모 기준 상단 위치 설정
btn_top.settop(fld_settop.gettext());
}
// "setright" 버튼 이벤트
function btn_setright_on_click(objInst)
{
// 부모 기준 우측 위치 설정
btn_right.setright(fld_setright.gettext());
}
// "setbottom" 버튼 이벤트
function btn_setbottom_on_click(objInst)
{
// 부모 기준 하단 위치 설정
btn_bottom.setbottom(fld_setbottom.gettext());
}
// "setlefttop" 버튼 이벤트
function btn_setlefttop_on_click(objInst)
{
// 버튼 컨트롤 우측/상단위치 지정
btn_topleft.setlefttop(
fld_lefttop_left.gettext(), // 보모 기준 좌측 좌표
fld_lefttop_top.gettext() // 부모 기준 상단 좌표
);
}