−목차

그리드 이미지 정렬 가이드

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

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

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

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

예시

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

템플릿 파일

화면 스크립트

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
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);
}