그리드 이미지 정렬 가이드

그리드 데이터부의 아이템의 이미지 표시 위치 정렬 기능에 대한 예시 화면이다.

관련 속성으로 image_horzalign, image_vertalign이 있다.

관련 컬럼 API로 getcolumnimagehorzalign, setcolumnimagehorzalign, getcolumnimagevertalign, setcolumnimagevertalign이 있다.

관련 아이템 API로 getitemimagehorzalign, setitemimagehorzalign, getitemimagevertalign, setitemimagevertalign이 있다.

템플릿 위치: /HTML5/COMPONENT/GRID/grid_image_align

템플릿 파일

• grid_image_align.xml
• grid_image_align.js
• 새창으로 실행

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);
}