본 자료는
1. Old 버전과 New 버전의 컬럼 정렬 방법 차이
2. 관련된 SmartListBox 인터페이스 및 사용 방법
3. 컬럼 정렬 Item 추가 방법
순서로 진행합니다.
기존 ListBox는 추가된 데이터의 컬럼(열)을 띄어쓰기(공백)로 조절해야 하여 폰트(가로/세로가 다른 길이) 또는 한/영/숫자 조합 등의 문제로 인해 정렬을 맞추기가 매우 어렵습니다. SmartX Framework의 SmartListBox는 컬럼 설정 기능을 지원하여 간편하고 깔끔하게 데이터를 정렬할 수 있습니다.
1. Old 버전과 New 버전의 컬럼 정렬 방법 차이
SmartListBox의 컬럼 정렬 기능은 Old 버전과 New 버전 모두 지원합니다. 단, Old 버전에서는 구분자를 사용해 컬럼을 임의로 구분해 정렬해야 했습니다. 반면 New 버전에서는 컬럼 설정 기능이 제공되어 깔끔하게 데이터를 정렬할 수 있습니다. 아래 표에서 두 버전의 컬럼 정렬 기능의 차이점을 확인해 보시기 바랍니다.
[버전별 컬럼 정렬 기능 비교]
-
Old 버전 컬럼 구분 방법구분자(Delimiter)로 구분
단점1. ColumnOffsets 속성의 계산 방식이 직관적이지 않아 계산이 불편함
2. 모든 셀은 한가지의 정렬 방식만 사용 가능
3. 각 셀별 Offsets 지정이 불가능함
4. 컬럼 처리를 구분자를 포함한 문자열로만 처리할 수 있음
코드 예시// 구분자를 통해 컬럼을 구분
smartListBox1.AddItem("홍길동;22;MAN;BIKING");표현 예시
[Left 정렬의 경우] 
[Center 정렬의 경우] -
New 버전 컬럼 구분 방법Array(배열)과 List
를 사용한 구분
※ DataSet을 사용한 컬럼 정렬 또한 가능장점1. ColumnStyles 속성을 사용한 컬럼별 영역 크기, 정렬 방식, Offset을 설정
2. ColumnStyles 속성을 설정하지 않고 Array, List<T>, DataSet Item을 추가할 경우 기본 컬럼 정렬 기능 제공
3. 출력되는 데이터의 길이와 관계없이 정확한 정렬
코드 예시// Array(배열)에 데이터를 저장하여 컬럼을 구분
m_strArrayData[0] = "홍길동";
m_strArrayData[1] = "22";
m_strArrayData[2] = "MAN";
m_strArrayData[3] = "BIKING";
smartListBox1.AddItem(m_strArratData);
표현 예시
[Left 정렬의 경우] 
[Center 정렬의 경우] 
[셀별로 정렬을 다르게 설정한 경우]
따라서 컬럼 정렬이 필요한 경우 New 버전 사용을 권장드립니다. Old 버전의 단점을 모두 보완하여 간편하고 깔끔하게 데이터를 정렬할 수 있습니다.
2. 관련된 SmartListBox 인터페이스 및 사용 방법
SmartListBox에서 컬럼 정렬을 위한 인터페이스는 ColumnStyles 속성이 있으며, ColumnStyles 속성의 구성으로는 ColumnNameMapping, eColumnAlign, iColumnWidth, iOffsetColumn이 있으며, 사용법은 다음과 같습니다.
| 이름 | ColumnNameMapping |
|---|---|
| 타입 | string |
| 설명 | Column 또는 Field를 가지고 있는 DataSet 또는 List에서 각각의 속성에 ColumnName을 설정하여 출력할 Column의 순서를 설정합니다. |
| 사용 방법 C# |
// Column Style 구조체를 생성 SmartX.SmartListBox.COLUMNSTYLE[] sColumnStyle = new SmartX.SmartListbox.COLUMNSTYLE[4]; // 첫번째 컬럼의 Column Name을 DataTime으로 설정 sColumnStyle[0].ColumnNameMapping = "DataTime"; // 두번째 컬럼의 Column Name을 Number으로 설정 sColumnStyle[1].ColumnNameMapping = "Number"; // 세번째 영역의 Column Name을 Sensor으로 설정 sColumnStyle[2].ColumnNameMapping = "Sensor"; // 네번째 영역의 Column Name을 Device으로 설정 sColumnStyle[3].ColumnNameMapping = "Device"; // 설정한 Style을 SmartListBox에 적용 smartListBox1.ColumnStyle = sColumnStyle; |
| 이름 | ColumnNameMapping |
|---|---|
| 타입 | string |
| 설명 | Column 또는 Field를 가지고 있는 DataSet 또는 List에서 각각의 속성에 ColumnName을 설정하여 출력할 Column의 순서를 설정합니다. |
| 사용 방법 C# |
// Column Style 구조체를 생성 SmartX.SmartListBox.COLUMNSTYLE[] sColumnStyle = new SmartX.SmartListbox.COLUMNSTYLE[4]; // 첫번째 컬럼의 Column Name을 DataTime으로 설정 sColumnStyle[0].ColumnNameMapping = "DataTime"; // 두번째 컬럼의 Column Name을 Number으로 설정 sColumnStyle[1].ColumnNameMapping = "Number"; // 세번째 영역의 Column Name을 Sensor으로 설정 sColumnStyle[2].ColumnNameMapping = "Sensor"; // 네번째 영역의 Column Name을 Device으로 설정 sColumnStyle[3].ColumnNameMapping = "Device"; // 설정한 Style을 SmartListBox에 적용 smartListBox1.ColumnStyle = sColumnStyle; |
| 이름 | eColumnAlign |
|---|---|
| 타입 | SmartListBox.COLUMNALIGNS |
| 설명 | SmartListBox 아이템을 항목별로 iColumnWidth의 값으로 설정한 영역을 기준으로 정렬(Left, Center, Right)합니다. |
| 사용 방법 C# |
// Column Style 구조체를 생성 SmartX.SmartListBox.COLUMNSTYLE[] sColumnStyle = new SmartX.SmartListbox.COLUMNSTYLE[4]; // 첫번째 컬럼의 정렬 기준을 우측 정렬로 사용 sColumnStyle[0].eColumnAlign = SmartX.SmartListBox.COLUMNALIGNS.RIGHT; // 두번째 컬럼의 정렬 기준을 중앙 정렬로 사용 sColumnStyle[1].eColumnAlign = SmartX.SmartListBox.COLUMNALIGNS.CENTER; // 세번째 컬럼의 정렬 기준을 우측 정렬로 사용 sColumnStyle[2].eColumnAlign = SmartX.SmartListBox.COLUMNALIGNS.RIGHT; // 네번째 컬럼의 정렬 기준을 좌측 정렬로 사용 sColumnStyle[2].eColumnAlign = SmartX.SmartListBox.COLUMNALIGNS.LEFT; // 설정한 Style을 SmartListBox에 적용 smartListBox1.ColumnStyle = sColumnStyle; |
| 이름 | eColumnAlign |
|---|---|
| 타입 | SmartListBox.COLUMNALIGNS |
| 설명 | SmartListBox 아이템을 항목별로 iColumnWidth의 값으로 설정한 영역을 기준으로 정렬(Left, Center, Right)합니다. |
| 사용 방법 C# |
// Column Style 구조체를 생성 SmartX.SmartListBox.COLUMNSTYLE[] sColumnStyle = new SmartX.SmartListbox.COLUMNSTYLE[4]; // 첫번째 컬럼의 정렬 기준을 우측 정렬로 사용 sColumnStyle[0].eColumnAlign = SmartX.SmartListBox.COLUMNALIGNS.RIGHT; // 두번째 컬럼의 정렬 기준을 중앙 정렬로 사용 sColumnStyle[1].eColumnAlign = SmartX.SmartListBox.COLUMNALIGNS.CENTER; // 세번째 컬럼의 정렬 기준을 우측 정렬로 사용 sColumnStyle[2].eColumnAlign = SmartX.SmartListBox.COLUMNALIGNS.RIGHT; // 네번째 컬럼의 정렬 기준을 좌측 정렬로 사용 sColumnStyle[2].eColumnAlign = SmartX.SmartListBox.COLUMNALIGNS.LEFT; // 설정한 Style을 SmartListBox에 적용 smartListBox1.ColumnStyle = sColumnStyle; |
| 이름 | iColumnWidth |
|---|---|
| 타입 | int |
| 설명 | 각 컬럼에 정렬될 항목의 영역 크기를 설정합니다. |
| 사용 방법 C# |
// Column Style 구조체를 생성 SmartX.SmartListBox.COLUMNSTYLE[] sColumnStyle = new SmartX.SmartListbox.COLUMNSTYLE[4]; // 첫번째 컬럼 영역의 넓이를 90으로 설정 sColumnStyle[0].iColumnWidth = 90; // 두번째 컬럼 영역의 넓이를 40으로 설정 sColumnStyle[1].iColumnWidth = 40; // 세번째 컬럼 영역의 넓이를 100으로 설정 sColumnStyle[2].iColumnWidth = 100; // 네번째 컬럼 영역의 넓이를 95으로 설정 sColumnStyle[2].iColumnWidth = 95; // 설정한 Style을 SmartListBox에 적용 smartListBox1.ColumnStyle = sColumnStyle; |
| 이름 | iColumnWidth |
|---|---|
| 타입 | int |
| 설명 | 각 컬럼에 정렬될 항목의 영역 크기를 설정합니다. |
| 사용 방법 C# |
// Column Style 구조체를 생성 SmartX.SmartListBox.COLUMNSTYLE[] sColumnStyle = new SmartX.SmartListbox.COLUMNSTYLE[4]; // 첫번째 컬럼 영역의 넓이를 90으로 설정 sColumnStyle[0].iColumnWidth = 90; // 두번째 컬럼 영역의 넓이를 40으로 설정 sColumnStyle[1].iColumnWidth = 40; // 세번째 컬럼 영역의 넓이를 100으로 설정 sColumnStyle[2].iColumnWidth = 100; // 네번째 컬럼 영역의 넓이를 95으로 설정 sColumnStyle[2].iColumnWidth = 95; // 설정한 Style을 SmartListBox에 적용 smartListBox1.ColumnStyle = sColumnStyle; |
| 이름 | iOffsetColumn |
|---|---|
| 타입 | int |
| 설명 | 정렬을 기준으로 Offset을 설정합니다. |
| 사용 방법 C# |
// Column Style 구조체를 생성 SmartX.SmartListBox.COLUMNSTYLE[] sColumnStyle = new SmartX.SmartListbox.COLUMNSTYLE[4]; // 첫번째 컬럼의 Offset을 0으로 설정 sColumnStyle[0].iOffsetColumn = 0; // 두번째 컬럼의 Offset을 0으로 설정 sColumnStyle[1].iOffsetColumn = 0; // 세번째 컬럼의 Offset을 0으로 설정 sColumnStyle[2].iOffsetColumn = 0; // 네번째 컬럼의 Offset을 10으로 설정 sColumnStyle[2].iOffsetColumn = 10; // 설정한 Style을 SmartListBox에 적용 smartListBox1.ColumnStyle = sColumnStyle; |
| 이름 | iOffsetColumn |
|---|---|
| 타입 | int |
| 설명 | 정렬을 기준으로 Offset을 설정합니다. |
| 사용 방법 C# |
// Column Style 구조체를 생성 SmartX.SmartListBox.COLUMNSTYLE[] sColumnStyle = new SmartX.SmartListbox.COLUMNSTYLE[4]; // 첫번째 컬럼의 Offset을 0으로 설정 sColumnStyle[0].iOffsetColumn = 0; // 두번째 컬럼의 Offset을 0으로 설정 sColumnStyle[1].iOffsetColumn = 0; // 세번째 컬럼의 Offset을 0으로 설정 sColumnStyle[2].iOffsetColumn = 0; // 네번째 컬럼의 Offset을 10으로 설정 sColumnStyle[2].iOffsetColumn = 10; // 설정한 Style을 SmartListBox에 적용 smartListBox1.ColumnStyle = sColumnStyle; |
3. 컬럼 정렬 Item 추가 방법
ColumnStyle을 설정한 뒤 Column Item을 추가하는 방법은 크게 3가지 방식이 있습니다. 자세한 방법은 아래의 CASE들을 확인하시기 바랍니다.
-
[CASE-1] Array(배열)에 Column Item을 추가하여 설정
string 타입의 배열에 Column Item을 추가하여 AddItem() 메소드를 사용해 Item을 추가합니다.
예시 코드private void AddItemButton_Click(object sender, EventArgs e)
{
// Column Item이 추가될 배열을 생성 Column의 개수만큼 배열의 크기를 설정}
string[] m_strArrayData = new string[4];
// 각 Column에 추가될 Item을 배열에 추가
m_strArrayData[0] = "IEC667-Series";
m_strArrayData[1] = "IEC1000-Series";
m_strArrayData[2] = "Smart I/O";
m_strArrayData[3] = "SmartX Framework";
// Column Item이 추가된 배열을 AddItem메소드를 사용하여 출력
smartListBox1.AddItem(m_strArrayData);
-
[CASE-2] List<T>에 Column Item을 추가하여 설정
List<string>에 Column Item을 추가하여 AddItem() 메소드를 사용해 Item을 추가합니다.
예시 코드private void AddItemButton_Click(object sender, EventArgs e)
{
// Column Item이 추가될 배열을 생성 Column의 개수만큼 배열의 크기를 설정}
List<string> m_strListData = new List<string>();
// 각 Column에 추가될 Item을 리스트에 추가
m_strListData.Add("IEC667-Series");
m_strListData.Add("IEC1000-Series");
m_strListData.Add("Smart I/O");
m_strListData.Add("SmartX Framework");
// Column Item이 추가된 배열을 AddItem메소드를 사용하여 출력
smartListBox1.AddItem(m_strListData);
-
[CASE-3] DataSet을 사용한 Column Item 추가
1. DataSet을 사용하여 Item Table을 작성한 뒤 해당 Table을 DataSource 속성에 설정하여 Item을 추가합니다.
2. DataSet을 사용하여 DB에 저장된 데이터를 SmartListBox의 Item으로 추가합니다.예시 코드// 1번
private void AddItemButton_Click(object sender, EventArgs e)
{
DataSet lstData4 = new DataSet("HR_DataSet");}
lstData4.Tables.Add("Employee");
DataColumn colName = new DataColumn("DateTime", typeof(string));
DataColumn colAge = new DataColumn("Number", typeof(int));
DataColumn colNote = new DataColumn("Item", typeof(string));
lstData4.Tables["Employee"].Columns.Add(colName);
lstData4.Tables["Employee"].Columns.Add(colAge);
lstData4.Tables["Employee"].Columns.Add(colNote);
DataRow dataRecord;
dataRecord = lstData4.Tables["Employee"].NewRow();
dataRecord["DateTime"] = DateTime.Now.ToLongTimeString();
dataRecord["Number"] = "0";
dataRecord["Item"] = "SmartX-1";
lstData4.Tables["Employee"].Rows.Add(dataRecord);
lsbCustomStyle1.DataSource = lstData4.Tables["Employee"];
// 2번
private void AddItemButton_Click(object sender, EventArgs e)
{
// DB 경로 지정}
string dbPath = @"Flash Disk\emp.sdf";
string connStr = "Data Source=" + dbPath + ";";
lstData4.DataSource = null;
lstData4.Items.Clear();
DataSet retDataSet = new DataSet();
m_conn = new SqlCeConnection(connStr);
m_conn.Open();
string strQuery = "SELECT NAME, AGE, POSITION, PART, ENTERING FROM EMPLOYEE";
SqlCeAdapter dataAdapter = new SqlCeAdapter(strQuery, m_conn);
dataAdapter.Fill(retDataSet);
lstData4.DataSource = retDataSet.Tables[0];
