Common Data Service를 사용하여 캔버스 앱을 처음부터 만들기Create a canvas app from scratch using Common Data Service

표준 엔터티(기본 제공), 사용자 지정 엔터티(사용자 조직에서 만듦) 또는 모두를 사용하여 Common Data Service에 저장된 데이터를 관리하는 캔버스 앱을 빌드합니다.Build a canvas app to manage data that's stored in Common Data Service, using standard entities (which are built in), custom entities (which your organization creates), or both.

Common Data Service에서 앱을 빌드하면, SharePoint, Dynamics 365 및 Salesforce와 같은 데이터 원본에서와 마찬가지로 PowerApps에서 연결을 만들 필요가 없습니다.When you build an app from Common Data Service, you don't need to create a connection from PowerApps, as you do with data sources such as SharePoint, Dynamics 365, or Salesforce. 앱에서 표시, 관리하려는 엔터티를 지정하기만 하면 됩니다.You need only to specify the entities that you want to show or manage in the app.

필수 조건Prerequisites

비어 있는 앱 열기Open a blank app

  1. PowerApps에 로그인합니다.Sign in to PowerApps.

  2. 나만의 앱 만들기에서 빈 페이지의 캔버스 앱을 선택합니다.Under Make your own app, select Canvas app from blank.

    비어 있는 앱 타일

  3. 앱의 이름을 지정하고, 전화를 선택한 다음, 만들기를 선택합니다.Specify a name for your app, select Phone, and then select Create.

    태블릿용 앱을 처음부터 만들 수 있지만 이 항목에서는 전화용 앱을 만드는 방법을 설명합니다.You can build an app from scratch for tablets, but this topic shows building an app for phones.

엔터티 지정Specify an entity

  1. 화면 가운데에서 데이터에 연결을 선택합니다.In the middle of the screen, select connect to data.

  2. 데이터 창에서 Common Data Service를 선택하고, 계정 확인란을 선택한 다음, 연결을 선택합니다.In the Data pane, select Common Data Service, select the Accounts check box, and then select Connect.

  3. 오른쪽 위 모서리에 있는 닫기 아이콘을 선택하여 데이터 창을 닫습니다.Close the Data pane by selecting the close icon in the upper-right corner.

목록 추가 화면Add a list screen

  1. 탭에서 새 화면에 대한 아래쪽 화살표를 선택한 다음, 목록을 선택합니다.On the Home tab, select the down arrow for New screen, and then select List.

    목록 추가 화면

  2. 왼쪽 탐색 모음에서 BrowseGallery1을 선택한 다음, Items 속성의 값을 다음 수식으로 설정합니다.In the left navigation bar, select BrowseGallery1, and then set the value of the Items property to this formula:

    SortByColumns(Search(Accounts, TextSearchBox1.Text, "name"), "name", If(SortDescending1, SortOrder.Descending, SortOrder.Ascending))

    이 수식에서 지정한 작업은 다음과 같습니다.This formula specifies that:

    • 갤러리에서 거래처 엔터티의 데이터를 표시합니다.The gallery should show data from the Accounts entity.

    • 사용자가 정렬 단추를 선택하여 정렬 순서를 토글할 때까지 데이터를 오름차순으로 정렬합니다.The data should be sorted in ascending order until a user selects the sort button to toggle the sort order.

    • 사용자가 검색 창(TextSearchBox1)에 하나 이상의 문자를 입력하거나 붙여넣으면 목록에서 사용자가 지정한 문자가 이름 필드에 포함된 계정만 표시합니다.If a user types or pastes one or more characters into the search bar (TextSearchBox1), the list will show only those accounts for which the name field contains the characters that the user specified.

      이러한 함수와 다른 많은 함수를 사용하여 앱의 표시 방식과 작동 방식을 지정할 수 있습니다.You can use these and many other functions to specify how your app appears and behaves.

      갤러리의 Items 속성 설정

  3. 각 계정의 이름만 표시하도록 갤러리의 레이아웃을 설정하고, 갤러리 사용자 지정에서 설명한 대로 찾아보기 단어를 표시하도록 제목 표시줄을 구성합니다.Set the gallery's layout to show only the name of each account, and configure the title bar to show the word Browse, as Customize a gallery describes.

    찾아보기 화면

  4. 왼쪽 탐색 모음에서 Screen1 위를 마우스로 가리키고, 줄임표(...)를 선택한 다음, 삭제를 선택합니다.In the left navigation bar, hover over Screen1, select the ellipsis icon (...), and then select Delete.

  5. 왼쪽 탐색 모음에서 Screen2 위를 마우스로 가리키고, 줄임표(...)를 선택한 다음, 이름 바꾸기를 선택합니다.In the left navigation bar, hover over Screen2, select the ellipsis icon (...), and then select Rename.

  6. BrowseScreen을 입력하거나 붙여넣은 다음, 해당 화면의 갤러리 이름을 BrowseGallery로 바꿉니다.Type or paste BrowseScreen, and then rename the gallery in that screen as BrowseGallery.

    찾아보기 화면 및 갤러리 이름 바꾸기

양식 화면 추가Add a form screen

  1. 이전 절차의 첫 번째 단계를 반복합니다. 단, 목록 화면 대신 양식 화면을 추가합니다.Repeat the first step of the previous procedure, except add a Form screen instead of a List screen.

  2. 오른쪽 창의 고급 탭에 표시된 대로 양식의 DataSource 속성을 계정, 해당 항목 속성을 BrowseGallery.Selected로 설정합니다.Set the form's DataSource property to Accounts and its Item property to BrowseGallery.Selected, as the Advanced tab of the right-hand pane shows.

    양식의 Datasource 및 Item 속성 설정

  3. 속성 선택 오른쪽 창의 탭 필드 편집 열려는 합니다 필드 창.On the Properties tab of the right-hand pane, select Edit Fields to open the Fields pane.

  4. 필드 추가를 선택하고, 다음 필드에 대한 확인란을 선택합니다.Select Add field, and then select the check boxes for these fields:

    • 계정 이름Account Name
    • 주소 1: 번지 1Address 1: Street 1
    • 주소 1: 시/군/구Address 1: City
    • 주소 1: 우편 번호Address 1: ZIP/Postal code
    • 직원 수Number of Employees
    • 연간 수익Annual Revenue

    참고

    이 시나리오에서는 외부에서 사용자 지정 필드를 선택 하 여 만들 수 있습니다 새 필드필요한 정보를 제공 하 고 선택한 다음 수행합니다.Outside of this scenario, you can create a custom field by selecting New field, providing the required information, and then selecting Done. 자세한 정보는 필드를 만들합니다.More information: Create a field.

  5. 추가를 선택합니다.Select Add.

  6. 만들기/편집을 표시하도록 제목 표시줄의 Text 속성을 설정합니다.Set the title bar's Text property to show Create/Edit.

    화면에 변경 내용이 반영됩니다.The screen reflects your changes.

    양식의 Datasource 및 Item 속성 설정

  7. 이 화면의 이름을 FormScreen으로 변경합니다.Rename this screen FormScreen.

아이콘 구성Configure icons

  1. BrowseScreen에서 화면 위쪽 근처에서 원형 아이콘을 선택하고, OnSelect 속성을 다음 수식으로 설정합니다.On the BrowseScreen, set the OnSelect property of the circular icon near the top of the screen to this formula:

    Refresh(Accounts)

    새로 고침 아이콘

  2. 더하기 아이콘의 OnSelect 속성을 다음 수식으로 설정합니다.Set the OnSelect property of the plus icon to this formula:

    NewForm(EditForm1); Navigate(FormScreen, ScreenTransition.None)

    추가 아이콘

  3. 오른쪽을 가리키는 첫 번째 화살표의 OnSelect 속성을 다음 수식으로 설정합니다.Set the OnSelect property of the first arrow pointing to the right to this formula:

    EditForm(EditForm1); Navigate(FormScreen, ScreenTransition.None)

    다음 아이콘

  4. FormScreen에서 취소 아이콘의 OnSelect 속성을 다음 수식으로 설정합니다.On the FormScreen, set the OnSelect property of the cancel icon to this formula:

    ResetForm(EditForm1);Navigate(BrowseScreen, ScreenTransition.None)

    취소 아이콘

  5. 확인 표시 아이콘의 OnSelect 속성을 다음 수식으로 설정합니다.Set the OnSelect property of the checkmark icon to this formula:

    SubmitForm(EditForm1); Navigate(BrowseScreen, ScreenTransition.None)

    확인 표시 아이콘

  6. 삽입 탭에서 아이콘을 선택한 다음, 휴지통 아이콘을 선택합니다.On the Insert tab, select Icons, and then select the Trash icon.

  7. 휴지통 아이콘의 Color 속성을 White로 설정하고, OnSelect 속성을 다음 수식으로 설정합니다.Set the Trash icon's Color property to White and its OnSelect property to this formula:

    Remove(Accounts, BrowseGallery.Selected); Navigate(BrowseScreen, ScreenTransition.None)

    휴지통 아이콘

앱 테스트Test the app

  1. 왼쪽 탐색 모음에서 BrowseScreen을 선택한 다음, F5 키를 누르거나 오른쪽 위 모서리 근처에서 재생 아이콘을 선택하여 미리 보기를 엽니다.In the left navigation bar, select BrowseScreen, and then open Preview by pressing F5 (or by selecting the play icon near the upper-right corner).

    미리 보기 열기

  2. 목록을 오름차순 또는 내림차순으로 정렬한 다음, 계정 이름에 있는 하나 이상의 문자를 기준으로 필터링합니다.Toggle the list between ascending and descending sort orders, and filter the list by one or more characters in the account name.

  3. 계정을 추가하고, 추가한 계정을 편집하고, 계정 업데이트를 시작하지만, 변경 내용을 취소한 다음, 계정을 삭제합니다.Add an account, edit the account that you added, start to update the account but cancel your changes, and then delete the account.

다음 단계Next steps