DevExpress QuantumGrid 사용법 005( Tutorial – 003 : 가장 기본적인 사용법 )

전장에 QuantumGrid의 Object Instpector의 내용을 중점적으로 알아 보려 했는데 실패하고 말았네요.
이번장은 이어서 Object Inspector의 내용, 이외에 퀀텀을 놓으면 생성되는 컬럼의 내용과 이들의 속성값(property의 값)을 변경하는 법에 대해서도 알아 보도록 하겠습니다.

이번 내용도 역시 본 제작자가 이동 또는 게시하지 않는 경우를 제외하고는 이곳 외에 다른곳에서 볼수 없습니다. 이를 어길시 정말 법적 제제가 가해질수 있습니다.

Tutorial – 001에서와 같이 화면을 구성하고 cxGrid.Levels.BandedTableView에 DataSource를 설정 하였습니다.

아래 내용은 제가 자주 설정하는 내용을 기준으로 간단한 설명을 하는것이고 기타 필요하다고 생각되는 내용에 대해서도 기술할 예정입니다. 매뉴얼이 아닌 관계로 전체적인 프로퍼티에 대해서는 기술하지 않습니다.

DataController
우선은 DataSource의 출력방법에 대해 간단히 설명 드리겠습니다.
QuantumGrid의 DBTableView 방식은 GridMode와 퀀텀그리드 자체 방식 2가지가 있습니다.

GridMode 는 DB를 출력하는 방법중 가장 기본적인 Grid방식으로 한 화면 또는 일정 갯수만큼을 가져와서 화면에 출력하는 방식입니다. 가장 쉬운 예로 Delphi이의 DBGrid를 예로 들겠습니다.
우선 Table에 레코드가 1000개 있다고 가정 하겠습니다. 이 Table을 DBGrid에 연결하면, 그리드는 Table에서 한 화면만큼만 데이타를 읽어와서 출력합니다.
그리드를 크기가 변경되거나 그리드의 내용이 Scroll되면 DBGrid는 다시 화면에 출력할 갯수만큼을 Table에서 가져와 화면에 출력합니다.
이런 방식은 Table에서 1000개의 내용을 모두 가져와야 하는 시스템의 부하를 줄이고 빠르게 편리하게 사용하기 위해 고안된 방법입니다.
하지만, 느린 네트웍이나 가져온 데이타를 재가공(Filter, Sort, 합계, Table 내용 찾기등 )등을 하려 하는경우 많은 제약이 따릅니다. TTable이나 TQuery를 제어해야 하는 경우도 생기게 됩니다.

QuantumGrid의 기본 출력방식은 GridMode처럼 화면 만큼을 가져오는것이 아니라 전체 내용을 모두 가져오게 됩니다. 따라서 처음 그리드가 출력될때 시스템에 따라 약간의 시간이 소요될수 있습니다. 최대의 단점이지요.
하지만, 일단 읽어온 데이타는 Memory Table에 저장되고 실제 Table과도 Sync가 됩니다.
또한 Memory Table에 모든 데이타를 다 가져와서 작업하므로 Sort, Filtering, Sum, Group등 원하는 작업을 빠른속도로 맘대로 처리가 가능합니다. 최대의 강점이 됩니다. 또한, Grid의 내용을 직접 수정한다해도 MemoryTable과 실제 DB의 Table이 Sync되어 있으므로 즉각적인 수정이 이루어 질수 있습니다.
따라서, 필자는 QauntumGrid의 기본 방식으로 구성 하려 합니다.
<< 실제로는 속도를 요하거나 Master Detail등과 같은 구조에서 많은 양의 데이타가 오고가는경우등은 GridMode와 적절히 혼용하는 경우도 있습니다. >>

OptionsView.ColumnAutoWidth : 그리드에 컬럼들을 꽉차게 배열합니다. 그리드의 크기가 변해도 그리드에 꽉차게 표현하지만 컴럼의갯수가 많거나 컬럼의 길이가 길어야 하는경우나 컬럼의 길이가 길어야 하는경우에는 사용하지 않는것이 좋겠습니다.

OptionsView.GroupByBox : Group Box의 내용을 표현할지 안할지 선택합니다.

True 인 경우

False인 경우

GroupBox가 없으면 사용자가 그룹을 지정할 수 없습니다.

OptionsView.Indicator : QauntumGrid는 기본적으로 Indicator가 화면에 나타나 있지 않습니다. Indicator를 나타내기 위한 설정입니다.
강좌 2번의 내용을 참고해 주시기 바랍니다.

OptionsSelection.InvertSelect : 선택한 Row를 색으로 표현합니다.

OptionsSelection.CellSelect : 선택한 Record의 현재 Focus 된 Cell의 색만 SelectColor와 다르게 나타냅니다. QauntumGrid는 기본적으로 이 프로퍼티를 True하여 직관적으로 보이게 합니다.
이외에도 좌우 스크롤도 편하고 IncSearch와도 연관 되어 있습니다.

OptionsData.Deleting : False
OptionsData.DeletingConfirmation :  False
OptionsData.Editing : False
OptionsData.Inserting : False
모두 false로 설정합니다. 그리드내에서 수정,삭제,추가등을 허용하지 않으려 하는 동작입니다. 하나씩 설정내용을 확인해 보시기 바랍니다.

 OptionBehavior.IncSearch : Incremental Search를 사용하기 위한 내용입니다. OptionsSelection.CellSelect가 활성화 되어 있는 경우 cell에서 값을 입력하면 값에 해당하는 내용을 찾아 줍니다.
하지만, 한글은 찾아주지 못합니다. 한글을 IncSearch로 찾는 방법은 없지만, 화면에 Editor를 올려놓고 값을 입력할때마다 OnChange 이벤트에서 코딩상으로 찾아 주는 방법이 있습니다. 다음장 정도에서 코딩으로 처리 하는 방법을 알아보도록 하겠습니다.

간단하게 위와 같은 프로퍼티를 변경하면 대체적으로 DBTableView의 내용을 사용하시는데 큰 불편함이 없습니다.
이제 각 컬럼의 내용을 Setting해보도록 하겠습니다.
우선 header의 title을 가운데 정렬로 모두 모아 보겠습니다.
Component Editor의 내용을 띄우고 Columns Tab을 선택한뒤에 모든 컬럼을 선택하고 프로퍼티의 HeaderAlignmentHorz과 HeaderAlignmentVert를 Center로 설정합니다.

이제 다시 모든 Column중에서 BandTV_SimpleBMP만 선택 합니다.
BandTV_SimpleBMP의 Object Inspector를 보시면 Properties라는 프로퍼티가 보입니다.
이를 선택하시고 Propreties의 내용을 Image로 바꾸어줍니다.
다시 Properties를 클릭하고 펼쳐진 내용에서 아래와 같이 수정을 하면 BMP의 내용이 이미지로 표시됩니다.
<< GIF 만드는 것도 일이네요 : 이넘의 TiStory는 이상하게 동작을 하는 군요 >>

 

우측과 같이 프로퍼티를 수정하면 죄측과 같은 모양으로 cell에 이미지가 출력됩니다.

박스의 내용이 수정할 내용들입니다.

참고 : 각 컬럼은 Properties라는 넘에 각종 Edit Class들을 설정하여 컬럼의 속성을 추가 할수 있도록 되어 있습니다. 본장에서는 BMP의 내용을 보여주는 의도에서 BMP만 수정하였지만, 여러분은 각종 내요을 테스트 해보시기 바랍니다.

 

 

 

자 이렇게 기본적인 내용을 알아 보았습니다.
다음장 부터는 각종 기능을 추가하는 부분에 대해 알아보도록 하겠습니다.

Author: yyjksw