캔버스 앱에서 주문 갤러리 만들기

아티클
03/16/2023

Northwind Traders 데이터베이스의 가상 데이터를 관리하기 위해 단계별 지침에 따라 캔버스 앱에서 주문 갤러리를 만듭니다. 이 토픽은 Microsoft Dataverse의 관계형 데이터에서 비즈니스 앱을 빌드하는 방법을 설명하는 시리즈의 일부입니다. 최상의 결과를 얻으려면 다음 토픽을 다음 순서로 탐색하십시오.

주문 갤러리 만들기(이 토픽)
요약 양식 만들기
세부 정보 갤러리 만들기

화면 영역의 정의.

필수 조건

Northwind Traders 데이터베이스 및 앱 설치
Northwind Traders의 캔버스 앱 개요 읽기.

빈 앱 만들기

빈 캔버스 앱을 만들고 "My Northwind Orders(Canvas 앱)"와 같은 이름을 지정합니다.

데이터 추가

왼쪽 창에서 데이터 > 데이터 추가 > 검색 대상을 선택하고 주문 테이블을 선택합니다.

주문 테이블에는 다양한 유형의 필드가 있습니다.

각 필드에는 표시 이름과 경우에 따라 논리적 이름이라고 하는 이름이 있습니다. 두 이름 모두 같은 것을 가리킵니다. 일반적으로 앱을 빌드할 때 표시 이름을 사용하지만 어떤 경우에는 절차에 명시된 것처럼 더 복잡한 이름이 필요합니다.
다음에 화면과 컨트롤을 다룰 때에는 Power Apps Studio에서 세 개의 사각형이 쌓인 아이콘을 눌러 왼쪽의 Tree View로 다시 전환하십시오. 원통형 아이콘을 누르면 언제든지 Data Sources로 돌아갈 수 있습니다.

주문 갤러리 만들기

Insert 탭에서 갤러리 > Blank vertical을 선택하여 갤러리 컨트롤을 추가하면 주문 내용이 표시됩니다.

컨트롤이 캔버스에 배치되고 연결할 데이터 원본를 묻는 플라이아웃 대화 상자가 나타납니다.
여기에서 Orders에 직접 연결할 수 있지만, 대신 갤러리의 정렬 순서를 제어하고 싶습니다. 플라이아웃 대화 상자를 무시하고 수식 입력줄에서 갤러리의 Items 속성을 다음 수식으로 설정합니다.
```
Sort( Orders, 'Order Number', Descending )
```
Sort 함수는 최신 주문(주문 번호가 가장 큼)이 먼저 나타나도록 목록을 정렬합니다.
잠시 후 수식 입력줄 아래에 결과 보기가 나타납니다. 수식의 결과를 보려면 왼쪽의 화살표를 아래로 당기십시오. 오른쪽으로 스크롤하여 주문 번호 열을 확인하고 원하는 방식으로 정렬되었는지 확인합니다(가장 큰 수에서 가장 작은 수).
오른쪽 가장자리 근처에 있는 Properties 탭에서 Layout 목록을 엽니다.
옵션 목록에서 Title and subtitle을 선택합니다.

갤러리의 템플릿에 두 개의 레이블 컨트롤이 추가됩니다. 기본적으로 이러한 컨트롤은 다음에 변경할 주문 테이블의 두 개 열을 표시합니다. 갤러리의 템플릿은 테이블의 각 레코드에 대해 수직으로 복제됩니다.
오른쪽 가장자리 근처에 있는 Properties 탭에서 Edit(Fields 옆에 있음)를 선택합니다.
Data 창에서 Title1(또는 갤러리 템플릿에서 상단 레이블)을 선택합니다.
수식 입력줄에서 레이블의 Text 속성을 다음 식으로 설정합니다.
```
"Order " & ThisItem.'Order Number'
```
주문 번호가 각 갤러리 항목의 상단에 나타납니다. 갤러리 템플리셍서 ThisItem은 Order 테이블의 모든 필드에 대한 액세스 권한을 부여합니다.
Data 창에서 Subtitle1(또는 갤러리 템플릿에서 하단 레이블)을 선택합니다.
수식 입력줄에서 레이블의 Text 속성을 다음 식으로 설정합니다.
```
ThisItem.Customer.Company
```
이 수식을 입력하면 잠시 동안 빨간색 물결선 오류가 표시될 수 있습니다. 수식 입력줄 외부를 클릭하면 오류가 사라지고 커서가 수식 입력줄로 되돌아옵니다. 오류가 지속되거나 값이 표시되지 않는 경우 보기 탭을 선택하고 데이터 원본을 선택한 다음, 줄임표(...)를 데이터 원본 이름의 우측으로 선택하여 주문 테이블을 새로 고칩니다.

ThisItem.Customer를 지정하면 주문 및 고객 테이블 간의 다대일 관계를 활용하고 각 주문과 관련된 고객 레코드를 검색합니다. 고객 레코드에서 Company 열에 표시할 데이터를 추출할 수 있습니다.

고객 테이블을 포함하여 주문 테이블부터 다른 테이블까지 모든 관계를 표시할 수 있습니다.
오른쪽 상단 모서리에 있는 닫기 아이콘(X)을 선택하여 Data 창을 닫습니다.

각 주문 상태 표시

이 절차에서는 갤러리에 레이블을 위한 공간을 추가하고 각 주문 상태를 구성하여 데이터에 따라 다른 색상으로 표시합니다.

갤러리 템플릿에서 첫 번째 레이블 Title1의 너비를 줄입니다.
두 번째 레이블 Subtitle1에서 이전 단계를 반복합니다.
갤러리 템플릿(또는 템플릿의 컨트롤)을 선택한 상태에서 Insert 탭에서 레이블을 선택합니다.
새 레이블을 Title1 레이블의 오른쪽으로 이동합니다.
새 레이블의 Text 속성을 다음 식으로 설정합니다.
```
ThisItem.'Order Status'
```
주문 테이블에서 주문 상태 필드는 주문 상태 선택 사항의 값을 유지합니다. 선택 사항은 다른 프로그래밍 도구의 열거와 유사합니다. 각 옵션 집합은 데이터베이스에 정의되어 있으므로 사용자는 집합에 있는 해당 옵션만 지정할 수 있습니다. 주문 상태 선택 사항은 또한 로컬이 아닌 전역이므로 다른 테이블에서 사용할 수 있습니다.

집합의 각 옵션에는 레이블에 표시하는 경우 표시되는 이름이 있습니다. 이러한 이름은 현지화할 수 있으며, 영어 사용자가 Apple을 선택하거나 프랑스어 사용자가 Pomme를 선택하거나 스페인어 사용자가 Manzana를 선택하는 것과 상관없이 앱은 동일한 옵션을 인식합니다. 이러한 이유로 인해 이 토픽에서 나중에 설명하는 것처럼 옵션으로 하드 코딩 된 문자열을 사용하는 수식을 만들 수 없습니다.

수식에서는 Order Status가 공백을 포함하고 있기 때문에 작은 따옴표로 묶어야 합니다. 그러나 해당 이름은 Customer나 Company와 같이 Power Apps의 다른 이름과 동일한 방법으로 작동합니다.
Home 탭에서, 상태 레이블의 글꼴 크기를 20포인트로 늘리고 텍스트를 오른쪽으로 맞춥니다.
수식 입력줄에서 상태 레이블의 Color 속성을 다음 수식으로 설정합니다.
```
Switch( ThisItem.'Order Status',
    'Orders Status'.Closed, Green,
    'Orders Status'.New, Black,
    'Orders Status'.Invoiced, Blue,
    'Orders Status'.Shipped, Purple
)
```
Power Apps은 옵션 이름이 현지화되는 경우 집합의 각 옵션에 대해 하드 코딩된 문자열을 사용하는 수식이 부적절한 결과를 가져올 수 있기 때문에 그러한 수식을 만들지 못하게 합니다. 대신에 Switch 함수가 사용자 설정에 따라 레이블에 나타나는 문자열에 따라 색상을 결정합니다.

이 수식을 사용하면 이전 그림과 같이 다른 상태 값이 다른 색상으로 나타납니다.

각 주문의 총계 표시

갤러리에서 갤러리의 템플릿인 첫 번째 항목을 선택합니다.
Insert 탭에서 Label을 선택하여 다른 레이블을 추가합니다.
상태 레이블 아래에 표시되도록 새 레이블을 이동합니다.
수식 입력줄에서 새 레이블의 Text 속성을 다음 수식으로 설정합니다.
```
Text( Sum( ThisItem.'Order Details', Quantity * 'Unit Price' ), "[$-en-US]$ #,###.00" )
```
이 수식에서 Sum 함수는 일대다 관계를 통해 주문 테이블의 각 레코드와 관련된 주문 상세 정보 테이블의 레코드를 더합니다. 이 품목은 각 주문을 구성하며, 동일한 일대다 관계를 사용하여 화면의 오른쪽 아래 영역에서 품목을 표시하고 편집할 수 있습니다.

Dataverse가 복잡한 집계 함수의 위임(예 : 곱셈의 합)을 지원하지 않기 때문에 이 수식에는 파란색 밑줄과 위임 경고가 표시됩니다. 이 예제의 주문에는 500개를 초과하는 품목이 포함되지 않기 대문에 이 정보는 무시해도 됩니다. 다른 앱에 필요한 경우 App settings에서 해당 제한을 늘릴 수 있습니다.

이 수식의 Text 함수는 통화 기호를 추가하며 결과를 천 단위 및 소수 구분 기호로 서식 지정합니다. 작성된 수식에는 미국 영어([$-en-US])와 달러 기호($)에 대한 언어 태그가 포함됩니다. 언어 태그를 제거하면 언어 설정에 따라 언어 태그가 바뀌며 레이블에 해당 태그에 적합한 형식이 표시됩니다. 달러 기호를 그대로 두면 레이블에 사용자 설정에 따라 적절한 통화 기호가 표시됩니다. 그러나 달러 기호를 원하는 기호로 바꿔 강제로 다른 기호가 나타나도록 할 수 있습니다.
Home 탭에서, 최신 레이블의 글꼴 크기를 20포인트로 변경하고 텍스트를 오른쪽으로 맞춥니다.
갤러리를 화면의 왼쪽 가장자리로 이동하고 갤러리의 너비를 줄여 공간을 확대합니다.
화면과 높이가 거의 같도록 갤러리의 높이를 늘리면서도 제목 표시줄의 맨 위에 다음 토픽 시작 부분에 추가할 약간의 여유 공간을 남겨 둡니다.

요약

요약하면, 다음 요소가 포함된 주문 갤러리를 추가하여 단일 화면 캔버스 앱을 빌드하기 시작했습니다.

주문 번호를 표시하는 식: "Orders " & ThisItem.OrderNumber
다대일 관계를 나타내는 필드: ThisItem.Customer.Company
집합에서 옵션 이름을 표시하는 레이블: ThisItem.'Order Status'
레이블이 표시되는 집합의 옵션에 따라 형식이 변경되는 레이블: Switch( ThisItem.'Order Status', 'Orders Status'.Closed, Green, ...
일대다 관계에 대한 복잡한 집계 함수: Sum( ThisItem.'Order Details', Quantity * 'Unit Price' )

다음 토픽

다음 토픽에서, 양식 편집을 추가하여 사용자가 방금 만든 갤러리에서 사용자가 선택한 모든 주문의 요약을 요약을 표시하고 편집할 수 있습니다.

요약 양식 만들기

참고

귀사의 설명서 언어 기본 설정에 대해 말씀해 주시겠습니까? 간단한 설문 조사에 응해주세요. (이 설문 조사는 영어로 되어 있습니다.)

이 설문 조사는 약 7분 정도 걸립니다. 개인 데이터는 수집되지 않습니다(개인정보처리방침).

다음을 통해 공유