순서도(Flowchart)는 프로세스의 개별 단계를 총체적으로 나타내는 도형과 기호로 가득찬 다이어그램입니다. 순서도는 데이터를 시각화하는 효과적인 수단입니다. 순서도를 사용하면 복잡한 프로세스를 쉽게 설명할 수 있습니다. 최종 사용자에게는 순서도는 이해하기 쉽고 데이터 보존을 향상시키는 동시에 가독성을 제공합니다.

Spread.NET v13은 이제 동적 순서도를 작성하는 새로운 방법인 enhanced Shape Engine을 제공합니다. Spread.NET은 Excel의 도형 테마와 스타일 (연결과 그룹화 도형과 함께)을 지원합니다. 이를 통해 사용자 지정 순서도를 쉽고 빠르게 작성할 수 있습니다.

이제부터 도형 작업 순서도를 만드는 방법을 단계별로 설명하도록 하겠습니다.

Enhanced Shape Engine 사용

시작하기 위해서 Visual Studio에서 Windows Forms App(.NET Framework)을 엽니다 .

프로젝트가 열리면 form으로 이동합니다. v13용 FpSpread 구성 요소를 사용하여 폼에 스프레드 인스턴스를 그립니다. Design time에서 작업을 시작하기 위해 Spread Designer가 열립니다.

다음으로 enhanced shape engine을 활성화해야 합니다. 오른쪽 패널을 보고 드롭다운에서 스프레드(Spread)를 선택한 후, Features를 클릭해 확장합니다. EnhancedShapeEngine을 "True"로 변경합니다.

순서도에 도형 추가

이제 스프레드 시트에 도형을 추가하고 순서도를 작성합니다.

도형을 선택하기 위해, 삽입 (Insert)탭으로 이동하여 도형(Shapes) 드롭 다운 위로 마우스를 가져갑니다. 도형에는 다양한 섹션이 있습니다. 이 예에서는 순서도 부분을 사용합니다.

과정에 대한 대체 프로세스(Alternative Process)와 2가지 순서도(Flowchart)를 사용하며 커넥터(Connector) 도형은 순서도의 시작과 끝이 됩니다. 최종적으로 5개의 순서도를 사용합니다.

스프레드시트는 이제 다음과 같이 나옵니다.

도형에 텍스트 추가

텍스트를 추가하기 위해 도형을 두 번 클릭하면 커서가 나타납니다.

순서도를 수정하면서 시작하도록 하겠습니다. 대체 프로세스 도형에 다음을 작성합니다. : FR Y14A, Update Global Drivers, Adjustments, Business Line Input, Adjustment Review.

서식을 쉽게 읽을 수 있도록 Enter키(도형 내에 있는 단어 사이)를 누릅니다.

다음으로 크기, 정렬 및 색상을 조정합니다.

먼저 텍스트가 포함된 도형을 선택하고 시작합니다. Shift 키를 누른 상태에서 모든 도형을 클릭합니다. 모두 선택되면 글꼴 크기를 16으로 변경하고 글꼴 색상을 검은색으로 변경합니다.

그런 다음 도구 모음에서 정렬(Alignment)부분을 찾아 가운데(Center) 및 가운데 정렬(Center Align)을 선택합니다.

텍스트에 맞게 도형을 조정해야 할 수도 있습니다. 이를 위해서, 모든 도형이 이전과 같이 여전히 선택되어 있는지 확인해야 합니다. 그런 다음 도형 서식(Shape Format)탭으로 가 리본 메뉴의 오른쪽에서 크기(Size) 부분으로 이동하여 너비 160, 높이 100으로 유지합니다.

순서도에서 도형 연결

다음으로 도형을 연결하여 차트의 프로세스 흐름을 형성합니다. 선과 화살표로 도형을 연결할 수 있습니다. 예를 들어, 꺾인 연결선이 있는(혹은 없는) 선 화살표를 사용합니다.

연결선을 추가하기 위해 2단계에서 도형을 추가하는 것과 동일한 단계를 진행합니다. 이번에는 연결선(Connector): 꺾인 화살표(Elbow Arrow)를 선택합니다.

이 옵션을 선택하고 연결선이 스프레드 시트에 표시되면 마우스를 연결선 화살표의 손잡이 위로 올리면 마우스 커서가 변경됩니다.

커서가 변경되면 연결선 끝점을 클릭하고 연결하려는 첫 번째 도형의 테두리로 끕니다. 연결선을 고정할 수 있는 위치로 끌면 연결점이 도형에 나타납니다. 위치가 선택되면, 연결점이 녹색으로 변경되어 선이 도형에 연결됐음을 나타냅니다.

이제 반대쪽과 이 과정을 반복하여 도형과 연결합니다.

나머지 순서도의 경우 선 화살표(Line Arrow)와 연결선:꺾인 화살표(Elbow Arrow)를 사용하여 다음과 같이 기존 도형과 연결합니다.

도형의 사용자 지정 스타일링

다음 세 가지 도형인  FR Y14A , Business Line Input,Adjustment Review을 선택합니다.(도형을 선택하는 동안 Shift키를 누르고 있다면 세 가지를 모두 한 번에 선택할 수 있습니다). 세 가지 모두 선택되었다면, 도형 서식(Shape Format) 탭 아래의 스타일 테마(Style Themes)로 이동한 다음, 미세 효과 - 강조 1(Subtle Effect – Accent 1)을 선택합니다.

미세효과 강조-3(Subtle Effect – Accent 3) 스타일 테마와 함께 Update Global Drivers와 Adjustments이 담긴 두 개의 프로세스 도형도 이 작업을 반복해줍니다. 그리고 시작과 끝 도형에는 색 채우기 - 강조 6 (Colored Fill – Accent 6)테마를 적용시켜줍니다.

연결선 화살표 중 하나에 사용자 지정 스타일을 추가합니다. Adjustments and Adjustment Review사이에서 연결 화살표를 선택해야 합니다 .

화살표가 선택되면 도형 서식(Shape Format)탭으로 이동하여 도형 윤곽선(Shape Outline) 드롭 다운을 선택합니다.

드롭다운에서 표준 색상인 빨간색을 선택합니다.

다음은 스타일을 적용한 후 차트가 표시되는 방식입니다.

순서도에서 도형 그룹화

이제 순서도를 더욱 향상시키기 위해 도형을 그룹화합니다. 이 단계에서는 시작 및 끝 도형에 두 개의 이미지를 그룹화할 것입니다.

이 예에서는 '시작'과 '정지'를 나타내는 두 개의 기호를 사용했습니다. 이 기호를 추가하기 위해 해당 기호를 복사하여 통합 문서에 붙여 넣었습니다. 이를 위해 RichClipboard기능을 활성화해야 합니다.

이제 이미지를 복사/붙여 넣기할 수 있습니다.

'재생' 기호의 이미지를 복사/붙여 넣었습니다. 해당 이미지가 스프레드 시트에 있으면 이미지를 선택하고 드래그하여 시작 도형 안에 있는 것처럼 보이게 합니다.

그런 다음 Shift 키를 누른 상태에서 시작 도형을 선택합니다.

둘 다 선택되면 도형 서식 (Shape Format)탭으로 이동하여 배열(Arrange) 부분에서 그룹(Group 드롭 다운을 확인합니다. 이 드롭다운에서 그룹(Group)을 선택하면 도형이 이제 하나로 인식됩니다.

순서도 끝의 정지 모양도 위의 단계를 반복하되 이번에는 두 모양이 모두 선택되면 마우스 오른쪽 단추를 클릭하고 그룹(Group)으로 이동한 다음, 그룹(Group)을 선택합니다.

순서도 마무리

순서도 작성의 마지막 단계입니다. Excel과 같은 연결선은 텍스트를 프로세스 흐름에 자동으로 첨부할 수 없습니다. 이를 위해 도형을 추가하고 배경 또는 윤곽선 스타일을 제거한 후 연결선 도형 중 일부에 그룹화합니다.

새 도형을 삽입합니다.

도형 내에서 더블 클릭하고 Reject(거부)를 입력합니다.

그런 다음 도형 서식(Shape Format) 탭으로 이동하고 _Shape Fill _and Shape Outline 드롭 다운을 사용하여 윤곽선 없음(Not Outline)과 채우기 없음(No Fill)을 선택합니다. 글꼴 색상을 검은색으로 변경해야 할 수도 있습니다.

새 도형과 빨간색 연결선 화살표를 모두 선택하고 그룹화합니다.

위의 모든 단계를 반복하되 이번에는 Adjustment Review와 순서도 끝 사이에 연결선 레이블을 작성합니다.

아래는 튜토리얼 결과이며, Spread.NET 버전 13의 새로운 Enhanced Shape Engine이 design time에 얼마나 포괄적이고 높은 기능을 수행하는지 살펴 보았습니다.