====== 그리드 이미지 정렬 가이드 ======
그리드 데이터부의 아이템의 이미지 표시 위치 정렬 기능에 대한 예시 화면이다.
관련 속성으로 image_horzalign, image_vertalign이 있다.
관련 컬럼 API로 getcolumnimagehorzalign, setcolumnimagehorzalign, getcolumnimagevertalign, setcolumnimagevertalign이 있다.
관련 아이템 API로 getitemimagehorzalign, setitemimagehorzalign, getitemimagevertalign, setitemimagevertalign이 있다.
===== 예시 =====
템플릿 위치: /HTML5/COMPONENT/GRID/grid_image_align
템플릿 파일
* [[xf5projecthome>template/screen/HTML5/COMPONENT/GRID/grid_image_align.xml|grid_image_align.xml]]
* [[xf5projecthome>template/screen/HTML5/COMPONENT/GRID/grid_image_align.js|grid_image_align.js]]
* [[xf5projecthome>template/template.html?xframe_screen_url=/HTML5/COMPONENT/GRID/grid_image_align|새창으로 실행]]
echo '';
echo '';
echo '';
==== 화면 스크립트 ====
function screen_on_load()
{
}
// "setitemimagehorzalign" 버튼 이벤트
function btn_setitemimagehorzalign_on_click(objInst)
{
var item_image_horz_align;
// 그리드 아이템 이미지 수평 정렬 정보를 구함
item_image_horz_align = this.grd_item_image_align.getitemimagehorzalign(0, 0);
if (item_image_horz_align == -1) {
// 그리드 아이템별 이미지 수직 정렬 설정이 없는 경우, 그리드 컬럼 이미지 수평 정렬 정보를 구함
item_image_horz_align = this.grd_item_image_align.getcolumnimagehorzalign(0);
}
// 아이템 이미지 수평 정렬 값 계산
item_image_horz_align = item_image_horz_align + 1;
if (item_image_horz_align > 2) { item_image_horz_align = 0; }
// 그리드 아이템 이미지 수평 정렬 값 설정
this.grd_item_image_align.setitemimagehorzalign(0, 0, item_image_horz_align);
}
// "setitemimagevertalign" 버튼 이벤트
function btn_setitemimagevertalign_on_click(objInst)
{
var item_image_vert_align;
// 그리드 아이템 이미지 수직 정렬 정보를 구함
item_image_vert_align = this.grd_item_image_align.getitemimagevertalign(0, 0);
if (item_image_vert_align == -1) {
// 그리드 아이템별 이미지 수직 정렬 설정이 없는 경우, 그리드 컬럼 이미지 수직 정렬 정보를 구함
item_image_vert_align = this.grd_item_image_align.getcolumnimagevertalign(0);
}
// 아이템 이미지 수직 정렬 값 계산
item_image_vert_align = item_image_vert_align + 1;
if (item_image_vert_align > 2) { item_image_vert_align = 0; }
// 그리드 아이템 이미지 수직 정렬 값 설정
this.grd_item_image_align.setitemimagevertalign(0, 0, item_image_vert_align);
}