SMART datagrid v1.4 > Examples

Back  Forward

CellStyles  Example

CellStyle은 데이터셀 별로 설정할 수 있는 스타일과 편집 속성들의 집합이다. 주의할 것은, 컬럼 스타일이나 동적 스타일과 달리 CellStyle은 적용 기준이 데이터행과 필드들이다. 그렇다고 설정되는 CellStyle들이 DataSet에 저장되는 것은 아니다. 하나의 데이터셋에 두 개의 그리드가 연결됐을 때, 한 그리드에 적용된 CellStyle이 나머지 그리드에 적용되지는 않는다. 다른 스타일과 마찬가지로 CellStyle 역시 View layer에서 관리된다. 

서로 간에 장단점이 있을 수 있으므로 상황에 맞는 적정한 스타일링 방식을 찾아야 한다. 

CellStyle을 데이터셀에 적용하기 위해서는 먼저 그리드에 등록해야 한다. 각각의 CellStyle은 style id로 접근된다. 

Code -1
    grdMain.registerCellStyle('style01', {
        "background": "#880000",
        "color": "#ffffff"
    });

데이터셀 단위로 셀스타일을 적용하기 위해서는 GridBase.setCellStyle 메쏘드를 사용한다. dataRowIndex 매개변수가 0보다 작은 값이면 행 추가 시 추가되는 행에 적용된다. 

field 에는 필드인덱스나 이름을 지정할 수 있는데, -1로 지정하면 dataRowIndex 행의 모든 셀에 적용된다. 

붉은 바탕 흰 글자  푸른 바탕 흰 글자 

Grid - 1
rows

GridBase.setCellStyles로 복수개의 행에 대해 설정할 수도 있다. 

노란 바탕 붉은 글자 

복수 행과 복수 필드에 설정할 수도 있다. 

초록 바탕 흰 글자 


복수 셀들에 개별적 스타일 지정하기

GridBase.setCellStyleRows를 이용해서 DataSet의 여러 행의 여러 필드에 대해 각각 다른 스타일을 지정할 수도 있다. 아래 예제 처럼 하나 이상의 스타일 id 값을 갖는 배열의 배열이나, Json 객체의 배열을 field map과 같이 지정하면 된다. 

필드 맵에 스타일 배열의 어느 위치 값을 데이터셋의 어떤 필드에 적용할 지를 설정한다. 자세한 설명은 setCellStyleRows 도움말 토픽을 참조한다. 

배열의 배열로 지정한다 

Json 배열로 지정한다 

Grid - 2
rows

소스보기 JSP 

See Also
CellStyle
GridBase.registerCellStyle
GridBase.setCellStyle
Examples
Column Styles
Row Styles