Grid 컴포넌트 가이드
Grid 컴포넌트 개요
이 장에서는 XFrame 에서 제공하는 Grid 컴포넌트에 대해서 기술합니다. 이 장에서 기술하는 내용은 아래와 같습니다.
- 그리드 컴포넌트 개요
- 그리드 컴포넌트 아키텍처
Grid 컴포넌트 개요
Grid 컴포넌트는 XFrame 솔루션에서 제공하는 컴포넌트로 다건의 데이터를 표시하기 위한 컴포넌트이다. 아래의 그림처럼 XFrame-DevStudio 의 오브젝트 창에 표시되어 있으며, 좌측부터 일반 그리드, 멀티 라인 그리드, 트리 그리드이다.
그리드 컴포넌트는 기능 구성에 따라 아래와 같이 세가지 그리드가 제공된다.
구분 | 설명 |
---|---|
일반 그리드 |
|
멀티 라인 그리드 |
|
트리 그리드 |
|
그리드 컴포넌트 구성 요소 이름
그리그 컴포넌트 구성 요소 이름은 아래의 그림과 같다. 그리드의 각각의 셀은 “Item”이란 이름으로 명명되어 있으며, 속성 및 API 명에 특정 아이템에 대한 속성 및 API 명에는 “Item”이란 이름이 들어간다.
그리드 컴포넌트 속성 및 이벤트 아키텍처
그리드 컴포넌트는 아래의 그림과 같이 속성 및 이벤트가 정의되어 있다.
구분 | 설명 |
---|---|
1 | 그리드 컴포넌트 자체에 대한 속성 및 이벤트를 정의한다. |
2 | 그리드 컴포넌트의 컬럼별 헤더부에 대한 속성을 정의한다. |
3 | 그리드 컴포넌트의 컬럼별 데이터부에 대한 속성 및 이벤트를 정의한다. |
그리드 통계
이 장에서는 XFrame 에서 제공하는 그리드 통계 기능에 대해서 기술합니다. 이 장에서 기술하는 내용은 아래와 같습니다.
- 그리드 통계 개요
- 그리드 통계 정의 방식
- 그리드 통계 아키텍처
- 통계/소계 관련 API
그리드 통계 개요
그리드는 조회된 데이터를 기준으로 다양한 통계 기능 및 소계 기능을 속성 지정 방식 및 API 호출 방식을 통해서 제공한다.
그리드 통계 계산 방식
그리드는 아래와 같은 통계 계산 방식을 제공한다
구분 | 설명 |
---|---|
합계 | 데이터의 합계를 계산한다. |
평균 | 데이터의 평균을 계산한다. |
개수 | 데이터의 개수를 계산한다. |
최소값 | 데이터의 최소값을 계산한다. |
최대값 | 데이터의 최대값을 계산한다. |
컬럼별 정의 |
|
사용자 정의 | 통계 정보를 표현하기 위한 틀만 표시하고, API 호출을 통해서 설정한 값을 표시한다. |
그리드 통계 표시 방식
그리드의 통계 표시 방식은 아래의 표와 같다.
구분 | 설명 | 속성 |
---|---|---|
통계행 |
| statistics_row |
통계열 |
| statistics_column |
소계행 |
| mid_statistics |
그리드 통계 데이터 계산 조건
그리드는 통계 정보 계산시 아래와 같은 기준으로 처리된다. 각 기준은 순서를 가지고 있으며, 모든 조건이 만족되어야만 통계 데이터가 표시된다.
순서 | 설명 |
---|---|
1 | 그리드 통계 계산 방식이 6(사용자 정의)가 아님 |
2 | 그리드 데이터부 “statiscs_show” 속성 또는 “midstatistcis_show” 속성이 true임 |
3 | 그리드 데이터부의 “data_type” 속성이 0(숫자)임 |
4 | 그리드의 통계 계산 방식이 컬럼별 정의이고, 그리드 컬럼 데이터부 “statisticsshow_type”이 5(사용자 정의)가 아님 |
그리드 통계/소계 정의 방법
그리드 통계/소계 정보 정의 방법은 그리드 통계 표시 방식에 따라 구분되어 설정된다.
통계행 지정 방법
통계행 지정 방법은 아래의 그림과 같이 그리드의 “statistics_row” 속성을 통해서 지정된다.
속성을 선택하면 아래의 그림과 같이 통계 정보를 설정하는 창이 표시된다.
통계 창에 표시되는 각각의 속성에 대한 설명은 아래의 표와 같다.
순서 | 설명 |
---|---|
operation | 그리드 통계 계산 방식을 지정한다. |
title |
|
fore_color, back_color | 통계행의 전경색과 배경색을 지정한다. |
header_forecolor header_backcolor |
|
header_horzalign header_vertalign | “Title” 속성에 지정한 문자열에 대한 수평/수직 정렬 방식을 지정한다. |
column_showtitle |
|
통계열 지정 방법
통계행 지정 방법은 아래의 그림과 같이 그리드의 “statistics_column” 속성을 통해서 지정된다.
속성을 선택하면 아래의 그림과 같이 통계 정보를 설정하는 창이 표시된다.
통계 창에 표시되는 대부분의 속성은 통계행과 동일하며, 컬럼 통계에만 있는 속성에 대한 설명은 아래의 표와 같다.
순서 | 설명 |
---|---|
column_width | 그리드 통계 열이 표시될 컬럼의 너비 (단위: pixel) |
pattern | 그리드 통계 열에 표시될 데이터에 대한 패턴 |
places | 그리드 통계 열에 표시될 데이터에 대한 소수점 위치 |
소계행 지정 방법
통계행 지정 방법은 아래의 그림과 같이 그리드의 “mid_statistics” 속성을 통해서 지정된다.
속성을 선택하면 아래의 그림과 같이 통계 정보를 설정하는 창이 표시되고, 각각의 속성은 통계행의 정보 설정창에 대한 설명을 참조한다.
컬럼별 통계/소계 관련 속성
컬럼별 통계/소계 관련 속성은 아래의 그림처럼, 그리드 컬럼의 데이터부 속성에서 정보를 설정하며, 각 속성에 대한 설명은 아래의 표와 같다.
속성 | 설명 |
---|---|
data_type |
|
pattern, places |
|
statistics_type, midstatistics_type |
|
statistics_show, midstatistics_show |
|
base_midstatistics |
|
통계 아키텍처
그리드 통계 아키텍처
그리드 통계/소계에 대한 설정 방식중, 컬럼별 정의 및 사용자 정의 방식에 대한 아키텍처는 아래의 그림과 같다.
구분 | 설명 |
---|---|
1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
그리드 소계 아키텍처
그리드 소계는 그리드 데이터 표시부에 함께 표시되며, 소계 기준 컬럼으로 설정된 컬럼의 값(base_midstatistics 속성이 true 인 컬럼)을 기준으로 소계를 계산하는 방식이다. 소계는 통계와 비슷하지만 다음과 같은 특징을 가진다.
- 그리드 소계는 API 호출을 통해 동적으로 추가할 수 있다.
- 그리드 소계는 API 호출을 통해 동적으로 삭제할 수 있다.
- 그리드의 소계를 동적으로 생성/삭제하는 경우에는 그리드 컴포넌트의 refresh 함수를 호출해야 반영된다.
- 그리드 소계 계산 기준은 내부적으로 리스트로 관리되며, API 호출을 통해 동적으로 추가/삭제시 추가되거나 삭제된다.
- 그리드 소계는 사용자 정의 방식을 지원하지 않는다.
사용자 정의 통계 아키텍처
사용자 정의 통계는 통계 정보를 그리드 내부에서 자동으로 계산하는 표시하는 방식이 아니라, 스크립트 로직에 의해서 계산된 값을 표시하는 방식이다. 사용자 정의 통계 방식을 지정하는 방식을 아래와 같이 통계행 지정 방식 및 컬럼별 지정 방식을 통해서 제공된다.
방식 | 설명 |
---|---|
통계행 지정 방식 | 그리드 통계 행중 특정 통계행 전체를 사용자 지정 방식으로 설정하는 방법 |
컬럼별 지정 방식 | 그리드 통계 계산 방식을 컬럼별 정의로 설정하고, 그리드 컬럼 데이터부 statisticsshow_type 속성을 5(사용자 정의)로 지정하는 방식 |
통계/소계 관련 API
통계 및 소계 정보를 동적으로 설정하고, 관리하기 위한 API 는 아래의 표와 같다. 각 API 에 대한 자세한 설명은 xFrameDevStudio 에서 “도움말” → “xFrame@DevStudio 도움말”을 참조한다.
통계 관련 API
방식 | 설명 |
---|---|
clearallstatuserrow | 그리드 통계행 중 '사용자 정의'로 설정된 로우들의 내용을 모두 지운다. |
clearstatuserrow | 그리드 '사용자 정의'로 설정된 통계행의 특정 로우의 내용을 삭제한다. |
getcolumnstatrowtype | 해당 컬럼의 통계 타입 값을 반환한다. |
getstatcolumncount | 그리드에서 통계열의 개수를 반환한다. |
getstatisticscoltext | 그리드 통계열 중 특정 아이템의 데이터를 반환한다. |
getstatisticsrowtext | 그리드 통계행 중 특정 아이템의 데이터를 반환한다. |
getstatrowcount | 그리드에서 통계행의 개수를 반환한다. |
setcolumnstatrowtype | 해당 컬럼의 통계 타입 값을 설정한다. |
setstatcolumntitle | 통계열의 제목을 설정한다. |
setstatrowtitle | 통계행의 제목을 설정한다. |
setstatrowtitlecolumn | 통계행의 타이틀을 보여줄 컬럼을 지정한다. |
setstatuserrowtext | 그리드 통계 정보중 사용자 정의로 설정된 특정 아이템의 데이터를 설정한다. |
소계 관련 API
방식 | 설명 |
---|---|
addstatmid | 그리드에 소계를 동적으로 추가한다. |
deleteallstatmid | 해당 그리드에 설정된 소계 정보 모두를 삭제한다. |
getcolumnmidstattype | 해당 컬럼의 midstatistics_type의 값을 반환한다. |
getstatmidcount | 해당 그리드에 설정되어 있는 소계 정보의 갯수를 반환한다. |
getstatmidrowfirst | 그리드 데이터중 소계행의 첫번째를 구한다. |
getstatmidrownext | 그리드 데이터중 기준소계행의 다음에 나타나는 소계행을 구한다. |
ismidstatrow | 그리드의 특정 로우가 소계행으로 사용되고 있는지를 체크한다. |
setcolumnmidstattype | 해당 컬럼의 소계 타입(midstatistics_type)을 설정한다. |
setmidstatbackcolor | 소계행의 배경색상을 지정한다. |
setmidstatistics | 그리드에 소계행의 종류를 설정한다. |
데이터 및 입력 타입
이 장에서는 XFrame 에서 제공하는 그리드의 데이터 및 입력 타입 기능에 대해서 기술합니다. 이 장에서 기술하는 내용은 아래와 같습니다.
- 그리드 데이터 및 입력 타입 개요
- 그리드 데이터 타입
- 그리드 입력 타입
- 그리드 데이터 및 입력 타입 관련 API
- 그리드 아이템 데이터 및 입력 타입
그리드 입력 및 데이터 타입 개요
그리드는 각 컬럼별로 입력 타입 및 데이터 타입을 속성 지정을 통해서 결정한다. 그리드 컬럼의 데이터 타입은 해당 컬럼에 입력될 수 있는 데이터의 종류를 지정하며, 그리드 컬럼의 입력 타입은 해당 컬럼에 데이터 입력시 어떤 방식으로 사용할 것인지를 지정한다.
그리드의 입력 및 데이터 타입은 아래의 그림과 같이 컬럼의 데이터부 속성에서 정의된다.
그리드 데이터 타입
그리드 데이터 타입은 아래의 표와 같다.
구분 | 설명 |
---|---|
0:숫자 | 숫자 입력이 가능하다. |
1:영문 | 영문 및 숫자 입력이 가능하다. |
2:한글 | 숫자, 영문, 한글 입력이 가능하다. |
그리드 데이터 타입 속성과 관련된 속성 정보 관계
그리드 데이터 타입은 아래와 같이 컬럼의 속성과 연관 관계를 가진다.
컬럼의 특정 속성이 데이터 타입의 속성과 연결되어 있는 것들은 해당 컬럼의 데이터 속성이 매칭이 되야 정상적으로 반영된다.
그리드 입력 타입
그리드 입력 타입은 아래의 표와 같다.
구분 | 설명 |
---|---|
0:editbox |
|
1:checkbox |
|
2:combobox |
|
3:calendar |
|
그리드 입력 타입 속성과 관련된 속성 정보 관계
그리드 입력 타입은 아래와 같이 컬럼의 속성과 연관 관계를 가진다.
컬럼의 특정 속성이 입력 타입의 속성과 연결되어 있는 것들은 해당 컬럼의 입력 타입 속성이 매칭이 되야 정상적으로 반영된다.
그리드 데이터 및 입력 타입 관련 API
그리드의 각 컬럼에 관련된 데이터 타입 및 입력 타입은 아래의 표와 같이 getcolumn~, setcolumn~으로 시작되는 API 를 통해서 현재 설정 상태를 조회하거나, 동적으로 변경할 수 있다. 각 API 에 대한 자세한 설명은 xFrameDevStudio 에서 “도움말” → “xFrame@DevStudio 도움말”을 참조한다.
함수명 | 설명 |
---|---|
getcolumn~ | 각각의 컬럼에 설정되어 있는 상태를 반환한다. |
setcolumn~ | 각가의 컬럼에 대한 속성을 변경한다. |
그리드 아이템 데이터 및 입력 타입
그리드의 각 셀을 의미하는 그리드 아이템은 기본적으로 아이템이 속한 컬럼의 속성을 기준으로 데이터 타입 및 입력 타입이 결정된다.
XFrame 은 그리드의 각 아이템별로 컬럼 속성과 다른 속성을 동적으로 변경할 수 있도록 API 를 제공하며, API 호출을 통해서 동적으로 변경할 수 있는 주요 속성은 아래와 같다.
속성 | API |
---|---|
체크 박스 타이틀 | setitemcheckboxtitle |
색상 | setitembackcolor, setitembackcolorrange setitemforecolor, setitemforecolorrange |
폰트 및 이미지 경로 | seitemfont, setitemimage |
입력 타입 | setiteminputtype |
최대 길이 및 패턴 | setitemmaxlength, setitempattern |
코드 정보 | setitempicklist |
소수점 위치 | setitemplaces |
각 API 에 대한 자세한 설명은 xFrameDevStudio 에서 “도움말” → “xFrame@DevStudio 도움말”을 참조한다.