Generieren einer App zum Behandeln von ProjektanforderungenGenerate an app to handle project requests

Hinweis

Dieser Artikel ist Teil einer Reihe von Tutorials zur Verwendung von PowerApps, Microsoft Flow und Power BI mit SharePoint Online.This article is part of a tutorial series on using PowerApps, Microsoft Flow, and Power BI with SharePoint Online. Lesen Sie unbedingt die Einführung zur Reihe durch, um sich einen allgemeinen Überblick zu verschaffen und auf die zugehörigen Downloads zuzugreifen.Make sure you read the series introduction to get a sense of the big picture, as well as related downloads.

Da jetzt die SharePoint-Listen vorhanden sind, können wir unsere erste App erstellen und anpassen.Now that the SharePoint lists are in place, we can build and customize our first app. PowerApps ist in SharePoint integriert, deshalb lässt sich bequem eine einfache App mit drei Bildschirmen direkt aus einer Liste generieren.PowerApps is integrated with SharePoint, so it's easy to generate a basic three screen app directly from a list. Mit dieser App können Sie Übersichts- und Detailinformationen für jedes Listenelement anzeigen, vorhandene Listenelemente aktualisieren und neue Listenelemente erstellen.This app allows you to view summary and detailed information for each list item, update existing list items, and create new list items. Wenn Sie eine App direkt aus einer Liste erstellen, wird die App als Ansicht für diese Liste angezeigt.If you create an app directly from a list, the app appears as a view for that list. Anschließend können Sie die App in einem Browser sowie auf einem Mobiltelefon ausführen.You can then run that app in a browser, as well as on a mobile phone.

Tipp

Das Downloadpaket für dieses Szenario enthält eine vollständige Version dieser App: project-requests-app.msapp.The download package for this scenario includes a finished version of this app: project-requests-app.msapp.

Schritt 1: Generieren einer App aus einer SharePoint-ListeStep 1: Generate an app from a SharePoint list

  1. Klicken oder tippen Sie in der von Ihnen erstellten Liste Project Requests (Projektanforderungen) auf PowerApps und dann auf App erstellen.In the Project Requests list you created, click or tap PowerApps, then Create an app.

    Erstellen einer App

  2. Geben Sie der App einen Namen, z.B. „Project Requests app“ (Projektanforderungen-App), und klicken oder tippen Sie dann auf Erstellen.Give the app a name, like "Project Requests app", then click or tap Create. Wenn die App fertig gestellt wurde, wird sie in PowerApps Studio für Web geöffnet.When the app is ready, it opens in PowerApps Studio for web.

    Einen Namen für die App angeben

Schritt 2: Überprüfen der App in PowerApps StudioStep 2: Review the app in PowerApps Studio

  1. Auf der linken Navigationsleiste von PowerApps Studio wird standardmäßig eine hierarchische Ansicht der Bildschirme und Steuerelemente in der App angezeigt.In PowerApps Studio, the left navigation bar by default shows a hierarchical view of the screens and controls in the app.

    PowerApps Studio mit hierarchischer Ansicht

  2. Klicken oder tippen Sie auf das Symbol „Miniaturansicht“, um die Ansicht zu wechseln.Click or tap the thumbnail icon to switch views.

    Ansichtsauswahl in PowerApps Studio

  3. Klicken oder tippen Sie auf jeden Bildschirm, um ihn im mittleren Bereich anzuzeigen.Click or tap each screen to view it in the middle pane. Es gibt drei Bildschirme:There are three screens:

    (a).(a). Der Bildschirm zum Durchsuchen, in dem Sie die aus der Liste importierten Daten durchsuchen, sortieren und filtern können.The browse screen, where you browse, sort, and filter the data pulled in from the list.

    (b).(b). Der Detailbildschirm, in dem Sie weitere Informationen zu einem Element anzeigen können.The details screen, where you view more detail about an item.

    (c).(c). Der Bildschirm zum Bearbeiten/Erstellen, in dem sie vorhandene Elemente bearbeiten oder neue Elemente erstellen können.The edit/create screen, where you edit an existing item or create a new one.

    PowerApps Studio mit Miniaturansicht

Schritt 3: Anpassen des App-Bildschirms zum DurchsuchenStep 3: Customize the app's browse screen

  1. Klicken oder tippen Sie auf den Bildschirm zum Durchsuchen.Click or tap the browse screen.

    Das Layout dieses Bildschirms enthält einen Katalog zum Anzeigen von Listenelementen sowie weitere Steuerelemente, z.B. eine Suchleiste und eine Sortierschaltfläche.This screen has a layout that contains a gallery to show list items, as well as other controls, like a search bar and sort button.

  2. Wählen Sie den Katalog BrowseGallery1 durch Klicken oder Tippen auf einen beliebigen Eintrag außer dem ersten aus.Select the BrowseGallery1 gallery by clicking or tapping any record except the first one.

    In Katalog suchen

  3. Klicken oder tippen Sie im rechten Bereich unter Eigenschaften auf Projektanforderungen.In the right pane, under Properties, click or tap Project Requests.

  4. Aktualisieren Sie die Felder entsprechend der folgenden Liste:Update the fields to match the following list:

    • RequestDateRequestDate

    • RequestorRequestor

    • TitleTitle

      Katalogfelder

  5. Wählen Sie, während BrowseGallery1 noch ausgewählt ist, die Items-Eigenschaft aus.With BrowseGallery1 still selected, select the Items property.

    Items-Eigenschaft

  6. Ändern Sie die Formel in SortByColumns(Filter('Project Requests', StartsWith(Title, TextSearchBox1.Text)), "Title", If(SortDescending1, Descending, Ascending)).Change the formula to SortByColumns(Filter('Project Requests', StartsWith(Title, TextSearchBox1.Text)), "Title", If(SortDescending1, Descending, Ascending)).

    Die Bearbeitungsleiste

    Dies ermöglicht Ihnen das Sortieren und Suchen nach dem Feld Title (Titel) statt nach dem von PowerApps ausgewählten Standardfeld.This allows you to sort and search by the Title field, instead of the default that PowerApps picked. Weitere Informationen finden Sie unter Detaillierte Erläuterungen zu Formeln.See Formula deep-dive for more information.

  7. Klicken oder tippen Sie auf Datei und anschließend auf Speichern.Click or tap File, then Save. Klicken oder tippen Sie auf Symbol „Zurück zur App“, um zur App zurückzukehren.Click or tap Back to app icon to go back to the app.

Schritt 4: Überprüfen des Detailbildschirms und Bearbeitungsbildschirms der AppStep 4: Review the app's details screen and edit screen

  1. Klicken oder tippen Sie auf den Detailbildschirm.Click or tap the details screen.

    Dieser Bildschirm hat ein anderes Layout, das ein Anzeigeformular enthält, um die Details für ein im Katalog ausgewähltes Element anzuzeigen.This screen has a different layout that contains a display form to show the details for an item selected in the gallery. Es enthält Steuerelemente zum Bearbeiten und Löschen von Elementen und ein Steuerelement, mit dem Sie zum Bildschirm zum Durchsuchen zurückkehren können.It has controls to edit and delete items, and to go back to the browse screen.

    Formular zum Anzeigen von Details

  2. Klicken oder tippen Sie auf den Bearbeitungsbildschirm.Click or tap the edit screen.

    Dieser Bildschirm enthält ein Bearbeitungsformular zum Bearbeiten des ausgewählten Elements oder Erstellen eines neuen Elements (wenn Sie vom Bildschirm zum Durchsuchen direkt zu diesem Bildschirm wechseln).This screen contains an edit form to edit the selected item, or create a new one (if you come here directly from the browse screen). Es enthält Steuerelemente zum Speichern oder Verwerfen von Änderungen.It has controls to save or discard changes.

    Bearbeitungsformular

Schritt 5: Ausführen der App aus der ListeStep 5: Run the app from the list

  1. Klicken oder tippen Sie in der Liste Project Requests (Projektanforderungen) auf Alle Elemente und dann auf Project Requests app (Projektanforderungen-App).In the Project Requests list, click or tap All Items, then Project Requests app.

    Projektanforderungen-App anzeigen

  2. Klicken Sie auf Öffnen, um die App in einer neuen Browserregisterkarte zu öffnen.Click Open, which opens the app in a new browser tab.

    Projektanforderungen-App öffnen

  3. Klicken oder tippen Sie in der App aufIn the app, click or tap Symbol „Zur App wechseln“ für das erste Element im Katalog zum Durchsuchen.for the first item in the browse gallery.

    Erstes Katalogelement

  4. Klicken oder tippen Sie aufClick or tap Stift-Bearbeitungssymbol um das Element zu bearbeiten.to edit the item.

  5. Aktualisieren Sie das Feld Description (Beschreibung) – ändern Sie das letzte Wort „Gruppe“ in „Team“, und klicken oder tippen Sie dann auf Häkchensymbol.Update the Description field – change the last word from "group" to "team," then click or tap Check mark icon

    Feld „Description“ (Beschreibung) aktualisieren

  6. Schließen Sie die Browserregisterkarte.Close the browser tab.

  7. Kehren Sie zur Liste Project Requests (Projektanforderungen) zurück, klicken oder tippen Sie auf Project Requests app (Projektanforderungen-App) und dann auf Alle Elemente.Go back to the Project Requests list, click or tap Project Requests app, then All Items.

    Alle Elemente anzeigen

  8. Überprüfen Sie die Änderung, die Sie in der App vorgenommen haben.Verify the change you made from the app.

    Bearbeitung überprüfen

Dies ist eine recht einfache App, und wir haben nur einige grundlegende Anpassungen vorgenommen. Sie sehen aber, dass sich schnell etwas Interessantes erstellen lässt.This is a pretty simple app, and we only made a few basic customizations, but you can see it's possible to quickly build something interesting. Wir fahren jetzt mit der nächsten Aufgabe fort. Wenn Sie möchten, können Sie sich jedoch die App etwas genauer anschauen, um zu sehen, wie die Steuerelemente und Formeln das Verhalten der App steuern.We're going to move on to the next task, but look around the app a little more if you want, and see how the controls and formulas work together to drive app behavior.

Detaillierte Erläuterung zu FormelnFormula deep-dive

Dieser Abschnitt ist optional, er bietet Ihnen jedoch ein tieferes Verständnis der Funktionsweise von Formeln.This section is optional, but it will help you understand more about how formulas work. In Schritt 3 dieser Aufgabe haben wir die Formel für die Items-Eigenschaft von BrowseGallery1 geändert.In step 3 of this task, we modified the formula for the Items property of BrowseGallery1. Diese Änderung bewirkte, dass beim Sortieren und Suchen das Feld Title (Titel) statt des von PowerApps ausgewählten Felds verwendet wird.Specifically, we changed the sort and search to use the Title field, instead of the field that PowerApps picked. Dies ist die geänderte Formel:Here's the modified formula:

SortByColumns ( Filter ( 'Project Requests', StartsWith ( Title, TextSearchBox1.Text ) ), "Title", If ( SortDescending1, Descending, Ascending ) )SortByColumns ( Filter ( 'Project Requests', StartsWith ( Title, TextSearchBox1.Text ) ), "Title", If ( SortDescending1, Descending, Ascending ) )

Aber welche Aktionen führt diese Formel aus?But what does this formula do? Sie bestimmt die Quelle der im Katalog angezeigten Daten, filtert die Daten anhand des im Suchfeld eingegebenen Texts und sortiert die Ergebnisse basierend auf der Sortierschaltfläche in der App.It determines the source of data that appears in the gallery, filters the data based on any text entered in the search box, and sorts the results based on the sort button in the app. Die Formel führt ihre Aufgaben mithilfe von Funktionen aus.The formula uses functions to do its work. Funktionen akzeptieren Parameter (die Eingabe), führen einen Vorgang (z.B. Filtern) aus und geben einen Wert zurück (die Ausgabe):Functions take parameters (i.e. input), perform an operation (like filtering), and return a value (i.e. output):

  • Die SortByColumns-Funktion sortiert eine Tabelle nach einer oder mehreren Spalten.The SortByColumns function sorts a table based on one or more columns.
  • Die Filter-Funktion sucht die Datensätze in einer Tabelle, die die Bedingungen einer von Ihnen angegebenen Formel erfüllen.The Filter function finds the records in a table that satisfy a formula that you specify.
  • Die StartsWith-Funktion testet, ob eine Zeichenfolge mit einer anderen beginnt.The StartsWith function tests whether one text string begins with another.
  • Die If-Funktion gibt einen Wert zurück, wenn für eine Bedingung „true“ gilt, und gibt einen anderen Wert zurück, wenn für die gleiche Bedingung „false“ gilt.The If function returns one value if a condition is true, and returns another value if the same condition is false.

Folgendes geschieht, wenn Sie die Funktionen in der Formel kombinieren:When you put the functions together in the formula, here's what happens:

  1. Wenn Sie Text im Suchfeld eingeben, vergleicht die StartsWith-Funktion den Text mit dem Anfang jeder Zeichenfolge in der Spalte Title (Titel) der Liste.If you enter text in the search box, the StartsWith function compares that text to the start of each string in the Title column of the list.

    StartsWith ( Title, TextSearchBox1.Text )StartsWith ( Title, TextSearchBox1.Text )

    Wenn Sie z.B. im Suchfeld „ge“ eingeben, werden vier Ergebnisse angezeigt, einschließlich Elementen, die mit „Gebiet“ und „Gerät“ beginnen.For example, if you enter "de" in the search box, you see four results, including items that start with "Desktop" and "Device." „Mobile Geräte“ wird nicht angezeigt, da dieses Element nicht mit „ge“ beginnt.You won't see all the "Mobile devices" items because those don't start with "de."

  2. Mit der Filter-Funktion werden Zeilen aus der Tabelle Project Requests (Projektanforderungen) zurückgegeben.The Filter function returns rows from the Project Requests table. Wenn das Suchfeld keinen zu vergleichenden Text enthält, gibt die Filter-Funktion alle Zeilen zurück.If there is no text in the search box to compare, Filter returns all rows.

    Filter ( 'Project Requests', StartsWith ( Title, TextSearchBox1.Text )Filter ( 'Project Requests', StartsWith ( Title, TextSearchBox1.Text )

  3. Die If-Funktion überprüft, ob die Variable SortDescending1 auf „true“ oder „false“ festgelegt ist (wird durch die Sortierschaltfläche in der App festgelegt).The If function looks at whether the variable SortDescending1 is set to true or false (the sort button in the app sets it). Die Funktion gibt dann den Wert Descending oder Ascending zurück.The function then returns a value of Descending or Ascending.

    If ( SortDescending1, Descending, Ascending )If ( SortDescending1, Descending, Ascending )

  4. Jetzt kann die SortByColumns-Funktion den Katalog sortieren.Now the SortByColumns function can sort the gallery. In diesem Fall erfolgt die Sortierung nach dem Feld Title (Titel), dies kann jedoch ein anderes Feld als das für die Suche verwendete Feld sein.In this case, it sorts based on the Title field, but this can be a different field than the one you search on.

Wir hoffen, dass Sie nach diesen Erläuterungen ein besseres Verständnis der Funktionsweise dieser Formel haben und jetzt genauer wissen, wie Sie durch das Kombinieren von Funktionen und anderen Elementen das gewünschte Verhalten Ihrer Apps erzielen.If you stuck with us up to this point, we hope you have a better sense of how this formula works, and how you can combine functions and other elements to drive the behavior your apps require. Weitere Informationen finden Sie unter Referenz zu Formeln für PowerApps.For more information, see Formula reference for PowerApps.

Nächste SchritteNext steps

Der nächste Schritt in dieser Tutorialreihe ist das Erstellen eines Flows zum Verwalten von Projektgenehmigungen.The next step in this tutorial series is to Create a flow to manage project approvals.