Vytvorenie aplikácie s plátnom na spravovanie projektovCreate a canvas app to manage projects

Poznámka

Tento článok je súčasťou série kurzov o používaní služieb PowerApps, Microsoft Flow a Power BI s lokalitou SharePoint Online.This article is part of a tutorial series on using PowerApps, Microsoft Flow, and Power BI with SharePoint Online. Aby ste získali ucelenú predstavu, ako aj príslušné súbory na stiahnutie, prečítajte si Úvod k sérii.Make sure you read the series introduction to get a sense of the big picture, as well as related downloads.

V tejto úlohe zostavíme aplikáciu s plátnom úplne od začiatku.In this task, we'll build a canvas app from scratch. Táto aplikácia umožňuje používateľom priradiť k projektom správcu a aktualizovať podrobnosti projektu.This app allows a user to assign a manager to projects and to update project details. Použijete niektoré rovnaké ovládacie prvky a vzorce, ktoré ste videli v prvej aplikácii, ale tentokrát vytvoríte väčšiu časť aplikácie sami.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. Tento proces je zložitejšie, ale naučíte sa toho viac, čo je podľa nás férový kompromis.The process is more complex, but you'll learn more, so we think it's a fair trade-off.

Tip

Balík na stiahnutie pre tento scenár obsahuje hotovú verziu tejto aplikácie: project-details-app.msapp.The download package for this scenario includes a finished version of this app: project-details-app.msapp.

Rýchly prehľad aplikácie PowerApps StudioQuick review of PowerApps Studio

Aplikácia PowerApps Studio má tri tably a pás s nástrojmi, vďaka ktorým sa vytváranie aplikácií podobá vytváraniu prezentácie v aplikácii PowerPoint:PowerApps Studio has three panes and a ribbon that make app creation feel like building a slide deck in PowerPoint:

  1. Ľavý navigačný panel s hierarchickým zobrazením všetkých obrazoviek a ovládacích prvkov aplikácie, ako aj miniatúr obrazoviek.Left navigation bar, which shows a hierarchical view of all the app's screens and controls, as well as thumbnails of the screens
  2. Prostredná tabla obsahujúca obrazovku aplikácie, na ktorej pracujete.Middle pane, which contains the app screen you are working on
  3. Pravá tabla, kde nastavujete možnosti, ako sú rozloženie a zdroje údajov.Right-hand pane, where you set options like layout and data sources
  4. Rozbaľovací zoznam vlastností, kde môžete vybrať vlastnosti, ku ktorým se vzťahujú vzorce.Property drop-down list, where you select the properties that formulas apply to
  5. Riadok vzorcov, kde môžete pridávať vzorce (ako v programe Excel), ktoré definujú správanie aplikácie.Formula bar, where you add formulas (like in Excel) that define app behavior
  6. Pás s nástrojmi, kde môžete pridať ovládacie prvky a prispôsobiť prvky návrhu.Ribbon, where you add controls and customize design elements

PowerApps Studio

Krok 1: Zostavenie obrazoviekStep 1: Create screens

Po krátkej rekapitulácii sa môžeme pustiť do vytvorenia aplikácie.With that review out of the way, let's start building an app.

Vytvorenie a uloženie aplikácieCreate and save the app

  1. V aplikácii PowerApps Studio kliknite alebo ťuknite na možnosť Nový a potom v oblasti Prázdna aplikácia kliknite alebo ťuknite na položku Rozloženie pre telefón.In PowerApps Studio, click or tap New, then under Blank app, click or tap Phone Layout.

    Prázdna aplikácia – rozloženie pre telefón

  2. Kliknite alebo ťuknite na položku Súbor, čím sa otvorí karta Nastavenia aplikácie. Zadajte názov „Aplikácia pre riadenie projektov“.Click or tap File, which opens to an App settings tab. Enter the name "Project Management app".

    Názov aplikácie

  3. Kliknite alebo ťuknite na položku Uložiť ako, overte, že sa aplikácia uloží do cloudu, a potom kliknite na tlačidlo Uložiť v pravom dolnom rohu.Click or tap Save as, verify that the app will save to the cloud, then click Save in the lower right corner.

    Uloženie do cloudu

  4. Kliknutím alebo ťuknutím na ikonuClick or tap ikona návratu do aplikácie sa vráťte späť do aplikácie.to go back to the app.

Pridanie štyroch obrazoviek do aplikácieAdd four screens to the app

V tomto kroku vytvoríme pre aplikácie štyri prázdne obrazovky.In this step, we'll create four blank screens for the app. V závislosti na účele obrazovky použijeme rôzne rozloženia.We'll use different screen layouts, depending on the screen's purpose. Tieto obrazovky dokončíme v ďalších krokoch.We'll add to these screens in later steps.

ObrazovkaScreen ÚčelPurpose
SelectTaskSelectTask Úvodná obrazovka pre prechod na ďalšie obrazovkyOpening screen; navigate to other screens
AssignManagerAssignManager Priradenie manažéra ku schválenému projektuAssign a manager to an approved project
ViewProjectsViewProjects Zobraziť zoznamu projektov so súhrnnými informáciamiView a list of projects, with summary information
UpdateDetailsUpdateDetails Zobrazenie a aktualizácia podrobností projektuView and update the details for a project
  1. Na karte Domov kliknite alebo ťuknite na položku Nová obrazovka a potom na možnosť Posúvateľná obrazovka.On the Home tab, click or tap NewScreen, then Scrollable screen.

    Posúvateľná obrazovka

  2. Premenujte túto obrazovku na SelectTask.Rename the screen to SelectTask.

    Premenovanie obrazovky

  3. Vytvorte a premenujte ďalšie obrazovky:Create and rename additional screens:

    1. Kliknite alebo ťuknite na položku Nová obrazovka, potom na možnosť Posúvateľná obrazovka.Click or tap NewScreen, then Scrollable screen. Premenujte túto obrazovku na AssignManager.Rename the screen to AssignManager.
    2. Kliknite alebo ťuknite na položku Nová obrazovka, potom na možnosť Obrazovka so zoznamom.Click or tap NewScreen, then List screen. Premenujte túto obrazovku na ViewProjects.Rename the screen to ViewProjects.
    3. Kliknite alebo ťuknite na položku Nová obrazovka, potom na možnosť Obrazovka s formulárom.Click or tap NewScreen, then Form screen. Premenujte túto obrazovku na UpdateDetails.Rename the screen to UpdateDetails.
  4. Vyberte tri bodky (. . .) vedľa možnosti Screen1, potom kliknite alebo ťuknite na položku Odstrániť.Select the ellipsis (. . .) next to Screen1, then click or tap Delete.

    Odstránenie obrazovky

Aplikácia by mala vyzerať ako na nasledujúcom obrázku.The app should now look like the following image.

Všetky obrazovky aplikácie

Krok 2: Pripojenie k sharepointovému zoznamuStep 2: Connect to a SharePoint list

V tomto kroku sa pripojíme k sharepointovému zoznamu Product Details.In this step, we'll connect to the Product Details SharePoint list. V tejto aplikácii používame iba jeden zoznam, ak však chcete aplikáciu rozšíriť, mohli by ste se jednoducho pripojiť k obom.We only use one list in this app, but you could easily connect to both if you want to extend the app.

  1. V ľavom navigačnom paneli kliknite alebo ťuknite na obrazovku SelectTask.In the left navigation bar, click or tap the SelectTask screen.

  2. V pravej table kliknite alebo ťuknite na položku Pridať zdroj údajov.In the right pane, click or tap Add data source.

    Pripojenie k údajom

  3. Kliknite alebo ťuknite na položku Nové pripojenie.Click or tap New connection.

    Nové pripojenie

  4. Kliknite alebo ťuknite na položku SharePoint.Click or tap SharePoint.

    Pripojenie k službe SharePoint

  5. Vyberte možnosť Pripojiť priamo (cloudové služby), potom kliknite alebo ťuknite na položku Vytvoriť.Select Connect directly (cloud services), then click or tap Create.

    Pripojiť priamo (cloudové služby)

  6. Zadajte URL adresu lokality SharePoint a potom kliknite alebo ťuknite na položku Prejsť.Enter a SharePoint URL, then click or tap Go.

    Adresa URL lokality SharePoint pre pripojenie

  7. Vyberte zoznam Project Details a potom kliknite alebo ťuknite na možnosť Pripojiť.Select the Project Details list, then click or tap Connect.

    Výber zoznamu Project Details

    Na karte Zdroje údajov v pravej table sa teraz zobrazuje vytvorené pripojenie.The Data sources tab in the right pane now shows the connection that you have created.

    Karta Zdroje údajov

Krok 3: Zostavenie obrazovky SelectTaskStep 3: Build the SelectTask screen

V tomto kroku zaistíme prechod na iné obrazovky v aplikácii a budeme pracovať s niektorými ovládacími prvkami, vzorcami a možnosťami formátovania, ktoré služba PowerApps ponúka.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.

Aktualizácia názvu a vloženého úvodného textuUpdate the title and insert introductory text

  1. V ľavom navigačnom paneli vyberte obrazovku SelectTask.In the left navigation bar, select the SelectTask screen.

  2. V prostrednej table vyberte predvolenú možnosť [Názov], potom v riadku vzorcov upravte vlastnosť Text na „Riadenie projektov Contoso“.In the middle pane, select the default [Title], then in the formula bar, update the Text property to "Contoso Project Management".

    Vlastnosť textu v riadku vzorcov

  3. Na karte Vložiť kliknite alebo ťuknite na Označenie a presuňte ho pod horný pruh.On the Insert tab, click or tap Label, then drag the label down below the top banner.

    Pridanie označenia

  4. V riadku vzorcov nastavte nasledujúce vlastnosti tohto označenia:In the formula bar, set the following properties for the label:

    • Vlastnosť Color = DarkGrayColor property = DarkGray

    • Vlastnosť Size = 18Size property = 18

    • Vlastnosť Text = "Pokračujte kliknutím alebo ťuknutím na úlohu..."Text property = "Click or tap a task to continue..."

      Aktualizácia textu označenia

Pridanie dvoch navigačných tlačidielAdd two navigation buttons

  1. Na karte Vložiť kliknite alebo ťuknite na Tlačidlo a presuňte ho pod horný pruh.On the Insert tab, click or tap Button, then drag the button below the label.

    Pridanie tlačidla

  2. V riadku vzorcov nastavte nasledujúce vlastnosti tohto tlačidla:In the formula bar, set the following properties for the button:

    • Vlastnosť OnSelect = Navigate(AssignManager, Fade).OnSelect property = Navigate(AssignManager, Fade). Keď spustíte aplikáciu a kliknite na toto tlačidlo, prejdete na druhú obrazovku, pričom medzi obrazovkami sa použije prechod zmiznutia.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.

    • Vlastnosť Text = "Priradiť manažéra"Text property = "Assign Manager"

  3. Zmeňte veľkosť tlačidla podľa textu.Resize the button to accommodate the text.

    Aktualizácia textu tlačidla

  4. Vložte ďalšie tlačidlo s nasledujúcimi vlastnosťami:Insert another button with the following properties:

    • Vlastnosť OnSelect = Navigate(ViewProjects, Fade).OnSelect property = Navigate(ViewProjects, Fade).

    • Vlastnosť Text = "Aktualizovať podrobnosti"Text property = "Update Details"

      Aktualizácia textu tlačidla

      Poznámka

      Toto tlačidlo má názov Aktualizovať podrobnosti, ale najskôr prejdeme na obrazovku ViewProjects, kde vyberieme vyberte projekt, ktorý sa má aktualizovať.The button is labeled Update Details, but we first navigate to the ViewProjects screen to select a project to update.

Spustenie aplikácieRun the app

Aplikácia zatiaľ toho veľa nezvláda, napriek tomu ju však môžete spustiť:The app doesn't do a lot yet, but you can run it if you like:

  1. Kliknite alebo ťuknite na obrazovku SelectTask (v režime ukážky v nástroji PowerApps Studio sa aplikácia vždy spustí z vybranej obrazovky).Click or tap the SelectTask screen (the app always starts from the selected screen in Preview mode in PowerApps Studio).

  2. Kliknutím alebo ťuknutím na ikonuClick or tap Ikona spustenia aplikácie vpravo hore spustite aplikáciu.in the upper right corner to run the app.

  3. Kliknutím alebo ťuknutím na niektoré z tlačidiel prejdete na inú obrazovku.Click or tap one of the buttons to navigate to another screen.

  4. Kliknutím alebo ťuknutím na ikonuClick or tap Ikona zavretia ukážky aplikácie vpravo hore zavrite aplikáciu.in the upper right corner to close the app.

Krok 4: Zostavenie obrazovky AssignManagerStep 4: Build the AssignManager screen

V tomto kroku zobrazíme pomocou galérie všetky projekty, ktoré sú schválené, ale nemajú zatiaľ manažéra.In this step, we'll use a gallery to display all projects that have been approved but don't yet have a manager. Pridáme ďalšie ovládacie prvky, aby ste mohli manažéra pridať.We'll add other controls, so you can assign a manager.

Poznámka

Neskôr vytvoríme v aplikácii stránku, ktorá umožní upraviť všetky polia projektu (vrátane poľa s manažérom), ale podľa nás by bolo skvelé vytvoriť tiež takú obrazovku.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. Uložte zmeny, ktoré sme zatiaľ vykonali.Save the changes you've made so far.

  2. V ľavom navigačnom paneli kliknite alebo ťuknite na obrazovku AssignManager.In the left navigation bar, click or tap the AssignManager screen.

Aktualizácia názvu a vloženého úvodného textuUpdate the title and insert introductory text

  1. Zmeňte [Názov] na Priradiť manažéra.Change [Title] to Assign Manager.

  2. Pridajte označenie s nasledujúcimi vlastnosťami:Add a label with the following properties:

    • Vlastnosť Color = DarkGrayColor property = DarkGray

    • Vlastnosť Size = 18Size property = 18

    • Vlastnosť Text = "Vyberte projekt a priraďte manažéra"Text property = "Select a project, then assign a manager"

      Rozloženie priradenia správcu

Pridanie šípky späť pre návrat na obrazovku SelectTaskAdd a back arrow to return to the SelectTask screen

  1. Kliknite alebo ťuknite na modrý pruh v hornej časti obrazovky.Click or tap the blue bar at the top of the screen.

  2. Na karte Vložiť kliknite alebo ťuknite na položku Ikony a potom kliknite alebo ťuknite na možnosť Vľavo.On the Insert tab, click or tap Icons, then click or tap Left.

    Vloženie šípka doľava

  3. Presuňte túto šípku na ľavú stranu modrého pruhu a nastavte nasledujúce vlastnosti:Move the arrow to the left side of the blue bar, and set the following properties:

    • Vlastnosť Color = WhiteColor property = White

    • Vlastnosť Height = 40Height property = 40

    • Vlastnosť OnSelect = Navigate(SelectTask, Fade)OnSelect property = Navigate(SelectTask, Fade)

    • Vlastnosť Width = 40Width property = 40

      Pridanie tlačidla späť

  1. Na karte Vložiť kliknite alebo ťuknite na položku Galéria a potom na Zvisle.On the Insert tab, click or tap Gallery, then Vertical.

    Pridanie zvislej galérie

  2. V ponuke Rozloženie v pravej table vyberte možnosť Nadpis, podnadpis a telo.Select Title, subtitle, and body from the Layout menu in the right pane.

    Zmena rozloženia galérie

    Galéria má teraz správne rozloženie, ale stále obsahuje predvolené ukážkový text.The gallery now has the right layout, but it still has the default sample text. Hneď to opravíme.We'll fix that next.

    Galéria s predvoleným textom

  3. Nastavte pre galériu nasledujúce vlastnosti:Set the following properties for the gallery:

    • Vlastnosť BorderThickness = 1BorderThickness property = 1

    • Vlastnosť BorderStyle = DottedBorderStyle property = Dotted

    • Vlastnosť Items = Filter('Project Details', PMAssigned="Unassigned").Items property = Filter('Project Details', PMAssigned="Unassigned"). Galéria bude obsahovať iba projekty bez priradeného manažéra.Only projects with no manager assigned are included in the gallery.

      Galéria s textom zo zoznamu

  4. V pravej table aktualizujte polia podľa nasledujúceho zoznamu:In the right pane, update the fields to match the following list:

    • ApprovedDateApprovedDate

    • StatusStatus

    • TitleTitle

      Polia galérie

  5. Podľa potreby zmeňte veľkosť označení v galérii a odstráňte šípku z prvej položky galérie (z tejto galérie nepotrebujeme nikam prechádzať).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).

    Odstránenie ikony šípky

    Obrazovka by mala vyzerať ako na nasledujúcom obrázku.The screen should now look like the following image.

    Naformátovaná galéria

Zmena farby vybratej položkyChange the color of an item if it's selected

  1. Vyberte galériu a vlastnosť TemplateFill nastavte na If (ThisItem.IsSelected=true, Orange, White).Select the gallery, then set the TemplateFill property to If (ThisItem.IsSelected=true, Orange, White).

  2. Vyberte v galérii ľubovoľnú položku.Select an item in the gallery. Obrazovka by mala vyzerať ako na nasledujúcom obrázku.The screen should now look like the following image.

    Galéria s vybratou položkou

Pridanie označenia, vstupu textu a tlačidla OK, ktoré odošle priradenie manažéraAdd a label, text input, and OK button to submit manager assignments

  1. Kliknite alebo ťuknite mimo galérie, s ktorou ste pracovali.Click or tap outside the gallery you've been working on.

  2. Na karte Vložiť kliknite alebo ťuknite na položku Označenie.On the Insert tab, click or tap Label. Presuňte toto označenie doľava pod galériu.Drag the label below the gallery, to the left. Nastavte pre označenie nasledujúce vlastnosti:Set the following properties for the label:

    • Vlastnosť Size = 20Size property = 20

    • Vlastnosť Text = "Manažér:"Text property = "Manager:"

    Pridanie označenia Manažér

  3. Na karte Vložiť kliknite alebo ťuknite na položku Text a potom kliknite alebo ťuknite na položku Vstup textu.On the Insert tab, click or tap Text, then Text input. Presuňte tento vstup textu do stredu pod galériu.Drag the text input below the gallery, in the center. Nastavte pre rozbaľovací zoznam nasledujúce vlastnosti:Set the following properties for the drop down:

    • Vlastnosť Default = ""Default property = ""

    • Vlastnosť Height = 60Height property = 60

    • Vlastnosť Size = 20Size property = 20

    • Vlastnosť Width = 250Width property = 250

    Pridanie vstupu textu

  4. Na karte Vložiť kliknite alebo ťuknite na položku Tlačidlo.On the Insert tab, click or tap Button. Presuňte toto tlačidlo doprava pod galériu.Drag the button below the gallery, to the right. Nastavte pre tlačidlo nasledujúce vlastnosti:Set the following properties for the button:

    • Vlastnosť Height = 60Height property = 60

    • Vlastnosť OnSelect = Patch('Project Details', LookUp('Project Details', ID = Gallery1.Selected.ID), {PMAssigned: TextInput1.Text}).OnSelect property = Patch('Project Details', LookUp('Project Details', ID = Gallery1.Selected.ID), {PMAssigned: TextInput1.Text}). Ďalšie informácie nájdete v časti Podrobný rozbor vzorca.For more information, see Formula deep-dive.

    • Tento vzorec aktualizuje zoznam Project Details a nastaví hodnotu poľa PMAssigned.This formula updates the Project Details list, setting a value for the PMAssigned field.

    • Vlastnosť Size = 20Size property = 20

    • Vlastnosť Text = "OK"Text property = "OK"

    • Vlastnosť Width = 80Width property = 80

    Pridanie tlačidla OK

Hotová obrazovka by mala vyzerať ako na nasledujúcom obrázku.The completed screen should now look like the following image.

Hotová obrazovka priradenia manažéra

Krok 5: Zostavenie obrazovky ViewProjectsStep 5: Build the ViewProjects screen

V tomto kroku zmeníme vlastnosti galérie na obrazovke ViewProjects.In this step, we'll change properties for the gallery on the ViewProjects screen. V tejto galérii sa zobrazujú položky zo zoznamu Project Details.This gallery displays items from the Project Details list. Vyberte na tejto obrazovke nejakú položku. Jej podrobnosti potom upravíte na obrazovke UpdateDetails.You select an item on this screen, then you edit the details on the UpdateDetails screen.

  1. V ľavom navigačnom paneli kliknite alebo ťuknite na obrazovku ViewProjects.In the left navigation bar, click or tap the ViewProjects screen.

  2. Zmena [Názov] na "Zobraziť projekty".Change [Title] to "View Projects".

  3. V ľavom navigačnom paneli kliknite alebo ťuknite na položku BrowserGallery1 pod ViewProjects.In the left navigation bar, click or tap BrowserGallery1 under ViewProjects.

  4. V ponuke Rozloženie v pravej table vyberte možnosť Nadpis, podnadpis a telo.Select Title, subtitle, and body from the Layout menu in the right pane.

    Zmena rozloženia galérie

    Galéria má teraz správne rozloženie s predvoleným ukážkovým textom.The gallery now has the right layout, with the default sample text.

    Galéria s predvoleným textom

  5. Vyberte tlačidlo pre obnovenie Ikona obnovenia a nastavte jeho vlastnosť OnSelect na Refresh('Project Details').Select the refresh button Refresh icon, and set its OnSelect property to Refresh('Project Details').

  6. Vyberte tlačidlo pre pridanie novej položky Ikona pridania novej položky a nastavte jeho vlastnosť OnSelect na 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).

Pridanie šípky späť pre návrat na obrazovku SelectTaskAdd a back arrow to return to the SelectTask screen

  1. V ľavom navigačnom paneli kliknite alebo ťuknite na obrazovku AssignManager.In the left navigation bar, click or tap the AssignManager screen.

  2. Vyberte šípku späť, ktorú ste sem pridali, a skopírujte ju.Select the back arrow you added there, and copy it.

  3. Prilepte túto šípku na obrazovku ViewProjects a umiestnite ju naľavo od tlačidla pre obnovenie.Paste the arrow into the ViewProjects screen and position it to the left of the refresh button.

    Tlačidlo späť

    Spoločne so šípkou sa prenesú všetky jej vlastnosti vrátane vlastnosti OnSelect nastavenej na Navigate(SelectTask, Fade).All its properties come along with it, including the OnSelect property of Navigate(SelectTask, Fade).

  1. Vyberte galériu BrowseGallery1 a nastavte vlastnosť Items tejto galérie na SortByColumns(Filter('Project Details', StartsWith(Title, TextSearchBox1.Text)), "Title", 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)).

    Tým sa zdroj údajov tejto galérie nastaví na zoznam Project Details a na hľadanie a zoraďovanie sa použije pole Title.This sets the data source of the gallery to the Project Details list, and uses the Title field for search and sort.

  2. Vyberte šípku Ikona šípky podrobností v prvej položke galérie a nastavte vlastnosť OnSelect na Navigate(UpdateDetails, None).Select the Details arrow icon in the first gallery item, and set the OnSelect property to Navigate(UpdateDetails, None).

     Zobrazenie galérie projektov – prvá vybratá položkaView Projects gallery - first item selected

  3. V pravej table aktualizujte polia podľa nasledujúceho zoznamu:In the right pane, update the fields to match the following list:

    • StatusStatus

    • PMAssignedPMAssigned

    • TitleTitle

      Polia galérie

      Hotová obrazovka by mala vyzerať ako na nasledujúcom obrázku.The completed screen should now look like the following image.

      Dokončená obrazovka Zobraziť projekty

Krok 6: Zostavenie obrazovky UpdateDetailsStep 6: Build the UpdateDetails screen

V tomto kroku pripojíme formulár úprav na obrazovke UpdateDetails ku zdroju údajov a vykonáme zmeny niektorých vlastností a polí.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. Na tejto obrazovke upravíte podrobnosti projektu vybratého na obrazovke Zobraziť projekty.On this screen, you edit details for a project that you selected on the View Projects screen.

  1. V ľavom navigačnom paneli kliknite alebo ťuknite na obrazovku UpdateDetails.In the left navigation bar, click or tap the UpdateDetails screen.

  2. Zmeňte [Názov] na "Aktualizovať podrobnosti".Change [Title] to "Update Details".

  3. V ľavom navigačnom paneli kliknite alebo ťuknite na položku EditForm1 pod UpdateDetails.In the left navigation bar, click or tap EditForm1 under UpdateDetails.

  4. Nastavte pre formulár nasledujúce vlastnosti:Set the following properties for the form:

    • Vlastnosť DataSource = 'Project Details'DataSource property = 'Project Details'

    • Vlastnosť Item = BrowseGallery1.SelectedItem property = BrowseGallery1.Selected

  5. Majte tento formulár stále vybratý a v pravej table kliknite alebo ťuknite v uvedenom poradí na začiarkavacie políčka nasledujúcich polí: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

      Úprava polí formulára

  6. Vyberte tlačidlo zrušenia Ikona zrušenia a nastavte jeho vlastnosť OnSelect na ResetForm(EditForm1); Back().Select the cancel button Cancel icon, and set its OnSelect property to ResetForm(EditForm1); Back().

  7. Vyberte tlačidlo uloženia Ikona začiarknutia – uloženie a skontrolujte vzorec OnSelectSubmitForm(EditForm1).Select the save button Checkmark save icon and check out the OnSelect formula - SubmitForm(EditForm1). Keďže používame ovládací prvok formulára úprav, môžeme použiť funkciu Submit() namiesto funkcie Patch(), ako sme to urobili predtým.Because we're using the edit form control, we can use Submit(), instead of using Patch() like we did earlier.

Dokončená obrazovka by teraz mala vyzerať ako na nasledujúcom obrázku (ak sú polia prázdne, skontrolujte, či ste vybrali nejakú položku na obrazovke Zobraziť projekty).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).

Hotová obrazovka aktualizácie podrobností

Krok 7: Spustenie aplikácieStep 7: Run the app

Teraz, keď je aplikácia hotová, môžeme ju spustiť a zistiť, ako funguje.Now that the app is complete, let's run it to see how it works. Odkaz na túto aplikáciu pridáme na lokalitu služby SharePoint.We'll add a link on the SharePoint site to the app. Aplikáciu budete môcť spustiť v prehliadači, môžete ju však tiež zdieľať s inými ľuďmi, ktorí si ju potom môžu spustiť.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. Ďalšie informácie nájdete v článku Zdieľanie aplikácií.For more information, see Share your apps.

  1. V spúšťači aplikácií Office 365 kliknite alebo ťuknite na položku PowerApps.In the Office 365 app launcher, click or tap PowerApps.

    PowerApps v spúšťači aplikácií Office 365

  2. V službe PowerApps kliknite alebo ťuknite na tri bodky (. . .) pre možnosť Aplikácia pre riadenie projektov a potom na položku Otvoriť.In PowerApps, click or tap the ellipsis (. . .) for Project Management app, then Open.

    Výber aplikácie pre riadenie projektov

  3. Skopírujte adresu (URL) aplikácie v prehliadači.Copy the address (URL) for the app in the browser.

    Kopírovanie URL adresy

  4. V lokalite SharePoint kliknite alebo ťuknite na položku UPRAVIŤ PREPOJENIA.In SharePoint, click or tap EDIT LINKS.

    Úprava prepojení na lokality SharePoint

  5. Kliknite alebo ťuknite na (+) prepojenie.Click or tap (+) link.

    Pridanie prepojenia aplikácie na lokalitu SharePoint

  6. Zadajte „Aplikácia pre riadenie projektov“ a prilepte adresu aplikácie.Enter "Project Management app", and paste in the address for the app.

    Úprava vlastností prepojenia

  7. Kliknite alebo ťuknite na položku OK a potom na Uložiť.Click or tap OK, then Save.

    Uloženie zmien prepojenia

Priradenie manažéra k projektuAssign a manager to a project

Keď už máme aplikáciu na lokalite SharePoint, prevezmeme rolu schvaľovateľa projektov – vyhľadáme všetky projekty, ktoré nemajú priradeného manažéra, a priradíme jednému z týchto projektov manažéra.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. Potom prevezmeme rolu projektového manažéra a pridáme niekoľko informácií o projekte, ktorý máme priradený.Then we'll assume the role of the project manager, and add some information about a project that is assigned to us.

  1. Poďme sa najprv pozrieť na zoznam Project Details v službe SharePoint.First, let's look at the Project Details list in SharePoint. Dva projekty majú v stĺpciPMAssigned hodnotu Unassigned.Two projects have a value of Unassigned in the PMAssigned column. Tieto projekty uvidíme v aplikácii.We will see these in the app.

    Nepriradené projekty v sharepointovom zozname

  2. Kliknite alebo ťuknite na prepojenie, ktoré ste pre aplikáciu vytvorili.Click or tap the link that you created to the app.

  3. Na prvej obrazovke kliknite alebo ťuknite na položku Priradiť manažéra.On the first screen, click or tap Assign Manager.

    Úvodná obrazovka aplikácie

  4. Na obrazovke Priradiť manažéra vidíte dva nepriradené projekty zo zoznamu.On the Assign Manager screen, you see the two unassigned projects from the list. Vyberte projekt New BI software.Select the New BI software project.

    Galéria s vybratou položkou

  5. Do vstupu textu Manažér zadajte Joni Sherman a potom kliknite na tlačidlo OK.In the Manager text input, enter "Joni Sherman", then click OK.

    Táto zmena sa aplikuje na zoznam a galéria sa obnoví, takže zostane zobrazený iba jeden zostávajúci nepriradený projekt.The change is applied to the list, and the gallery refreshes so only the remaining unassigned project is displayed.

    Priradenie manažéra projektu

  6. Prejdite späť do sharepointového zoznamu a obnovte stránku.Go back to the SharePoint list and refresh the page. Uvidíte, že záznam projektu je teraz aktualizovaný a zobrazuje meno projektového manažéra.You'll see that the project entry is now updated with the project manager name.

    Projektový manažér priradený v sharepointovom zozname

Aktualizácia podrobností projektuUpdate details for the project

  1. Kliknutím alebo ťuknutím na ikonu Ikona späť sa vráťte späť na prvú obrazovku a potom kliknite alebo ťuknite na Aktualizovať podrobnosti.Click or tap Back icon to go back to the first screen, then click or tap Update Details.

    Úvodná obrazovka aplikácie

  2. Na obrazovke Zobraziť projekty zadajte do vyhľadávacieho poľa slovo „New“.On the View Projects screen, enter "New" in the search box.

    Vyhľadávanie v galérii aplikácií

  3. Kliknite na šípku Ikona šípky podrobností pre položku New BI software.Click Details arrow icon for the New BI software item.

    Vybratá položka galérie

  4. Na obrazovke Aktualizovať podrobnosti nastavte nasledujúce hodnoty:On the Update Details screen, set the following values:

    • Pole ProjectedStartDate = "3/6/2017"The ProjectedStartDate field = "3/6/2017"

    • Pole ProjectedEndDate = "3/24/2017"The ProjectedEndDate field = "3/24/2017"

    • Pole ProjectedDays = "15"The ProjectedDays field = "15"

    Podrobnosti aktualizácie položky

  5. Kliknutím alebo ťuknutím na ikonuClick or tap Ikona znaku začiarknutia a aplikujte túto zmenu na sharepointový zoznam.to apply the change to the SharePoint list.

  6. Zavrite aplikáciu a vráťte sa späť k zoznamu.Close the app, and go back to the list. Uvidíte, že záznam projektu je teraz aktualizovaný a zobrazuje zmeny kalendárnych údajov a dní.You see that the project entry is now updated with the date and day changes.

    Aktualizovaný sharepointový zoznam

Podrobný rozbor vzorcaFormula deep-dive

Toto je druhá voliteľná sekcia týkajúca sa vzorcov služby PowerApps.This is the second optional section on PowerApps formulas. V prvom podrobnom rozbore sme sa pozreli na jeden zo vzorcov, ktorý služba PowerApps generuje pri prechádzaní galérie v aplikácii s tromi obrazovkami.In the first deep-dive, we looked at one of the formulas that PowerApps generates for the browse gallery in a three-screen app. V tomto podrobnom rozbore sa pozrieme na vzorec, ktorý sme použili na obrazovke AssignManager našej druhej aplikácie.In this deep-dive, we'll look at a formula that we use for the AssignManager screen of our second app. Tu je vzorec:Here's the formula:

Patch ( 'Project Details', LookUp ( 'Project Details', ID = Gallery1.Selected.ID ), {PMAssigned: TextInput1.Text} )Patch ( 'Project Details', LookUp ( 'Project Details', ID = Gallery1.Selected.ID ), {PMAssigned: TextInput1.Text} )

Čo tento vzorec robí?What does this formula do? Keď vyberiete určitú položku v galérii a kliknete na tlačidlo OK, aktualizuje tento vzorec zoznam Project Details a nastaví stĺpec PMAssigned na hodnotu zadanú do vstupu textu.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. Vzorec pritom používa tieto funkcie:The formula uses functions to do its work:

  • Funkcia Patch umožňuje zmeniť jeden alebo viacero záznamov zdroja údajov.The Patch function modifies one or more records of a data source.

  • Funkcia LookUp vyhľadá prvý záznam v tabuľke, ktorý vyhovuje vzorcu.The LookUp function finds the first record in a table that satisfies a formula.

Keď tieto funkcie skombinujete spolu v jednom vzorci, stane sa toto:When you put the functions together in the formula, here's what happens:

  1. Po kliknutí na tlačidlo OK sa zavolá funkcia Patch a aktualizuje zoznam Project Details.When you click the OK button, the Patch function is called to update the Project Details list.

  2. Funkcia LookUp v rámci funkcie Patch identifikuje, ktorý riadok zoznamu Project Details sa má aktualizovať.Within the Patch function, the LookUp function identifies which row of the Project Details list to update. Porovnáva pritom ID vybratej položky s ID v zozname.It does this by comparing the ID of the selected gallery item to the ID in the list. ID s hodnotou 12 napríklad znamená, že sa má aktualizovať záznam New BI software.For example, an ID of 12 means that the entry for New BI software should be updated.

  3. Teraz, keď má funkcia Patch správne ID, aktualizuje pole PMAssigned na hodnotu v ovládacom prvku TextInput1.Text.Now that the Patch function has the right ID, it updates the PMAssigned field to the value in TextInput1.Text.

Ďalšie krokyNext steps

Ďalším krokom v tejto sérii kurzov je vytvorenie zostavy Power BI na analýzu projektov.The next step in this tutorial series is to create a Power BI report to analyze projects.