# 보고서 디자이너 인터페이스

## Content



보고서 디자이너를 사용하면 보고서 템플릿을 만들고 수정할 수 있습니다. 보고서 디자이너 인터페이스는 아래에서 설명하는 여러 컴포넌트로 구성되어 있습니다.

### 도구 상자

```도구 상자```는 사용 가능한 보고서 항목을 열거합니다. 기본적으로 도구 상자에는 아이콘이 표시되지만 디자이너 왼쪽 위에 있는 ```햄버거``` 메뉴를 사용하여 확장해 보고서 항목 이름을 볼 수 있습니다. 보고서에 보고서 항목을 추가하려면 도구 상자에서 해당 항목을 두 번 클릭하거나 보고서 항목을 특정 보고서 영역으로 끌어 놓습니다.

<p>DOC-DETAILS-TAG-OPEN</p>
<p>DOC-SUMMARY-TAG-OPEN</p>
 확장하여 실행 중인 보고서 항목 추가 보기 
<p>DOC-SUMMARY-TAG-CLOSE</p>

 ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/bb60cce7-9e37-4ea9-b603-2504fdc3a791/reportauthor-guide/Tablix/AddingTablix.gif)
<p>DOC-DETAILS-TAG-CLOSE</p>

### 보고서 탐색기

```보고서 탐색기```를 사용하면 보고서 구조를 탐색하고 보고서 항목 및 또는 보고서의 일부분을 신속하게 선택할 수 있습니다. 보고서 탐색기를 열려면 디자이너 왼쪽 위에 있는 [텍스트 상자 열기](/activereportsjs/docs/v2.1/#toolbox) 버튼 아래 있는 ```트리``` 아이콘을 클릭합니다. 해당하는 버튼을 사용하여 보고서 탐색기를 고정해 항상 열려 있도록 할 수도 있습니다. 보고서 계층 구조에서 항목을 클릭하여 선택합니다. 

<p>DOC-DETAILS-TAG-OPEN</p>
<p>DOC-SUMMARY-TAG-OPEN</p>
 확장하여 실행 중인 보고서 탐색기 사용 보기 
<p>DOC-SUMMARY-TAG-CLOSE</p>

 ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/bb60cce7-9e37-4ea9-b603-2504fdc3a791/reportauthor-guide/Chart/ChartAddingAndConfiguring.gif)
<p>DOC-DETAILS-TAG-CLOSE</p>

### 그룹 편집기

```그룹 편집기```는 [Tablix](/activereportsjs/docs/v2.1/ReportAuthorGuide/Report-Items/Data-Regions/Tablix) 구조를 탐색하거나 Tablix 멤버를 추가 또는 제거하여 구조를 빠르게 수정할 수 있습니다. 그룹 탐색기를 열려면 디자이너 왼쪽 위에 있는 [보고서 탐색기 열기](/activereportsjs/docs/v2.1/#report-explorer) 버튼 아래 있는 트리 아이콘을 클릭합니다. 해당하는 버튼을 사용하여 보고서 편집기를 고정해 항상 열려 있도록 할 수도 있습니다. 그룹 편집기 사용에 대한 자세한 내용은 [Tablix 문서](/activereportsjs/docs/v2.1/ReportAuthorGuide/Report-Items/Data-Regions/Tablix#insert-adjacent-child-or-parent-groups)를 참조하십시오.

### 도구 모음

보고서 디자이너 위에 있는 ```도구 모음```을 사용하면 보고서 항목을 ```잘라내고```, ```복사하고```, ```붙여넣을``` 수 있으며, ```삭제```할 수 있고 해당 항목의 [텍스트 속성](/activereportsjs/docs/v2.1/ReportAuthorGuide/Report-Items/Common-Properties#text-properties)을 구성할 수 있습니다.

<p>DOC-DETAILS-TAG-OPEN</p>
<p>DOC-SUMMARY-TAG-OPEN</p>
 확장하여 실행 중인 도구 모음 사용 보기 
<p>DOC-SUMMARY-TAG-CLOSE</p>

 ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/bb60cce7-9e37-4ea9-b603-2504fdc3a791/reportauthor-guide/UsingToolbar.gif)
<p>DOC-DETAILS-TAG-CLOSE</p>

### 보고서 레이아웃

```보고서 레이아웃```은 보고서 항목을 표시하고 선택 및 다시 정렬하도록 하는 페이지 형태의 시각적 화면입니다. 보고서 디자이너의 오른쪽 아래에 있는 UI 요소를 사용하여 페이지 화면의 다양한 디자인 타임 속성을 구성할 수 있습니다.

* ```눈금``` 버튼을 사용하여 눈금을 표시하거나 숨깁니다.
* ```축소```, ```확대``` 또는 ```확대/축소 수준``` 버튼을 사용하여 확대/축소 수준을 설정합니다.
* 자석처럼 생긴 아이콘의 드롭다운 메뉴를 사용하여 ```눈금 크기```를 설정하고 다음 옵션을 구성합니다.
    * ```눈금에 맞춤``` \- 활성화되어 있으면 보고서 항목의 위치와 크기가 눈금에 맞춰 정렬됩니다.
    * ```안내선에 맞춤``` \- 활성화되어 있으면 보고서 디자이너에 안내선이 표시되어 보고서 항목의 크기 및 위치를 다른 보고서 항목과 쉽게 맞출 수 있습니다.

### 속성 검사자

```속성 검사자```는 보고서 디자이너의 오른쪽에 있으며 ```속성 패널```과 ```데이터 패널```, 이렇게 두 가지 컴포넌트로 구성되어 있습니다.

### 속성 패널

```속성 패널```은 기본적으로 열려 있으며 여기서 [보고서 항목 속성](/activereportsjs/docs/v2.1/ReportAuthorGuide/Report-Items/Common-Properties)을 수정할 수 있습니다. ```기본``` 모드에서는 필수 속성만 표시되며, ```고급 모드```에서는 모든 속성이 표시됩니다. 보고서 디자이너의 오른쪽 아래에 있는 드롭다운 메뉴를 사용하여 ```기본```과 ```고급``` 모드 간에 전환할 수 있습니다. 이 드롭다운 메뉴 왼쪽에는 [길이 단위](/activereportsjs/docs/v2.1/ReportAuthorGuide/Report-Items/Common-Properties#length)에 대한 기본 측정 단위를 설정하는 스위치가 있습니다.

<p>DOC-DETAILS-TAG-OPEN</p>
<p>DOC-SUMMARY-TAG-OPEN</p>
 확장하여 실행 중인 기본 모드 및 고급 모드 사용 보기 
<p>DOC-SUMMARY-TAG-CLOSE</p>

 ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/bb60cce7-9e37-4ea9-b603-2504fdc3a791/reportauthor-guide/PropertiesPanel.gif)
<p>DOC-DETAILS-TAG-CLOSE</p>

### 데이터 패널

```데이터 패널```은 여러 기능을 요약합니다.

* 이 패널에서는 [데이터 바인딩](/activereportsjs/docs/v2.1/ReportAuthorGuide/Databinding)을 구성할 수 있습니다.
* [보고서 매개 변수](/activereportsjs/docs/v2.1/ReportAuthorGuide/Report-Parameters)를 추가, 제거하고 순서를 다시 정렬하는 데 사용할 수 있습니다.
* 보고서로 끌어 놓을 수 있는 [전역 값](/activereportsjs/docs/v2.1/ReportAuthorGuide/Expressions/references#global-values) 목록을 표시합니다.

<p>DOC-DETAILS-TAG-OPEN</p>
<p>DOC-SUMMARY-TAG-OPEN</p>
 확장하여 실행 중인 데이터 패널 사용 보기 
<p>DOC-SUMMARY-TAG-CLOSE</p>

 ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/bb60cce7-9e37-4ea9-b603-2504fdc3a791/reportauthor-guide/GetStartedWithAnalyticalReport/AddingDataSource.gif)
<p>DOC-DETAILS-TAG-CLOSE</p>


### 식 편집기

```식 편집기```는 [식](/activereportsjs/docs/v2.1/ReportAuthorGuide/Report-Items/Common-Properties#expression)을 쉽게 작성할 수 있는 대화 상자입니다. 식 기반 속성 편집기의 오른쪽 경계에서 상자를 클릭하면 나타나는 드롭다운 메뉴를 사용하여 열 수 있습니다. ```식 편집기``` 왼쪽에는 사용 가능한 상수, 함수 및 참조가 열거됩니다. 자세한 내용은 [식 문서](/activereportsjs/docs/v2.1/ReportAuthorGuide/Expressions)를 참조하십시오. 항목을 두 번 클릭하면 오른쪽에 표시된 결과 식에 추가됩니다.

<p>DOC-DETAILS-TAG-OPEN</p>
<p>DOC-SUMMARY-TAG-OPEN</p>
 확장하여 실행 중인 식 편집기 사용 보기 
<p>DOC-SUMMARY-TAG-CLOSE</p>

 ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/bb60cce7-9e37-4ea9-b603-2504fdc3a791/reportauthor-guide/UsingExpressionEditor.gif)
<p>DOC-DETAILS-TAG-CLOSE</p>

### 필터 편집기

```필터 편집기```는 [데이터 영역](/activereportsjs/docs/v2.1/ReportAuthorGuide/Report-Items/Data-Regions) 또는 데이터 영역 일부(예: [표 그룹](/activereportsjs/docs/v2.1/ReportAuthorGuide/Report-Items/Data-Regions/Table#table-grouping))에 표시되는 데이터를 제외할 조건을 쉽게 구성할 수 있는 인터페이스입니다. ```필터``` 속성의 편집기를 클릭하면 ```필터 편집기```가 열리는데, 아직 추가된 필터가 없으면 ```추가...``` 텍스트가 표시되고 그렇지 않으면 ```편집...``` 텍스트가 표시됩니다. 

<p>DOC-DETAILS-TAG-OPEN</p>
<p>DOC-SUMMARY-TAG-OPEN</p>
 확장하여 실행 중인 필터 편집기 사용 보기 
<p>DOC-SUMMARY-TAG-CLOSE</p>

 ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/bb60cce7-9e37-4ea9-b603-2504fdc3a791/reportauthor-guide/GetStartedWithTabularReport/AddingFilters.gif)
<p>DOC-DETAILS-TAG-CLOSE</p>