Generowanie aplikacji do obsługi żądań projektówGenerate an app to handle project requests

Uwaga

Ten artykuł jest częścią serii samouczków dotyczących używania usług PowerApps, Microsoft Flow i Power BI z usługą SharePoint Online.This article is part of a tutorial series on using PowerApps, Microsoft Flow, and Power BI with SharePoint Online. Najpierw zapoznaj się z wprowadzeniem do tej serii, aby uzyskać ogólny obraz oraz powiązane pliki do pobrania.Make sure you read the series introduction to get a sense of the big picture, as well as related downloads.

Po zapewnieniu odpowiednich list programu SharePoint możemy przystąpić do tworzenia i dostosowywania pierwszej aplikacji.Now that the SharePoint lists are in place, we can build and customize our first app. Usługa PowerApps jest zintegrowana z programem SharePoint, dzięki czemu można z łatwością wygenerować podstawową aplikację z trzema ekranami bezpośrednio z listy.PowerApps is integrated with SharePoint, so it's easy to generate a basic three screen app directly from a list. Ta aplikacja umożliwia wyświetlanie podsumowania i szczegółowych informacji dla każdego elementu listy oraz aktualizowanie istniejących i tworzenie nowych elementów listy.This app allows you to view summary and detailed information for each list item, update existing list items, and create new list items. Po utworzeniu aplikacji bezpośrednio z listy będzie ona widokiem tej listy.If you create an app directly from a list, the app appears as a view for that list. Gotową aplikację można uruchomić w przeglądarce lub na telefonie komórkowym.You can then run that app in a browser, as well as on a mobile phone.

Porada

Pakiet pobierania dotyczący tego scenariusza zawiera ukończoną wersję tworzonej aplikacji: project-requests-app.msapp.The download package for this scenario includes a finished version of this app: project-requests-app.msapp.

Krok 1. Generowanie aplikacji na podstawie listy programu SharePointStep 1: Generate an app from a SharePoint list

  1. Na utworzonej liście Project Requests kliknij lub naciśnij pozycję PowerApps, a następnie Utwórz aplikację.In the Project Requests list you created, click or tap PowerApps, then Create an app.

    Tworzenie aplikacji

  2. Nadaj aplikacji nazwę, np. „Project Requests app”, a następnie kliknij lub naciśnij pozycję Utwórz.Give the app a name, like "Project Requests app", then click or tap Create. Gdy aplikacja jest gotowa, zostanie otwarta w programie PowerApps Studio dla sieci Web.When the app is ready, it opens in PowerApps Studio for web.

    Nadawanie nazwy aplikacji

Krok 2. Przeglądanie aplikacji w programie PowerApps StudioStep 2: Review the app in PowerApps Studio

  1. Lewy pasek nawigacyjny programu PowerApps Studio domyślnie wyświetla hierarchiczny widok ekranów i kontrolek w aplikacji.In PowerApps Studio, the left navigation bar by default shows a hierarchical view of the screens and controls in the app.

    Program PowerApps Studio w widoku hierarchicznym

  2. Kliknij lub naciśnij ikonę miniatury, aby przełączyć widoki.Click or tap the thumbnail icon to switch views.

    Selektor widoków w programie PowerApps Studio

  3. Kliknij lub naciśnij poszczególne ekrany, aby wyświetlić je w środkowym okienku.Click or tap each screen to view it in the middle pane. Istnieją trzy ekrany:There are three screens:

    (a).(a). Ekran przeglądania, który umożliwia przeglądanie, sortowanie i filtrowanie danych pobranych z listy.The browse screen, where you browse, sort, and filter the data pulled in from the list.

    (b).(b). Ekran szczegółów, który umożliwia wyświetlanie szczegółów na temat danego elementu.The details screen, where you view more detail about an item.

    (c).(c). Ekran edytowania/tworzenia, który umożliwia edytowanie istniejącego elementu lub utworzenie nowego.The edit/create screen, where you edit an existing item or create a new one.

    Widok miniatur w programie PowerApps Studio

Krok 3. Dostosowywanie ekranu przeglądania aplikacjiStep 3: Customize the app's browse screen

  1. Kliknij lub naciśnij ekran przeglądania.Click or tap the browse screen.

    Ten ekran ma układ, w ramach którego występuje galeria umożliwiająca wyświetlanie elementów listy, a także inne kontrolki, takie jak pasek wyszukiwania i przycisk sortowania.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. Wybierz galerię BrowseGallery1, klikając lub naciskając dowolny rekord inny niż pierwszy na liście.Select the BrowseGallery1 gallery by clicking or tapping any record except the first one.

    Galeria przeglądania

  3. W prawym okienku w obszarze Właściwości kliknij lub naciśnij pozycję Project Requests.In the right pane, under Properties, click or tap Project Requests.

  4. Zaktualizuj pola w taki sposób, aby były zgodne z następującą listą:Update the fields to match the following list:

    • RequestDateRequestDate

    • RequestorRequestor

    • TitleTitle

      Pola galerii

  5. Przy wciąż zaznaczonej galerii BrowseGallery1 wybierz właściwość Items.With BrowseGallery1 still selected, select the Items property.

    Właściwość Items

  6. Zmień formułę, aby wyglądała następująco: 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)).

    Pasek formuły

    Dzięki temu wyszukiwanie i sortowanie będzie dotyczyło pola Title, a nie pola domyślnie wybranego przez usługę PowerApps.This allows you to sort and search by the Title field, instead of the default that PowerApps picked. Aby uzyskać więcej informacji, zobacz Formuła — szczegółowe omówienie.See Formula deep-dive for more information.

  7. Kliknij lub naciśnij pozycję Plik, a następnie Zapisz.Click or tap File, then Save. Kliknij lub naciśnij ikonę Ikona powrotu do aplikacji, aby powrócić do aplikacji.Click or tap Back to app icon to go back to the app.

Krok 4. Przeglądanie ekranu szczegółów i ekranu edytowania aplikacjiStep 4: Review the app's details screen and edit screen

  1. Kliknij lub naciśnij ekran szczegółów.Click or tap the details screen.

    Ten ekran ma inny układ, który zawiera formularz wyświetlania umożliwiający wyświetlanie szczegółowych informacji dotyczących elementu zaznaczonego w galerii.This screen has a different layout that contains a display form to show the details for an item selected in the gallery. Zawiera też kontrolki służące do edytowania i usuwania elementów oraz do przechodzenia z powrotem do ekranu przeglądania.It has controls to edit and delete items, and to go back to the browse screen.

    Formularz wyświetlania szczegółów

  2. Kliknij lub naciśnij ekran edycji.Click or tap the edit screen.

    Ten ekran zawiera formularz edycji, który umożliwia edytowanie wybranego elementu lub utworzenie nowego (jeśli przejście nastąpiło bezpośrednio z ekranu przeglądania).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). Zawiera też kontrolki służące do zapisywania i odrzucania zmian.It has controls to save or discard changes.

    Formularz edycji

Krok 5. Uruchamianie aplikacji z poziomu listyStep 5: Run the app from the list

  1. Na liście Project Requests kliknij lub naciśnij pozycję Wszystkie elementy, a następnie Project Requests app.In the Project Requests list, click or tap All Items, then Project Requests app.

    Widok aplikacji Project Requests app

  2. Kliknij przycisk Otwórz, aby otworzyć aplikację w nowej karcie przeglądarki.Click Open, which opens the app in a new browser tab.

    Otwieranie aplikacji Project Requests app

  3. W aplikacji kliknij lub naciśnij ikonęIn the app, click or tap Ikona Przejdź do szczegółów obok pierwszego elementu w galerii przeglądania.for the first item in the browse gallery.

    Pierwszy element galerii

  4. Kliknij lub naciśnij ikonęClick or tap Ikona Ołówek (Edytuj) w celu edytowania elementu.to edit the item.

  5. Zaktualizuj pole Description, zmieniając ostatni wyraz „group” na „team”, a następnie kliknij lub naciśnij ikonę Ikona Znacznik wyboruUpdate the Description field – change the last word from "group" to "team," then click or tap Check mark icon

    Aktualizowanie pola Opis

  6. Zamknij kartę przeglądarki.Close the browser tab.

  7. Wróć do listy Project Requests, kliknij lub naciśnij pozycję Project Requests app, a następnie Wszystkie elementy.Go back to the Project Requests list, click or tap Project Requests app, then All Items.

    Wyświetlanie wszystkich elementów

  8. Sprawdź zmianę dokonaną w aplikacji.Verify the change you made from the app.

    Sprawdzanie zmiany

Chociaż jest to bardzo prosta aplikacja dostosowana na podstawowym poziomie, to wiemy już, że utworzenie czegoś interesującego wcale nie musi być czasochłonne.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. Teraz przejdziemy do następnego zadania, ale, jeśli chcesz, najpierw przyjrzyj się aplikacji. Sprawdź, w jaki sposób kontrolki i formuły współpracują ze sobą, aby sterować odpowiednim zachowaniem aplikacji.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.

Formuła — szczegółowe omówienieFormula deep-dive

Ta sekcja jest opcjonalna, ale dzięki niej dowiesz się więcej na temat działania formuł.This section is optional, but it will help you understand more about how formulas work. W kroku 3 tego zadania zmodyfikowaliśmy formułę właściwości Items w ramach galerii BrowseGallery1.In step 3 of this task, we modified the formula for the Items property of BrowseGallery1. Konkretnie zmieniliśmy sortowanie i wyszukiwanie w taki sposób, aby dotyczyło pola Title, a nie pola wybranego przez usługę PowerApps.Specifically, we changed the sort and search to use the Title field, instead of the field that PowerApps picked. Oto zmodyfikowana formuła: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 ) )

Jak działa ta formuła?But what does this formula do? Określa źródło danych wyświetlanych w galerii, filtruje dane w oparciu o dowolny tekst wprowadzony w polu wyszukiwania, a także sortuje wyniki w oparciu o przycisk sortowania w aplikacji.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. Aby formuła spełniała swoje zadanie, używa odpowiednich funkcji.The formula uses functions to do its work. Funkcje pobierają parametry (np. dane wejściowe), wykonują operacje (np. filtrowanie) i zwracają wartość (np. dane wyjściowe):Functions take parameters (i.e. input), perform an operation (like filtering), and return a value (i.e. output):

  • Funkcja SortByColumns sortuje tabelę na podstawie jednej lub większej liczby kolumn.The SortByColumns function sorts a table based on one or more columns.
  • Funkcja Filter znajduje rekordy w tabeli, które spełniają warunki określonej formuły.The Filter function finds the records in a table that satisfy a formula that you specify.
  • Funkcja StartsWith testuje, czy dany ciąg tekstowy rozpoczyna się innym ciągiem tekstowym.The StartsWith function tests whether one text string begins with another.
  • Funkcja If zwraca określoną wartość, gdy warunek jest spełniony, lub inną wartość, gdy nie jest.The If function returns one value if a condition is true, and returns another value if the same condition is false.

Oto, co się dzieje po umieszczeniu tych funkcji razem w formule:When you put the functions together in the formula, here's what happens:

  1. Po wprowadzeniu tekstu w polu wyszukiwania funkcja StartsWith porównuje ten tekst z początkiem każdego ciągu w kolumnie Title na liście.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 )

    Jeśli na przykład wprowadzisz litery „de” w polu wyszukiwania, zostaną wyświetlone cztery wyniki, w tym elementy rozpoczynające się od wyrazów „Desktop” i „Device”.For example, if you enter "de" in the search box, you see four results, including items that start with "Desktop" and "Device." Nie zostaną wyświetlone żadne elementy „Mobile devices”, ponieważ nie zaczynają się one od liter „de”.You won't see all the "Mobile devices" items because those don't start with "de."

  2. Funkcja Filter zwraca wiersze z tabeli Project Requests.The Filter function returns rows from the Project Requests table. Jeśli pole wyszukiwania nie zawiera tekstu do porównania, funkcja Filter zwraca wszystkie wiersze.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. Funkcja If sprawdza, czy zmienna SortDescending1 ma wartość true (prawda), czy false (fałsz) — decyduje o tym przycisk sortowania w aplikacji.The If function looks at whether the variable SortDescending1 is set to true or false (the sort button in the app sets it). Następnie funkcja zwraca wartość Descending lub Ascending.The function then returns a value of Descending or Ascending.

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

  4. Teraz funkcja SortByColumns może posortować galerię.Now the SortByColumns function can sort the gallery. W tym przypadku sortowanie odbywa się na podstawie pola Title, ale może to być inne pole niż to użyte do wyszukiwania.In this case, it sorts based on the Title field, but this can be a different field than the one you search on.

Mamy nadzieję, że po zapoznaniu się z tą sekcją masz lepsze pojęcie o tym, jak działa powyższa formuła oraz w jaki sposób można łączyć funkcje i inne elementy w celu uzyskania wymaganego zachowania aplikacji.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. Aby uzyskać więcej informacji, zobacz Formula reference for PowerApps (Dokumentacja formuł w usłudze PowerApps).For more information, see Formula reference for PowerApps.

Następne krokiNext steps

Kolejny krok w tej serii samouczków to Create a flow to manage project approvals (Tworzenie przepływu w celu zarządzania zatwierdzeniami projektu).The next step in this tutorial series is to Create a flow to manage project approvals.