1
2
3
4
5
6
7
8
9
10
var imgs = new RealGridJS.ImageList("images1", "/resource/image/icon/");
    imgs.addUrls([
        "be.png",
        "br.png",
        "fr.png",
        "de.png",
        "us.png"
    ]);

gridView.registerImageList(imgs);

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
//아이콘 리스트 및 이름 생성
var imgs = new RealGridJS.ImageList("images1", "/resource/image/icon/");
    imgs.addUrls([
        "be.png",
        "br.png",
        "fr.png",
        "de.png",
        "us.png"
    ]);

gridView.registerImageList(imgs);

//이미지 리스트에서 사용할 이름 설정
gridView.setColumnProperty("left","imageList", "images1");

//아이콘 타입의 렌더러 설정
gridView.setColumnProperty("left","renderer",{type:"icon"}); 

//아이콘 적용 설정
gridView.setColumnProperty("left","styles", {
    textAlignment: "near",
    iconIndex: 0,
    iconLocation: "left",
    iconAlignment: "center",
    iconOffset: 4,
    iconPadding: 4
});

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
//아이콘 표시방법 동일

//dynamicStyles 생성
var iconStyles = [{
    criteria: "value='Belgium'",
    styles: "iconIndex=0"
}, {
    criteria: "value='Brazil'",
    styles: "iconIndex=1"
}, {
    criteria: "value='France'",
    styles: "iconIndex=2"
}, {
    criteria: "value='Germany'",
    styles: "iconIndex=3"
}, {
    criteria: "value='USA'",
    styles: "iconIndex=4"
}, {
    criteria: "values['Country'] is empty",
    styles: "iconIndex=-1"
}];

//dynamicStyle 적용
gridView.setColumnProperty("right","dynamicStyles", iconStyles);

1
2
3
4
renderer: {
    type: "icon",
    textVisible: false //텍스트 표시 여부
}