프로젝트를 관리하는 앱 만들기Create an app to manage projects

참고: 이 문서는 SharePoint Online에서 PowerApps, Microsoft Flow 및 Power BI를 사용하는 방법에 대한 자습서 시리즈의 일부입니다.Note: This article is part of a tutorial series on using PowerApps, Microsoft Flow, and Power BI with SharePoint Online. 시리즈 소개를 참고하여 관련된 다운로드뿐만 아니라 전체적인 내용을 파악해야 합니다.Make sure you read the series introduction to get a sense of the big picture, as well as related downloads.

이 작업에서는 앱을 처음부터 빌드합니다.In this task, we'll build an app from scratch. 이 앱을 통해 사용자는 관리자를 프로젝트에 할당하고 프로젝트 세부 정보를 업데이트할 수 있습니다.This app allows a user to assign a manager to projects and to update project details. 첫 번째 앱에서 본 것과 동일한 컨트롤과 수식이 표시되지만 이번에는 더 많은 앱을 직접 빌드합니다.You will see some of the same controls and formulas you saw in the first app, but you will build more of the app yourself this time. 프로세스가 더 복잡하지만 자세히 설명하겠습니다.The process is more complex, but you'll learn more, so we think it's a fair trade-off.

팁: 이 시나리오에 대한 다운로드 패키지에는 이 앱의 완성된 버전인 project-details-app.msapp이 포함되어 있습니다.Tip: The download package for this scenario includes a finished version of this app: project-details-app.msapp.

PowerApps Studio에 대한 빠른 검토Quick review of PowerApps Studio

마지막 작업에서 웹용 PowerApps Studio를 사용했지만 계속 진행하기 전에 모든 부분을 이해해야 합니다.You used PowerApps Studio for web in the last task, but we want to make sure you understand all the parts before we move on. 웹용 PowerApps Studio에서 계속 작업하거나 Windows용 PowerApps Studio를 사용할 수 있습니다.You can continue to work in PowerApps Studio for web, or you can use PowerApps Studio for Windows.

PowerPoint에서 슬라이드 모음을 만드는 것처럼 PowerApps Studio에는 앱을 만들 수 있는 3개 창 및 리본 메뉴가 있습니다.PowerApps Studio has three panes and a ribbon that make app creation feel like building a slide deck in PowerPoint:

  1. 왼쪽 탐색 모음 - 화면의 썸네일뿐만 아니라 앱의 모든 화면과 컨트롤에 대한 계층적 보기를 보여 줍니다.Left navigation bar, which shows a hierarchical view of all the app's screens and controls, as well as thumbnails of the screens
  2. 가운데 창 - 작업 중인 앱 화면이 포함되어 있습니다.Middle pane, which contains the app screen you are working on
  3. 오른쪽 창 - 레이아웃 및 데이터 원본과 같은 옵션을 설정합니다.Right-hand pane, where you set options like layout and data sources
  4. 속성 드롭다운 목록 - 수식이 적용되는 속성을 선택합니다.Property drop-down list, where you select the properties that formulas apply to
  5. 수식 입력줄 - Excel처럼 앱 동작을 정의하는 수식을 추가합니다.Formula bar, where you add formulas (like in Excel) that define app behavior
  6. 리본 - 컨트롤을 추가하고 디자인 요소를 사용자 지정합니다.Ribbon, where you add controls and customize design elements

PowerApps Studio

1단계: 화면 만들기Step 1: Create screens

검토를 마쳤으면 앱 빌드를 시작하겠습니다.With that review out of the way, let's start building an app.

앱 만들기 및 저장Create and save the app

  1. PowerApps Studio에서 새로 만들기를 클릭하거나 탭한 다음, 빈 앱 아래에서 전화 레이아웃을 클릭하거나 탭합니다.In PowerApps Studio, click or tap New, then under Blank app, click or tap Phone Layout.

    빈 앱 - 전화 레이아웃

  2. 파일을 클릭하거나 탭하여 앱 설정 탭을 엽니다. "프로젝트 관리 앱"이라는 이름을 입력합니다.Click or tap File, which opens to an App settings tab. Enter the name "Project Management app".

    앱 이름

  3. 다른 이름으로 저장을 클릭하거나 탭하고, 앱이 클라우드에 저장되는지 확인한 다음, 오른쪽 아래 모서리에서 저장을 클릭합니다.Click or tap Save as, verify that the app will save to the cloud, then click Save in the lower right corner.

    클라우드에 저장

  4. 앱으로 돌아가기 아이콘을Click or tap 클릭하거나 탭하여 앱으로 돌아갑니다.to go back to the app.

앱에 4개 화면 추가Add four screens to the app

이 단계에서는 앱에 대한 4개의 빈 화면을 만듭니다.In this step, we'll create four blank screens for the app. 화면의 용도에 따라 별개의 화면 레이아웃을 사용합니다.We'll use different screen layouts, depending on the screen's purpose. 이후 단계에서 이러한 화면을 추가합니다.We'll add to these screens in later steps.

화면Screen 용도Purpose
SelectTaskSelectTask 시작 화면, 다른 화면으로 이동Opening screen; navigate to other screens
AssignManagerAssignManager 승인된 프로젝트에 관리자 할당Assign a manager to an approved project
ViewProjectsViewProjects 요약 정보와 함께 프로젝트 목록 표시View a list of projects, with summary information
UpdateDetailsUpdateDetails 프로젝트 세부 정보 표시 및 업데이트View and update the details for a project
  1. 탭에서 NewScreen, 스크롤 가능 화면을 차례로 클릭하거나 탭합니다.On the Home tab, click or tap NewScreen, then Scrollable screen.

    스크롤 가능 화면

  2. 화면의 이름을 SelectTask로 바꿉니다.Rename the screen to SelectTask.

    화면 이름 바꾸기

  3. 추가 화면을 만들고 이름을 바꿉니다.Create and rename additional screens:

    1. NewScreen, 스크롤 가능 화면을 차례로 클릭하거나 탭합니다.Click or tap NewScreen, then Scrollable screen. 화면의 이름을 AssignManager로 바꿉니다.Rename the screen to AssignManager.
    2. NewScreen, 목록 화면을 차례로 클릭하거나 탭합니다.Click or tap NewScreen, then List screen. 화면의 이름을 ViewProjects로 바꿉니다.Rename the screen to ViewProjects.
    3. NewScreen, 양식 화면을 차례로 클릭하거나 탭합니다.Click or tap NewScreen, then Form screen. 화면의 이름을 UpdateDetails로 바꿉니다.Rename the screen to UpdateDetails.
  4. Screen1 옆에 있는 줄임표(. . .)를 선택한 다음 삭제를 클릭하거나 탭합니다.Select the ellipsis (. . .) next to Screen1, then click or tap Delete.

    삭제 화면

앱은 이제 다음 이미지와 같습니다.The app should now look like the following image.

모든 앱 화면

2단계: SharePoint 목록에 연결Step 2: Connect to a SharePoint list

이 단계에서는 제품 세부 정보 SharePoint 목록에 연결합니다.In this step, we'll connect to the Product Details SharePoint list. 이 앱에서는 하나의 목록만 사용하지만, 앱을 확장하려는 경우 둘 다에 쉽게 연결할 수 있습니다.We only use one list in this app, but you could easily connect to both if you want to extend the app.

  1. 왼쪽 탐색 모음에서 SelectTask 화면을 클릭하거나 탭합니다.In the left navigation bar, click or tap the SelectTask screen.
  2. 오른쪽 창에서 데이터 원본 추가를 클릭하거나 탭합니다.In the right pane, click or tap Add data source.

    데이터에 연결

  3. 새 연결을 클릭하거나 탭합니다.Click or tap New connection.

    새 연결

  4. SharePoint를 클릭하거나 탭합니다.Click or tap SharePoint.

    SharePoint 연결

  5. 직접 연결(클라우드 서비스)을 선택한 다음 만들기를 클릭하거나 탭합니다.Select Connect directly (cloud services), then click or tap Create.

    직접 연결(클라우드 서비스)

  6. SharePoint URL을 입력한 다음을 클릭하거나 이동을 클릭하거나 탭합니다.Enter a SharePoint URL, then click or tap Go.

    연결을 위한 SharePoint URL

  7. 프로젝트 세부 정보 목록을 선택한 다음 연결을 클릭하거나 탭합니다.Select the Project Details list, then click or tap Connect.

    프로젝트 세부 정보 목록 선택

    이제 오른쪽 창의 데이터 원본 탭에 사용자가 만든 연결이 표시됩니다.The Data sources tab in the right pane now shows the connection that you have created.

    데이터 원본 탭

3단계: SelectTask 화면 빌드Step 3: Build the SelectTask screen

이 단계에서는 PowerApps에서 제공하는 컨트롤, 수식 및 서식 옵션 중 일부를 사용하여 앱의 다른 화면으로 이동하는 방법을 제공합니다.In this step, we'll provide a way to navigate to the other screens in the app - working with some of the controls, formulas, and formatting options that PowerApps provides.

제목 업데이트 및 설명 텍스트 삽입Update the title and insert introductory text

  1. 왼쪽 탐색 모음에서 SelectTask 화면을 선택합니다.In the left navigation bar, select the SelectTask screen.
  2. 가운데 창에서 기본 [제목]을 선택한 다음, 수식 입력줄에서 Text 속성을 "Contoso 프로젝트 관리"로 업데이트합니다.In the middle pane, select the default [Title], then in the formula bar, update the Text property to "Contoso Project Management".

    수식 입력줄의 Text 속성

  3. 삽입 탭에서 레이블을 클릭하거나 탭한 다음, 레이블을 위쪽 배너 아래로 끕니다.On the Insert tab, click or tap Label, then drag the label down below the top banner.

    레이블 추가

  4. 수식 입력줄에서 레이블에 대해 다음 속성을 설정합니다.In the formula bar, set the following properties for the label:

    • Color 속성 = DarkGrayColor property = DarkGray
    • Size 속성 = 18Size property = 18
    • Text 속성 = "계속하려면 작업을 클릭하거나 탭합니다..."Text property = "Click or tap a task to continue..."

      레이블 텍스트 업데이트

두 개의 탐색 단추 추가Add two navigation buttons

  1. 삽입 탭에서 단추를 클릭하거나 탭한 다음, 단추를 레이블 아래로 끕니다.On the Insert tab, click or tap Button, then drag the button below the label.

    단추 추가

  2. 수식 입력줄에서 단추에 대해 다음 속성을 설정합니다.In the formula bar, set the following properties for the button:

    • OnSelect 속성 = Navigate(AssignManager, Fade)OnSelect property = Navigate(AssignManager, Fade). 앱을 실행하고 이 단추를 클릭하면 앱에서 화면 간의 페이드 전환을 통해 두 번째 화면으로 이동합니다.When you run the app and click this button, you navigate to the second screen in the app, with a fade transition between the screens.
    • Text 속성 = "관리자 할당"Text property = "Assign Manager"
  3. 텍스트에 맞게 단추의 크기를 조정합니다.Resize the button to accommodate the text.

    업데이트 단추 텍스트

  4. 다음 속성이 있는 다른 단추를 삽입합니다.Insert another button with the following properties:

    • OnSelect 속성 = Navigate(ViewProjects, Fade).OnSelect property = Navigate(ViewProjects, Fade).
    • Text 속성 = "세부 정보 업데이트"Text property = "Update Details"

      업데이트 단추 텍스트

      참고: 단추에는 세부 정보 업데이트라는 레이블이 있지만, 먼저 ViewProjects 화면으로 이동하여 업데이트할 프로젝트를 선택합니다.Note: The button is labeled Update Details, but we first navigate to the ViewProjects screen to select a project to update.

앱 실행Run the app

아직은 많은 작업을 수행할 수 없는 앱이지만 원하는 경우 실행할 수 있습니다.The app doesn't do a lot yet, but you can run it if you like:

  1. SelectTask 화면을 클릭하거나 탭합니다(앱은 항상 PowerApps Studio의 미리 보기 모드에서 선택한 화면에서 시작합니다).Click or tap the SelectTask screen (the app always starts from the selected screen in Preview mode in PowerApps Studio).
  2. 오른쪽 위 모서리에서Click or tap 앱 실행 아이콘을 클릭하거나 탭하여 앱을 실행합니다.in the upper right corner to run the app.
  3. 단추 중 하나를 클릭하거나 탭하여 다른 화면으로 이동합니다.Click or tap one of the buttons to navigate to another screen.
  4. 오른쪽 위 모서리에서Click or tap 앱 미리 보기 닫기 아이콘을 클릭하거나 탭하여 앱을 닫습니다.in the upper right corner to close the app.

4단계: AssignManager 화면 빌드Step 4: Build the AssignManager screen

이 단계에서는 갤러리를 사용하여 승인되었지만 아직 관리자가 없는 모든 프로젝트를 표시합니다.In this step, we'll use a gallery to display all projects that have been approved but don't yet have a manager. 다른 컨트롤을 추가하여 관리자를 지정할 수 있습니다.We'll add other controls, so you can assign a manager.

참고: 나중에 앱에서 관리자 필드를 포함하여 프로젝트에 대한 모든 필드를 편집할 수 있는 페이지를 빌드하지만, 다음과 같은 화면을 빌드하는 것도 좋을 것입니다.Note: We'll build a page later in the app that allows you to edit all fields for a project (including the manager field), but we thought it would be cool to build a screen like this one as well.

  1. 지금까지 변경한 내용을 저장합니다.Save the changes you've made so far.
  2. 왼쪽 탐색 모음에서 AssignManager 화면을 클릭하거나 탭합니다.In the left navigation bar, click or tap the AssignManager screen.

제목 업데이트 및 설명 텍스트 삽입Update the title and insert introductory text

  1. [제목]관리자 할당으로 변경합니다.Change [Title] to Assign Manager.
  2. 다음 속성이 있는 레이블을 추가합니다.Add a label with the following properties:

    • Color 속성 = DarkGrayColor property = DarkGray
    • Size 속성 = 18Size property = 18
    • Text 속성 = "프로젝트를 선택한 다음 관리자를 할당합니다."Text property = "Select a project, then assign a manager"

      관리자 할당 레이아웃

SelectTask 화면으로 돌아가는 뒤로 화살표 추가Add a back arrow to return to the SelectTask screen

  1. 화면 위쪽에서 파란색 막대를 클릭하거나 탭합니다.Click or tap the blue bar at the top of the screen.
  2. 삽입 탭에서 아이콘을 클릭하거나 탭한 다음, 왼쪽을 클릭하거나 탭합니다.On the Insert tab, click or tap Icons, then click or tap Left.

    왼쪽 화살표 삽입

  3. 화살표를 파란색 막대의 왼쪽으로 이동하고, 다음 속성을 설정합니다.Move the arrow to the left side of the blue bar, and set the following properties:

    • Color 속성 = WhiteColor property = White
    • Height 속성 = 40Height property = 40
    • OnSelect 속성 = Navigate(SelectTask, Fade)OnSelect property = Navigate(SelectTask, Fade)
    • Width 속성 = 40Width property = 40

      뒤로 단추 추가

  1. 삽입 탭에서 갤러리를 클릭하거나 탭한 다음, 세로를 클릭하거나 탭합니다.On the Insert tab, click or tap Gallery, then Vertical.

    세로 갤러리 추가

  2. 오른쪽 창의 레이아웃 메뉴에서 제목, 부제목, 본문을 선택합니다.Select Title, subtitle, and body from the Layout menu in the right pane.

    갤러리 레이아웃 변경

    이제 갤러리에 올바른 레이아웃이 있지만 여전히 기본 샘플 텍스트가 있습니다.The gallery now has the right layout, but it still has the default sample text. 다음으로 이 문제를 해결하겠습니다.We'll fix that next.

    기본 텍스트가 있는 갤러리

  3. 갤러리에 대해 다음 속성을 설정합니다.Set the following properties for the gallery:

    • BorderThickness 속성 = 1BorderThickness property = 1
    • BorderStyle 속성 = DottedBorderStyle property = Dotted
    • Items 속성 = Filter('프로젝트 세부 정보', PMAssigned="할당되지 않음").Items property = Filter('Project Details', PMAssigned="Unassigned"). 관리자가 할당되지 않은 프로젝트만 갤러리에 포함됩니다.Only projects with no manager assigned are included in the gallery.

      목록에서 텍스트가 있는 갤러리

  4. 오른쪽 창에서 다음 목록과 일치하도록 필드를 업데이트합니다.In the right pane, update the fields to match the following list:

    • ApprovedDateApprovedDate
    • StatusStatus
    • TitleTitle

      갤러리 필드

  5. 갤러리의 레이블 크기를 적절히 조정하고, 첫 번째 갤러리 항목에서 화살표를 제거합니다(이 갤러리에서 아무 곳도 탐색할 필요가 없음).Resize labels in the gallery as appropriate, and remove the arrow from the first gallery item (we don't need to navigate anywhere from this gallery).

    화살표 아이콘 제거

    이제 화면은 다음 이미지와 같습니다.The screen should now look like the following image.

    서식이 지정된 갤러리

선택한 항목의 색 변경Change the color of an item if it's selected

  1. 갤러리를 선택한 다음 TemplateFill 속성을 If (ThisItem.IsSelected=true, Orange, White)로 설정합니다.Select the gallery, then set the TemplateFill property to If (ThisItem.IsSelected=true, Orange, White).
  2. 갤러리에서 항목을 선택합니다.Select an item in the gallery. 이제 화면은 다음 이미지와 같습니다.The screen should now look like the following image.

    선택한 항목이 있는 갤러리

레이블, 텍스트 입력 및 확인 단추를 추가하여 관리자 할당 제출Add a label, text input, and OK button to submit manager assignments

  1. 작업하고 있는 갤러리 외부를 클릭하거나 탭합니다.Click or tap outside the gallery you've been working on.
  2. 삽입 탭에서 레이블을 클릭하거나 탭합니다.On the Insert tab, click or tap Label. 갤러리 아래의 레이블을 왼쪽으로 끕니다.Drag the label below the gallery, to the left. 레이블에 대해 다음 속성을 설정합니다.Set the following properties for the label:

    • Size 속성 = 20Size property = 20
    • Text 속성 = "관리자:"Text property = "Manager:"

    관리자 레이블 추가

  3. 삽입 탭에서 텍스트, 텍스트 입력을 차례로 클릭하거나 탭합니다.On the Insert tab, click or tap Text, then Text input. 갤러리 아래의 텍스트 입력을 가운데로 끕니다.Drag the text input below the gallery, in the center. 드롭다운에 대해 다음 속성을 설정합니다.Set the following properties for the drop down:

    • Default 속성 = ""Default property = ""
    • Height 속성 = 60Height property = 60
    • Size 속성 = 20Size property = 20
    • Width 속성 = 250Width property = 250

    텍스트 입력 추가

  4. 삽입 탭에서 단추를 클릭하거나 탭합니다.On the Insert tab, click or tap Button. 갤러리 아래의 단추를 오른쪽으로 끕니다.Drag the button below the gallery, to the right. 단추에 대해 다음 속성을 설정합니다.Set the following properties for the button:

    • Height 속성 = 60Height property = 60
    • OnSelect 속성 = Patch('프로젝트 세부 정보', LookUp('프로젝트 세부 정보', ID = Gallery1.Selected.ID), {PMAssigned: TextInput1.Text}).OnSelect property = Patch('Project Details', LookUp('Project Details', ID = Gallery1.Selected.ID), {PMAssigned: TextInput1.Text}). 자세한 내용은 수식 심층 분석을 참조하세요.For more information, see Formula deep-dive.
    • 이 수식은 프로젝트 세부 정보 목록을 업데이트하고 PMAssigned 필드에 대한 값을 설정합니다.This formula updates the Project Details list, setting a value for the PMAssigned field.
    • Size 속성 = 20Size property = 20
    • Text 속성 = "확인"Text property = "OK"
    • Width 속성 = 80Width property = 80

    확인 단추 추가

이제 완성된 화면은 다음 이미지와 같습니다.The completed screen should now look like the following image.

완성된 관리자 할당 화면

5단계: ViewProjects 화면 빌드Step 5: Build the ViewProjects screen

이 단계에서는 ViewProjects 화면에서 갤러리에 대한 속성을 변경합니다.In this step, we'll change properties for the gallery on the ViewProjects screen. 이 갤러리에는 프로젝트 세부 정보 목록의 항목이 표시됩니다.This gallery displays items from the Project Details list. 이 화면에서 항목을 선택한 다음, UpdateDetails 화면에서 세부 정보를 편집합니다.You select an item on this screen, then you edit the details on the UpdateDetails screen.

  1. 왼쪽 탐색 모음에서 ViewProjects 화면을 클릭하거나 탭합니다.In the left navigation bar, click or tap the ViewProjects screen.
  2. [제목]"프로젝트 보기"로 변경합니다.Change [Title] to "View Projects".
  3. 왼쪽 탐색 모음에서 ViewProjects 아래의 BrowserGallery1을 클릭하거나 탭합니다.In the left navigation bar, click or tap BrowserGallery1 under ViewProjects.
  4. 오른쪽 창의 레이아웃 메뉴에서 제목, 부제목, 본문을 선택합니다.Select Title, subtitle, and body from the Layout menu in the right pane.

    갤러리 레이아웃 변경

    이제 갤러리에는 기본 샘플 텍스트가 있는 올바른 레이아웃이 있습니다.The gallery now has the right layout, with the default sample text.

    기본 텍스트가 있는 갤러리

  5. 새로 고침 단추 새로 고침 아이콘을 선택하고, OnSelect 속성을 Refresh('프로젝트 세부 정보')로 설정합니다.Select the refresh button Refresh icon, and set its OnSelect property to Refresh('Project Details').
  6. 새 항목 단추 새 아이콘 추가를 선택하고, OnSelect 속성을 NewForm(EditForm1); Navigate(UpdateDetails, ScreenTransition.None)으로 설정합니다.Select the new item button Add new icon, and set its OnSelect property to NewForm(EditForm1); Navigate(UpdateDetails, ScreenTransition.None).

SelectTask 화면으로 돌아가는 뒤로 화살표 추가Add a back arrow to return to the SelectTask screen

  1. 왼쪽 탐색 모음에서 AssignManager 화면을 클릭하거나 탭합니다.In the left navigation bar, click or tap the AssignManager screen.
  2. 여기에 추가한 뒤로 화살표를 선택하고 복사합니다.Select the back arrow you added there, and copy it.
  3. 화살표를 ViewProjects 화면에 붙여넣고, 새로 고침 단추의 왼쪽에 배치합니다.Paste the arrow into the ViewProjects screen and position it to the left of the refresh button.

    뒤로 단추

    Navigate(SelectTask, Fade)OnSelect 속성을 포함하여 모든 속성이 함께 제공됩니다.All its properties come along with it, including the OnSelect property of Navigate(SelectTask, Fade).

  1. BrowseGallery1 갤러리를 선택하고, 갤러리의 Items 속성을 SortByColumns(Filter('프로젝트 세부 정보', StartsWith(Title, TextSearchBox1.Text)), "제목", If(SortDescending1, Descending, Ascending))으로 설정합니다.Select the BrowseGallery1 gallery, and set the Items property of the gallery to SortByColumns(Filter('Project Details', StartsWith(Title, TextSearchBox1.Text)), "Title", If(SortDescending1, Descending, Ascending)).

    이렇게 하면 갤러리의 데이터 원본이 프로젝트 세부 정보 목록에 설정되고 Title 필드가 검색 및 정렬에 사용됩니다.This sets the data source of the gallery to the Project Details list, and uses the Title field for search and sort.

  2. 첫 번째 갤러리 항목에서 세부 정보 화살표 아이콘을 선택하고, OnSelect 속성을 Navigate(UpdateDetails, None)으로 설정합니다.Select the Details arrow icon in the first gallery item, and set the OnSelect property to Navigate(UpdateDetails, None).

     <span data-ttu-id="53987-322">프로젝트 보기 갤러리 - 선택된 첫 번째 항목</span><span class="sxs-lookup"><span data-stu-id="53987-322">View Projects gallery - first item selected</span></span>

  3. 오른쪽 창에서 다음 목록과 일치하도록 필드를 업데이트합니다.In the right pane, update the fields to match the following list:

    • StatusStatus
    • PMAssignedPMAssigned
    • TitleTitle

      갤러리 필드

      이제 완성된 화면은 다음 이미지와 같습니다.The completed screen should now look like the following image.

      완성된 프로젝트 보기 화면

6단계: UpdateDetails 화면 빌드Step 6: Build the UpdateDetails screen

이 단계에서는 UpdateDetails 화면의 편집 양식을 데이터 원본에 연결하고, 일부 속성 및 필드를 변경합니다.In this step, we'll connect the edit form on the UpdateDetails screen to our data source, and we'll make some property and field changes. 이 화면에서 프로젝트 보기 화면에서 선택한 프로젝트에 대한 세부 정보를 편집합니다.On this screen, you edit details for a project that you selected on the View Projects screen.

  1. 왼쪽 탐색 모음에서 UpdateDetails 화면을 클릭하거나 탭합니다.In the left navigation bar, click or tap the UpdateDetails screen.
  2. [제목]"세부 정보 업데이트"로 변경합니다.Change [Title] to "Update Details".
  3. 왼쪽 탐색 모음에서 UpdateDetails 아래의 EditForm1을 클릭하거나 탭합니다.In the left navigation bar, click or tap EditForm1 under UpdateDetails.
  4. 양식에 대해 다음 속성을 설정합니다.Set the following properties for the form:

    • DataSource 속성 = '프로젝트 세부 정보'DataSource property = 'Project Details'
    • Item 속성 = BrowseGallery1.SelectedItem property = BrowseGallery1.Selected
  5. 양식이 선택되어 있는 상태에서 오른쪽 창에 표시된 순서대로 다음 필드의 확인란을 클릭하거나 탭합니다.With the form still selected, in the right pane click or tap the checkbox for the following fields, in the order shown:

    • TitleTitle
    • PMAssignedPMAssigned
    • StatusStatus
    • ProjectedStartDateProjectedStartDate
    • ProjectedEndDateProjectedEndDate
    • ProjectedDaysProjectedDays
    • ActualDaysActualDays

      양식 편집 필드

  6. 취소 단추 취소 아이콘을 선택하고, OnSelect 속성을 ResetForm(EditForm1); Back()으로 설정합니다.Select the cancel button Cancel icon, and set its OnSelect property to ResetForm(EditForm1); Back().
  7. 저장 단추 저장 확인 표시 아이콘을 선택하고, OnSelect 수식 - SubmitForm(EditForm1)을 확인 표시합니다.Select the save button Checkmark save icon and check out the OnSelect formula - SubmitForm(EditForm1). 편집 양식 컨트롤을 사용하므로 이전처럼 Patch() 대신 Submit()을 사용할 수 있습니다.Because we're using the edit form control, we can use Submit(), instead of using Patch() like we did earlier.

이제 완성된 화면은 다음 이미지와 같습니다(필드가 비어 있으면 프로젝트 보기 화면에서 항목을 선택했는지 확인합니다).The completed screen should now look like the following image (if the fields are blank, make sure you select an item on the View Projects screen).

세부 정보 업데이트 화면이 완성되었습니다.

7단계: 앱 실행Step 7: Run the app

이제 앱이 완성되었으므로 앱을 실행하여 앱이 어떻게 작동하는지 살펴보겠습니다.Now that the app is complete, let's run it to see how it works. SharePoint 사이트의 링크를 앱에 추가하겠습니다.We'll add a link on the SharePoint site to the app. 브라우저에서 앱을 실행할 수는 있지만 다른 사람이 앱을 실행하려면 앱을 공유해야 할 수도 있습니다.You will be able to run the app in the browser, but you might need to share the app for other people to run it. 자세한 내용은 앱 공유를 참조하세요.For more information, see Share your apps.

  1. Office 365 앱 시작 관리자에서 PowerApps를 클릭하거나 탭합니다.In the Office 365 app launcher, click or tap PowerApps.

    Office 365 앱 시작 관리자의 PowerApps

  2. PowerApps에서 프로젝트 관리 앱에 대한 줄임표(. . .), 열기를 차례로 클릭하거나 탭합니다.In PowerApps, click or tap the ellipsis (. . .) for Project Management app, then Open.

    프로젝트 관리 앱 선택

  3. 브라우저에서 앱에 대한 주소(URL)를 복사합니다.Copy the address (URL) for the app in the browser.

    앱 URL 복사

  4. SharePoint에서 링크 편집을 클릭하거나 탭합니다.In SharePoint, click or tap EDIT LINKS.

    SharePoint 사이트 링크 편집

  5. (+) 링크를 클릭하거나 탭합니다.Click or tap (+) link.

    SharePoint 사이트에 앱 링크 추가

  6. "프로젝트 관리 앱"을 입력하고 앱에 대한 주소에 붙여넣습니다.Enter "Project Management app", and paste in the address for the app.

    링크 속성 편집

  7. 확인, 저장을 차례로 클릭하거나 탭합니다.Click or tap OK, then Save.

    링크 변경 내용 저장

프로젝트에 관리자 할당Assign a manager to a project

이제 SharePoint 사이트에 앱을 만들었으므로 프로젝트 승인자 역할을 맡을 것입니다. 관리자가 할당되지 않은 프로젝트를 찾아서 해당 프로젝트 중 하나에 관리자를 할당합니다.Now that we have the app in our SharePoint site, we'll assume the role of the project approver - we'll look for any projects that don't have a manager assigned, and assign a manager to one of the projects. 그런 다음 프로젝트 관리자의 역할을 맡고 할당된 프로젝트에 대한 정보를 추가합니다.Then we'll assume the role of the project manager, and add some information about a project that is assigned to us.

  1. 먼저 SharePoint에서 프로젝트 세부 정보 목록을 살펴보겠습니다.First, let's look at the Project Details list in SharePoint. PMAssigned 열에 할당되지 않음 값이 있는 두 프로젝트가 있습니다.Two projects have a value of Unassigned in the PMAssigned column. 앱에서 이러한 프로젝트를 확인합니다.We will see these in the app.

    SharePoint 목록에 있는 할당되지 않은 프로젝트

  2. 앱에 대해 만든 링크를 클릭하거나 탭합니다.Click or tap the link that you created to the app.
  3. 첫 번째 화면에서 관리자 할당을 클릭하거나 탭합니다.On the first screen, click or tap Assign Manager.

    앱 소개 화면

  4. 관리자 할당 화면의 목록에서 할당되지 않은 두 개의 프로젝트가 표시됩니다.On the Assign Manager screen, you see the two unassigned projects from the list. 새 BI 소프트웨어 프로젝트를 선택합니다.Select the New BI software project.

    선택한 항목이 있는 갤러리

  5. 관리자 텍스트 입력에서 "Joni Sherman"을 입력한 다음 확인을 클릭합니다.In the Manager text input, enter "Joni Sherman", then click OK.

    변경 내용을 목록에 적용하고 갤러리를 새로 고치므로 할당되지 않은 나머지 프로젝트만 표시됩니다.The change is applied to the list, and the gallery refreshes so only the remaining unassigned project is displayed.

    프로젝트에 관리자 할당

  6. SharePoint 목록으로 돌아가서 페이지를 새로 고칩니다.Go back to the SharePoint list and refresh the page. 이제 프로젝트 항목이 프로젝트 관리자 이름으로 업데이트되었음을 알 수 있습니다.You'll see that the project entry is now updated with the project manager name.

    SharePoint 목록에 할당된 프로젝트 관리자

프로젝트 세부 정보 업데이트Update details for the project

  1. 뒤로 아이콘을 클릭하거나 탭하여 첫 번째 화면으로 돌아간 다음, 세부 정보 업데이트를 클릭하거나 탭합니다.Click or tap Back icon to go back to the first screen, then click or tap Update Details.

    앱 소개 화면

  2. 프로젝트 보기 화면에서 검색 상자에 "새"를 입력합니다.On the View Projects screen, enter "New" in the search box.

    앱 갤러리에서 검색

  3. 새 BI 소프트웨어 항목에 대한 세부 정보 화살표 아이콘을 클릭합니다.Click Details arrow icon for the New BI software item.

    선택한 갤러리 항목

  4. 세부 정보 업데이트 화면에서 다음 값을 설정합니다.On the Update Details screen, set the following values:

    • ProjectedStartDate 필드 = "3/6/2017"The ProjectedStartDate field = "3/6/2017"
    • ProjectedEndDate 필드 = "3/24/2017"The ProjectedEndDate field = "3/24/2017"
    • ProjectedDays 필드 = "15"The ProjectedDays field = "15"

    항목 세부 정보 업데이트

  5. 확인 표시 아이콘을 클릭하거나 탭하여 변경 내용을 SharePoint 목록에 적용합니다.Click or tap Check mark icon to apply the change to the SharePoint list.
  6. 앱을 닫고 목록으로 돌아갑니다.Close the app, and go back to the list. 이제 프로젝트 항목이 변경된 날짜 및 일 수로 업데이트됩니다.You see that the project entry is now updated with the date and day changes.

    업데이트된 SharePoint 목록

수식 심층 분석Formula deep-dive

PowerApps 수식에 있는 선택적인 두 번째 섹션입니다.This is the second optional section on PowerApps formulas. 첫 번째 심층 분석에서 PowerApps가 3개 화면 앱의 찾아보기 갤러리에 대해 생성하는 수식 중 하나를 살펴보았습니다.In the first deep-dive, we looked at one of the formulas that PowerApps generates for the browse gallery in a three-screen app. 이 심층 분석에서는 두 번째 앱의 AssignManager 화면에 사용할 수식을 살펴보겠습니다.In this deep-dive, we'll look at a formula that we use for the AssignManager screen of our second app. 수식은 다음과 같습니다.Here's the formula:

Patch ( '프로젝트 세부 정보', LookUp ( '프로젝트 세부 정보', ID = Gallery1.Selected.ID ), {PMAssigned: TextInput1.Text} )Patch ( 'Project Details', LookUp ( 'Project Details', ID = Gallery1.Selected.ID ), {PMAssigned: TextInput1.Text} )

이 수식에서 수행하는 작업은 무엇일까요?What does this formula do? 갤러리에서 항목을 선택하고 확인 단추를 클릭하면, 수식에서 프로젝트 세부 정보 목록을 업데이트하고, PMAssigned 열을 텍스트 입력에서 지정한 값으로 설정합니다.When you select an item in the gallery and click the OK button, the formula updates the Project Details list, setting the PMAssigned column to the value that you specify in the text input. 수식은 다음 함수를 사용하여 작업을 수행합니다.The formula uses functions to do its work:

  • Patch 함수는 데이터 원본의 레코드를 하나 이상 수정합니다.The Patch function modifies one or more records of a data source.
  • LookUp 함수는 수식을 충족하는 테이블의 첫 번째 레코드를 찾습니다.The LookUp function finds the first record in a table that satisfies a formula.

수식에 함수를 함께 배치하면 다음과 같은 상황이 발생합니다.When you put the functions together in the formula, here's what happens:

  1. 확인 단추를 클릭하면 Patch 함수가 호출되어 프로젝트 세부 정보 목록을 업데이트합니다.When you click the OK button, the Patch function is called to update the Project Details list.
  2. Patch 함수 내에서 LookUp 함수는 업데이트할 프로젝트 세부 정보 목록의 행을 식별합니다.Within the Patch function, the LookUp function identifies which row of the Project Details list to update. 이는 선택한 갤러리 항목의 ID를 목록의 ID와 비교하여 수행합니다.It does this by comparing the ID of the selected gallery item to the ID in the list. 예를 들어 12라는 ID는 새 BI 소프트웨어에 대한 항목을 업데이트해야 함을 의미합니다.For example, an ID of 12 means that the entry for New BI software should be updated.
  3. Patch 함수에 올바른 ID가 있으므로 PMAssigned 필드가 TextInput1.Text의 값으로 업데이트됩니다.Now that the Patch function has the right ID, it updates the PMAssigned field to the value in TextInput1.Text.

다음 단계Next steps

이 자습서 시리즈의 다음 단계에서는 프로젝트를 분석하는 Power BI 보고서를 만듭니다.The next step in this tutorial series is to create a Power BI report to analyze projects.