스타일
컬럼 동적 스타일
컬럼 동적 스타일은 styleCallback이 지정된 컬럼에만 값에 따라 스타일이 적용됩니다.
<RGDataColumn
name={"Age"}
fieldName={"Age"}
header={{text:"NUMBER"}}
editor={{type:"number"}}
width={200}
styleCallback={
function(grid, cell){
return {style: {background: "#ff00ff"}}
}
}
/>js방식으로 컬럼 동적 스타일 적용하기
const onInitialized = (grid: RealGrid.GridView) => {
//컬럼 동적 스타일
grid.columnByName("Age").styleCallback = function(grid, cell){
return {style: {background: "#ff0000"}}
}
}행 동적 스타일
행 동적 스타일은 특정 값에 따라 행 전체에 스타일을 적용하고 싶을때 사용합니다.
<RealGridReact
ref={gridRef}
onInitialized={onInitialized}
rowStyleCallback={function(grid, item, fixed) {
const ret = {styleName: ""};
ret.styleName = "blue-color"
return ret
}}
/>js방식으로 행 동적 스타일 적용하기
const onInitialized = (grid: RealGrid.GridView) => {
grid.setRowStyleCallback(function(grid, item, fixed) {
const ret = {styleName: ""};
ret.styleName = "blue-color"
return ret
})
}셀 동적 스타일
셀 동적 스타일은 개별 셀들에게 스타일 적용하고 싶을때 사용합니다.
<RealGridReact
ref={gridRef}
onInitialized={onInitialized}
cellStyleCallback={function(grid, dataCell){
var ret = {styleName: ""}
ret.styleName = "blue-color"
return ret;
}}
/>js방식으로 셀 동적 스타일 적용하기
const onInitialized = (grid: RealGrid.GridView) => {
grid.setCellStyleCallback(function(grid, dataCell) {
var ret = {styleName: ""}
ret.styleName = "blue-color"
return ret;
})
}