개발(IT)/DevExpress 교육자료

DevExpress 강좌3-4 (SDI Demo)

isony 2024. 1. 27. 22:04
반응형

1. DevExpress 강좌3-4 (SDI Demo)

- 유연한 폼양식을 사용하기 데모 입니다.

 

(1) 기본데모 프로그램

- 아코드언 컨트롤(accordion)과 기본 양식에 제목 표시줄에 버튼을 추가할 수 있는 디자이너 표시기도 볼 수 있습니다.

- SDI 애플리케이션의 도구상자에서 NavigationFrame 을 추가하고 사용가능한 공간을 채우기 위해 Docking 합니다.

- 내장된 탭이 있는 솔루션을 선호하는 경우 탭을 사용할 수 있습니다. NavigationFrame에는 기본적으로 두개의 페이지가 포함되어 있으며 디자인너에 패널을 표시하여 페이지를 변경하고 새 페이지를 추가하거나 제거합니다.

- 첫 번째 페이지의 이름을 gridPage로 변경하고 도구상자에서 그리드 사용자 컨트롤을 추가하여, Dock (None -> Fill) 변경합니다. ( 사용자 컨트롤이 표시가 않되는 경우  솔루션 다시빌드를 하시면 표시가 됩니다. - 실행했다 종료해도 됨)

- 두번째 페이지는 이름을 richEditPage로 변경하고  리치편집 사용자 컨트롤을 추가하고, Dock (None -> Fill) 변경합니다.

- 이제 아코디언 컨트롤(accordion control)에 항목을 추가합니다(Element2). 

- 첫번째 항목에 대해 기존항목의 스타일을 항목으로 변경합니다.

- Style : Group -> Item

- Text : Element1 -> Grid, Element2 -> Rich Edit

- 두 항목 모두에 이벤트 핸들러를 추가하고, 기능을 구현하기 위해 Navigation Frame의 활성 페이지를 변경합니다. 

- navigationFrame1의 기본 SelectedPage를 gridPage로 변경합니다.

 

(2) 실행

- 메뉴 Grid와 Rich Edit를 선택하면 오른쪽 프레임이 애니메이션으로 변경되는것을 확인할 수 있습니다.

- 전환유형 및 전환 애니메이션은 속성을 살펴보세요 (TransitionType 변경)

 

(3) 수정 및 실행

- Navigation Frame에 이벤트 핸들러 쿼리 컨트롤을 구현하고, 이벤트 아크의 페이지에 따라 새 컨트롤을 반환합니다.

- Navigation Frame은 MDI 샘플에 대해 시현한 것처럼 도구모음 메뉴 및 리본에 대한 병합을 지원합니다.

- MainFormWithRibbon 데모에서 이러한 구성을 확인해 보겠습니다. 

- 소스를 보시면 QueryControl 부분이 변경되어 있습니다.

- 프로그램 실행(Progrma.cs)을 기본에서 MainFormWithRibbon으로 변경합니다.

 

(4) 실행

- 실행하면 navigationFrame1이 자동으로 이전과 같이 그리드 페이지를 표시하고, 리본이 변경되는 리치 편집페이지로 전환하면 리본의 도구그룹에서 그리드 특정 버튼을 볼 수 있습니다. 

- Visual Studio에서 다시 Rich Edit 사용자 컨트롤에 대한 설정과 병합합니다.

 

- 이 설정을 위해 구성한 두 가지 속성을 확인해야 합니다.

- 첫 번째는 최상위 리본에 있습니다. MDI 병합 스타일을 항상(Always), MDI 데모에서 했던 것처럼 설정되어 있습니다.

- 두 번째는 navigationFrame1 데모의 마지막 부분에 리본과 막대 병합 스타일이 설정되어 있습니다.

- RibbonAndBarsMergeStyle : Always

 

(5) 프로그램 Form 변경

- Program.cs 코드를 다시 변경합니다. ( MainFormWithTileNavPane )

- DevExpress 프로젝트 설정을 변경합니다.

- Skin Name : The Bezer

- Skin Palette : Office Dark Gray

- MainFormWithTitleNavPane Disign 확인

- Run Designer을 불러오면 그리드와 리치 편집 항목이 있는 타일로 표시되는 요소의 계층 구조를 볼 수 있습니다.

- 여러 하위 항목이 표시된 샘플버튼 양식에서 다시 볼 수 있습니다. (추가 최상위 항목도 볼 수 있습니다.)

- 심플버튼(Button)과 카테고리버튼(Category)을 사용하면 중요한 기능에 쉬게 액세스 할 수 있지만 이러한 항목은 제한해야 합니다.

- 타일 탐색 창 중앙에 있는 공간은 런타임에 탐색 트레일을 표시하는데 사용됩니다.

- 카테고리버튼(Category)에는 태그(Tag) 메뉴을 통해 구성할 수 있는 자체 관련 계층이 있다는 점에 유의하세요.

 

(6) 프로그램 실행

- 기본 메뉴을 열고 선택하면, 연속 탐색을 사용하도록 타일 탐색 창을 구성한 이후의 카테고리 타일 간단한 최상위 속성 설정, 선택한 카테고리가 증시 확장되고 항목이  강장 오른쪽 버튼에 표시됩.

- 하위 항목을 볼 수 있음, 타일 창

- 오른쪽에 있는 카테고리 버튼을 계층 구조를 동일한 방식으로 표시하지만 타일 창에 영향을 주지는 않습니다.

 

2. 프로그램 소스

sample_3_08.zip
0.08MB

반응형