반응형

WANIGrid Control에 마우스 휠 처리를 추가했다.

마우스 휠을 움직이면 데이터의 행(Row)를 100씩 이동하도록 했고, Control 키를 누른 상태에서 마우스 휠을 움직이면 좌우 방향으로 100씩 움직이도록 보완을 했다.

마우스 휠 부분은 VScrollBar와 HScrollBar를 움직였을 때와 같이 처리 되도록 했다.

WANIGrid Control의 헤더 속성 중에 IsRowHeader가 true인 경우와 아닌 경우의 차이는 고정 컬럼 여부이다.

    /// <summary>
    /// WANIGrid MouseWheel Event
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    private void PicGrid_MouseWheel(object sender, MouseEventArgs e)
    {
        if (ModifierKeys == Keys.Control)   //Control Key를 눌렀을 떄, HScrollBar를 움직인 것과 동일
        {
            if (e.Delta / 120 > 0)
            {
                if (grid.StartColumnPosition - 100 < 0) grid.StartColumnPosition = 0;
                else grid.StartColumnPosition -= 100;
            }
            else
            {
                if (grid.StartColumnPosition + 100 < hScrollBar.Maximum)
                {
                    grid.StartColumnPosition += 100;                        
                }
                else 
                {
                    grid.StartColumnPosition = hScrollBar.Maximum;
                }
            }
            IsMouseWheel = true;
        }
        else //VScrollBar를 움직인 것과 동일
        {
            if (e.Delta / 120 > 0)
            {
                if (grid.StartRowPosition - 100 < 0) grid.StartRowPosition = 0;
                else grid.StartRowPosition -= 100;
            }
            else
            {
                if (grid.StartRowPosition + 100 < vScrollBar.Maximum) grid.StartRowPosition += 100;
            }
            IsMouseWheel = false;
        }
        picGrid.Invalidate();
    }

[그림 1] IsRowHeader 가 true인 경우 (Column01, Column02 가 true임)

첨부된 WANIGridExample.cs 파일에서 WANIGrid를 사용하는 방법을 참조하기 바람.

WANIGrid.dll
0.05MB
WANIGridControlExample.zip
0.21MB

반응형

'WinForm > WANIGrid 컨트롤 공개' 카테고리의 다른 글

WANIGrid Control 개선  (0) 2021.04.10
WANIGrid Control 사용법 2  (0) 2020.05.14
WANIGrid Control 사용법 1  (1) 2020.04.30
반응형

기존에 만들었던 WANIGrid의 전체적인 모습과 구조를 대대적으로 바꾸었다.

WANIGrid 스크롤 영역에 대한 처리와 전체 적인 모습들을 좀 더 개선하고자 했다.

추가로 헤더 그룹을 구성할 수 있도록 API를 추가했다.

WANIGrid를 사용하기 위해서는 프로그램 단에서 WANIGrid를 초기화 하는 작업이 필요하다.

초기화 메소드를 하나 만들어서 WANIGrid에 필요한 설정을 하도록 한다.

 

HeaderColumn의 ColumnId는 DataTable의 Column과 대응된다.

waniGridControl1.DataSource 값으로 DataTable을 할당하게 되면 ColumnId의 값과  동일한 DataTable의 필드  값이 WANIGrid 에 나타나게 된다.

 

현재는 셀 선택 시 편집 모드는 TextBox 형태만 지원하고 있다. 향 후 CheckBox, ComboBox, DatePicker 등을 지원할 예정이다.

private void InitializeGrid()
{
    //첫번째 헤드그룹 지정
    List<HeaderGroup> headerGroups0 = new List<HeaderGroup>()
    {
        new HeaderGroup() { StartColumnId = "Col02", NumberOfColumns = 4, TitleText = "Test Top 01" }
    };

    //두번째 헤드그룹 지정
    List<HeaderGroup> headerGroups = new List<HeaderGroup>()
    {
        new HeaderGroup() { StartColumnId = "Col02", NumberOfColumns = 2, TitleText = "Test 01" },
        new HeaderGroup() { StartColumnId = "Col04", NumberOfColumns = 2, TitleText = "Test 02" }
    };
    //헤드 지정
    List<HeaderColumn> headerCols = new List<HeaderColumn>()
    {
        new HeaderColumn() { ColumnId = "Col01", HeaderTitle = "Column 01", IsRowHeader = false, IsEdit = true, EditorType = EditControlType.TextBox, HeaderTitleAlign = HorizontalAlignment.Center, TextAlign = HorizontalAlignment.Left, Visible = true, Width = 100  },
        new HeaderColumn() { ColumnId = "Col02", HeaderTitle = "Column 02", IsRowHeader = false, IsEdit = true, EditorType = EditControlType.TextBox, HeaderTitleAlign = HorizontalAlignment.Center, TextAlign = HorizontalAlignment.Center, Visible = true, Width = 100  },
        new HeaderColumn() { ColumnId = "Col03", HeaderTitle = "Column 03", IsRowHeader = false, IsEdit = true, EditorType = EditControlType.TextBox, HeaderTitleAlign = HorizontalAlignment.Center, TextAlign = HorizontalAlignment.Left, Visible = true, Width = 200  },
        new HeaderColumn() { ColumnId = "Col04", HeaderTitle = "Column 04", IsRowHeader = false, IsEdit = true, EditorType = EditControlType.TextBox, HeaderTitleAlign = HorizontalAlignment.Center, TextAlign = HorizontalAlignment.Left, Visible = true, Width = 100  },
        new HeaderColumn() { ColumnId = "Col05", HeaderTitle = "Column 05", IsRowHeader = false, IsEdit = true, EditorType = EditControlType.TextBox, HeaderTitleAlign = HorizontalAlignment.Center, TextAlign = HorizontalAlignment.Left, Visible = true, Width = 200  },
        new HeaderColumn() { ColumnId = "Col06", HeaderTitle = "Column 06", IsRowHeader = false, IsEdit = true, EditorType = EditControlType.TextBox, HeaderTitleAlign = HorizontalAlignment.Center, TextAlign = HorizontalAlignment.Left, Visible = true, Width = 150  },
        new HeaderColumn() { ColumnId = "Col07", HeaderTitle = "Column 07", IsRowHeader = false, IsEdit = true, EditorType = EditControlType.TextBox, HeaderTitleAlign = HorizontalAlignment.Center, TextAlign = HorizontalAlignment.Left, Visible = true, Width = 200  }
    };

    //Header 정보 추가
    TopHeader header = new TopHeader(headerCols);
    //최상위 헤더 그룹 설정
    header.SetGroupHeaders(0, headerGroups0);
    //상위 헤더 그룹 설정
    header.SetGroupHeaders(headerGroups);
    //Header 정보 설정
    waniGridControl1.SetHeader(header);    
}

 

아래의 첨부 파일의 소스를 실행한 결과 화면

[그림 3-1] WANIGrid Control 사용 예제 1 - 셀 편집 시 화면
[그림 3-2] WANIGrid Control 사용 예제 2 - 한 개의 행 선택 시
[그림 3-2] WANIGrid Control 사용 예제 3 - 여러 개의 행 선택 시

 

[그림 3-2] WANIGrid Control 사용 예제 4 - 한 개의 컬럼 선택 시
[그림 3-2] WANIGrid Control 사용 예제 5 - 여러 개의 컬럼 선택 시

아래의 첨부한 소스를 참조

 

WANIGridControlExample.zip
0.21MB
WANIGrid.dll
0.05MB
WANIGrid_속성정리.pdf
0.09MB

반응형
반응형

WANIGridDataTableDataSource에 할당하는 방법에 대해서 알아보자.

보통 우리는 데이터베이스에서 쿼리를 통해서 우리가 원하는 데이터들을 DataTable에 담아서 가져오게 되고, 이렇게 가져온 데이터를 특정한 양식 또는 원하는 화면에 사용자에게 제공하게 된다.

WANIGrid 또한 이렇게 가져온 데이터인 DataTable를 할당함으로써 WANIGrid에 원하는 컬럼의 정보들을 모두 제공할 수 있게 된다.

 

첨부된 WANIGridExample 프로젝트의 WANIGridExample.cs파일을 열어서 GridInitialize() 메소드를 살펴보자. WANIGrid를 사용하기 위해서는 항상 WANIGridHeader Column을 정의하고 WANIGrid에서 보여주고자 하는 DataTable의 정보를 할당하면 된다.

GridInitialize 메소드의 내부를 하나씩 살펴보기로 하자.

 

HeaderColumn 클래스의 List를 선언하고 waniGrid.TopHeaderList.GetHeaderList() 메소드를 호출해서 빈 headerColumns List를 생성한다.

List<HeaderColumn> headerColumns = waniGrid.TopHeaderList.GetHeaderList();

List<HeaderColumn> headerColumns를 새로 생성한다. Index 값이 0이고 ColumnId“LeftHeader”인 빈 컬럼 1개만 생성됨. 이 후에 각 컬럼들을 추가한다.

 

HeaderColumn 클래스의 속성과 메소드를 잠깐 살펴보자.

속성(Property)

get/set

상세

public int Index

get/set

컬럼 인덱스

public string ColumnId

get/set

컬럼 ID. DataTableColumn Name과 동일해야 함

public string Title

get/set

컬럼 헤더의 명칭.

public int Left

get/set

컬럼의 Left 즉 시작하는 X좌표 값

public int Width

get/set

컬럼의 폭

public HorizontalAlignment HeadAlign

get/set

컬럼 헤더 명칭의 정렬 방법

public HorizontalAlignment TextAlign

get/set

컬럼 데이터의 정렬 위치. DataTableRow별 컬럼 ID에 해당하는 데이터 값을 의미

public bool Visible

get/set

화면에서 해당 컬럼을 화면에 Display 여부. true면 보여지고 false인 경우 숨겨짐.

public bool Editable

get/set

컬럼의 데이터 편집 여부. true면 편집 가능 그렇지 않으면 편집 불가

public bool IsCalendar

get/set

컬럼이 날짜 정보를 가지고 있으면 true, 그렇지 않으면 false

public ViewRange

ViewRange

get/set

컬럼의 시작 X좌표와 끝 X좌표 값을 가지고 있는 ViewRange 타입.

 

WANIGrid를 초기화 하는 방법은 Header 영역을 초기화하고, Header영역의 컬럼들을 정의하는 것으로 일차적인 초기화를 하게된다.

Header영역을 Clear하고 HeaderColumn 목록을 초기화한다.

List<HeaderColumn> headerColumns = waniGrid.TopHeaderList.GetHeaderList();

DataTable의 각 컬럼명과 ColumnId를 동일하게 부여하면 DataTableColumn 값이 WANIGrid의 컬럼에 표시되게 된다.

headerColumns.Add(new HeaderColumn() { ColumnId = "Col01", Title = "Column 01", Width = 80, HeadAlign = HorizontalAlignment.Center, TextAlign = HorizontalAlignment.Left, Editable = true, Visible = true });

headerColumns ListHeaderColumn을 추가하면서 컬럼들을 하나씩 설정해 나가면 된다.

  • ColumnId DataTableColumn명과 동일하게 부여하면 DataTableColumn 값을 할당하게 된다.
  • Title WANIGrid의 컬럼 헤더에 표시되는 텍스트
  • Width 컬럼의 폭을 지정한다.
  • HeadAlign 헤더의 표시되는 텍스트 정렬 방법
  • TextAlign Column 값의 정렬 방법
  • Editable 편집 여부
  • Visible 화면에 표시 여부

컬럼의 속성을 설정해서 headerColumns 리스트를 waniGrid 컨크롤에 할당한다.

waniGrid.TopHeaderList.SetHeaderList(headerColumns);

WANIGrid 컨트롤에 할당한 컬럼 정보들을 InitializeHeader 메소드를 호출해서 초기화한다.

waniGrid.InitializeHeader();

WANIGrid 컨트롤에 고정 컬럼의 개수를 지정할 경우 FixedCol 속성에 고정 컬럼의 개수를 지정한다. 기본 값은 0이다.

waniGrid.FixedCol = 0;

 

아래의 첨부 파일을 실행하면 하기와 같은 화면을 볼 수 있다.

[그림 2-1] WANIGridExample 실행화면

고정컬럼 개수를 변화시켜 보라. 고정컬럼의 영역이 무엇을 의미하는지 확인할 수 있을 것이다.

고정컬럼 수정을 체크했을 때 고정컬럼 영역을 클릭해보라. 값을 입력할 수 있는 텍스트 입력 컨트롤이 활성화 될 것이다.

행간격을 높이거나 줄여보라. 행 높이의 기본 값은 20이다.

DataTable에서 Data 가져오기 버튼을 클릭해 보라. 내부적으로 DataTable을 생성해서 생성된 DataTableWANIGridDataSource에 할당하면 아래의 같이 각 필드의 값이 DataTable의 값으로 채워지게 된다.

자세한 내용은 아래의 첨부된 소스를 참조해 보기 바란다.

 

WANIGridExample_20200514.zip
0.21MB
WANIGrid.dll
0.05MB

 

 

반응형

'WinForm > WANIGrid 컨트롤 공개' 카테고리의 다른 글

WANIGrid Control 개선 - Mouse Wheel 처리 추가  (0) 2021.04.13
WANIGrid Control 개선  (0) 2021.04.10
WANIGrid Control 사용법 1  (1) 2020.04.30
반응형

WANIGrid 는 데이터를 Grid 형태로 제공하고 행 추가 및 수정, 삭제 등의 기본적인 기능들을 제공하는 WinFormControl이다.

 

Grid Control 만들기를 연재하면서 스스로 공부하면서 정리한 내용으로 Grid Control 만들기의 소스를 좀 더 다듬고 개선해서 WinForm 개발 시에 무료로 제한없이 사용할 수 있도록 WANIGrid Control 만들어 갈 생각이다.

WANIGrid Control 사용에 필요한 속성 정보와 API 들을 정리하고 보다 쉽게 사용할 수 있는 매뉴얼을 제공해서 Windows 개발자들이 보다 손 쉽게 사용할 수 있도록 할 것이다. 

 

제공하는 WANIGrid Control과 예제 소스를 통해서 직접 사용해 보면서 추가 개발 또는 개선이 필요한 사항이 있으면 언제든 댓글로 알려주세요.

 

WANIGrid Control을 사용하기 위한 기본적인 속성과 구성을 살펴보자.

[그림 1] WANIGrid Control 구성

WANIGrid Control Client Size를 기준으로 보여지는 첫 번째 컬럼과 마지막 컬럼의 번호를 기준으로 가로 영역을 표현하고, 행 또한 첫 번째 행의 번호와 마지막 행의 번호를 기준으로 세로 영역을 표현하게 된다.

가로/세로 스크롤바를 움직임에 따라 컬럼과 행의 시작/마지막 번호가 변경되며 이 값을 기준으로 표현되어야 할 데이터 영역을 표현하게 된다.

  • LeftHeader 영역은 첫 시작 컬럼이며 WANIGrid의 기본 컬럼이다. 폭의 기본 사이즈는 22이다.
  • XscHeight/YscWidth 영역은 가로/세로 스크롤바의 높이와 폭의 사이즈를 말한다.
  • RowHeight 는 각 행의 높이를 의미하며 기본 높이는 20의 값을 가지고 사용자가 변경할 수 있다.
  • TopHeader 는 헤더 영역의 각 컬럼 속성 정보들을 담고 있다.
  • TopHeaderHeight 는 헤더 영역의 높이를 말하며 기본 높이는 20의 값을 가지고 사용자가 변경할 수 있다.
  • FirstVisibleCol/LastVisibleCol 은 화면 상에서 보여지는 첫 번째 컬럼의 Index와 마지막 컬럼의 Index 값을 가지고 있다.
  • FirstVisibleRow/LastVisinleRow 는 화면 상에서 보여지는 첫 번째 행의 Index와 마지막 컬럼의 Index 값을 가지고 있다.

WANIGrid Control에서 제공되는 기본 속성(Property)들을 아래와 같이 정리해 보았다.

Scope

Type

명칭

내용

public

Cell

ActiveCell

선택한 셀의 행/열 정보를 저장

public

int

RowHeight

행 높이를 설정 또는 반환

public

int

TopHeaderHeight

WANIGrid의 Top Header 영역의 높이를 설정 또는 반환

public

TopHeader

TopHeaderList

Top Header에 정의한 컬럼 목록을 가져온다

public

bool

LeftHeaderVisible

맨 왼쪽의 컬럼을 보여줄 경우 true, 그렇지 않으면 false

public

int

FixedCol

고정할 컬럼 개수. 스크롤 시에 고정되는 컬럼의 개수를 설정 또는 반환.

첫번째 컬럼부터 시작하며 컬럼의 Visiable 속성이 true인 컬럼의 개수만큼 고정이됨

public

int

XscHeight

가로 스크롤의 높이

public

int

YscWidth

세로 스크롤의 폭

public

bool

FixedColEditable

고정컬럼 영역의 값 수정 여부.

false인 경우 Column의 값을 수정할 수 없음

public

int

AllRowsHeight

헤더 영역을 제외한 행(Row)의 총 높이(길이) 값을 반환

public

RowCollection

Rows

행(Row) 정보를 담고 있는 RowCollection을 반환

public

List<int>

SelectedRows

선택된 행(Row)의 Index정보 목록을 반환

public

List<int>

SelectedCols

선택된 열(Column)의 Index정보 목록을 반환

public

bool

ReadOnly

WANIGrid의 내용을 읽기 전용으로 설정 또는 반환.

ReadOnly 값이 true인 경우 WANIGrid 내의 값을 변경할 수 없다.

 

WANIGrid Control 사용 예제를 담은 파일은 아래를 참조.

WANIGridExample_20200430.zip
0.21MB

반응형

'WinForm > WANIGrid 컨트롤 공개' 카테고리의 다른 글

WANIGrid Control 개선 - Mouse Wheel 처리 추가  (0) 2021.04.13
WANIGrid Control 개선  (0) 2021.04.10
WANIGrid Control 사용법 2  (0) 2020.05.14

+ Recent posts