Používanie multimediálnych súborov v službe PowerAppsUsing multimedia files in PowerApps

Táto téma vám ukáže, ako vložiť multimediálne súbory do plátnovej aplikácie, nahrať kresby perom do zdroja údajov a zobraziť obrázky zo zdroja údajov v plátnovej aplikácii.This topic shows you how to embed multimedia files in your canvas app, upload pen drawings to a data source, and show images from a data source in your canvas app. V tejto téme budete pracovať so zdrojom údajov vo forme excelového súboru v službe OneDrive for Business.The data source used in this topic is an Excel file in OneDrive for Business.

PredpokladyPrerequisites

Zaregistrujte sa do PowerApps a potom sa prihláste pomocou rovnakých poverení, ktoré ste použili pri registrácii.Sign up for PowerApps, and then sign in using the same credentials that you used to sign up.

Pridanie média zo súboru alebo clouduAdd media from a file or the cloud

Typ multimediálneho súboru, ktorý chcete pridať, si môžete zvoliť (napríklad obrázok, video alebo zvuk).You can choose the kind of media file to add (for example, images, video, or audio).

  1. Na karte Obsah vyberte položku Médiá.On the Content tab, select Media.

  2. V časti Médiá vyberte položku Obrázky, Videá alebo Zvuk a potom vyberte možnosť Prehľadávať:Under Media, select Images, Videos, or Audio, and then select Browse:

    Prehľadávanie médií

  3. Vyberte požadovaný súbor, ktorý chcete pridať, a potom vyberte možnosť Otvoriť.Select the file that you want to add, and then select Open.

    V počítači sa otvorí priečinok Obrázky, z ktorého môžete vybrať obrázok, alebo môžete prejsť do iného priečinka.The Pictures folder on your computer opens, and you can select an image from there or navigate to another folder.

  4. Keď pridávanie súborov dokončíte, stlačte kláves Esc a vráťte sa do predvoleného pracovného priestoru.When you finish adding files, press Esc to return to the default workspace.

  5. Na karte Vložiť vyberte položku Médiá a potom možnosť Obrázok, Video alebo Zvuk:On the Insert tab, select Media, and then select Image, Video, or Audio:

    Výber typu média

  6. Ak ste pridali ovládací prvok Obrázok, nastavte jeho vlastnosť Image na pridaný súbor:If you added an image control, set its Image property to the file that you added:

    Nastavenie vlastnosti Image

    Poznámka

    Zadajte iba názov súboru bez prípon v jednoduchých úvodzovkách.Specify the file name only, without the extension, inside single quotes.

  7. Ak ste pridali ovládací prvok Video alebo Zvuk, nastavte jeho vlastnosť Media na pridaný súbor:If you added a video or audio control, set its Media property to the file that you added:

    Nastavenie vlastnosti Media

    Poznámka

    Video na YouTube prehráte nastavením vlastnosti Media ovládacieho prvku Video na príslušnú URL adresu uzatvorenú do úvodzoviek.Play a YouTube video by setting the Media property of a video control to the appropriate URL, enclosed in double quotation marks.

Pridanie média zo služby Azure Media ServicesAdd media from Azure Media Services

  1. Z konta Azure Media Services nahrajte a publikujte položku videa z časti AMS > Nastavenia > Položky.From your Azure Media Services account, upload and publish your video asset from AMS > Settings > Assets.

  2. Keď bude video publikované, skopírujte jeho URL adresu.After the video is published, copy its URL.

  3. V službe PowerApps pridajte ovládací prvok Video z karty Vložiť > Médiá.From PowerApps, add the Video control from Insert > Media.

  4. Nastavte jeho vlastnosť Media na skopírovanú URL adresu.Set the Media property to the URL that you copied.

    Ako vidíte na obrázku, môžete zvoliť ľubovoľnú streamovateľnú URL adresu podporovanú službou Azure Media Services:As this graphic shows, you can choose any streaming URL that Azure Media Services supports:

    Nastavenie vlastnosti Media

Pridanie obrázkov z cloudu do aplikácieAdd images from the cloud to your app

V tomto scenári uložíte obrázky do konta cloudového ukladacieho priestoru OneDrive for Business.In this scenario, you save images in a cloud storage account, OneDrive for Business. Použijete excelovú tabuľku s cestou k obrázkom a zobrazíte ich v aplikácii v ovládacom prvku Galéria.You use an Excel table to contain the path to the images, and you display the images in a gallery control in your app.

Tento scenár používa súbor CreateFirstApp.zip obsahujúci niekoľko obrázkov .jpeg.This scenario uses the CreateFirstApp.zip that contains some .jpeg files.

Poznámka

V ceste k týmto obrázkom v excelovom súbore sa musia používať lomky.The path to these images in the Excel file must use forward slashes. Keď služba PowerApps ukladá cesty obrázkov do excelovej tabuľky, používa na to opačné lomky.When PowerApps saves image paths in an Excel table, the path uses backslashes. Ak používate cesty obrázkov z takejto tabuľky, zmeňte opačné lomky pri ceste v excelovej tabuľke na normálne lomky.If you use image paths from such a table, change the paths in the Excel table to use forward slashes instead of backslashes. Obrázky by sa inak nezobrazili.Otherwise, the images won't display.

  1. Stiahnite si súbor CreateFirstApp.zip a extrahujte priečinok Assets do svojho konta cloudového ukladacieho priestoru.Download CreateFirstApp.zip, and extract the Assets folder to your cloud storage account.

  2. Priečinok Assets premenujte na Assets_images.Rename the Assets folder to Assets_images.

  3. V excelovom hárku vytvorte tabuľku s jedným stĺpcom a naplňte ho nasledujúcimi údajmi:In an Excel spreadsheet, create a one-column table, and fill it with the following data:

    Tabuľka Jackets

  4. Tabuľku pomenujte Jackets (Saká) a excelový súbor pomenujte Assets.xlsx.Name the table Jackets, and name the Excel file Assets.xlsx.

  5. V aplikácii pridajte tabuľku Jackets ako zdroj údajov.In your app, add the Jackets table as a data source.

  6. Pridajte ovládací prvok Iba obrázky (karta Vložiť > Galéria) a jeho vlastnosť Items nastavte na Jackets:Add an Image only control (Insert tab > Gallery), and set its Items property to Jackets:

    Vlastnosť Items

    Galéria sa automaticky aktualizuje a zobrazia sa obrázky:The gallery is automatically updated with the images:

    Obrázky oblečenia

    Po nastavení vlastnosti Items sa do excelovej tabuľky automaticky pridá stĺpec s názvom PowerAppsId.When you set the Items property, a column named PowerAppsId is automatically added to the Excel table.

    V excelovej tabuľke môže byť cesta k obrázku aj URL adresou k obrázku.In the Excel table, the image path can also be the URL to an image. Príkladom je ukážkový súbor Flooring Estimates.An example is the Flooring Estimates sample file. Môžete si ho stiahnuť do svojho konta cloudového ukladacieho priestoru, pridať tabuľku FlooringEstimates ako zdroj údajov a potom nastaviť ovládací prvok Galéria na FlooringEstimates.You can download it to your cloud storage account, add the FlooringEstimates table as a data source in your app, and then set the gallery control to FlooringEstimates. Galéria sa automaticky aktualizuje a zobrazia sa obrázky.The gallery is automatically updated with the images.

Nahranie kresieb do clouduUpload pen drawings to the cloud

V tomto scenári sa naučíte nahrať kresby do zdroja údajov (OneDrive for Business) a skontrolovať spôsob uloženia týchto kresieb.In this scenario, you learn how to upload pen drawings to your data source, OneDrive for Business, and examine how the drawings are stored there.

  1. V programu Excel pridajte do bunky A1 hodnotu Image [image].In Excel, add Image [image] to cell A1.

  2. Podľa nasledujúceho postupu vytvorte tabuľku:Create a table using the following steps:

    1. Vyberte bunku A1.Select cell A1.

    2. Na páse s nástrojmi Vložiť vyberte položku Tabuľka.On the Insert ribbon, select Table.

    3. V dialógovom okne vyberte možnosť Tabuľka obsahuje hlavičky a vyberte OK.In the dialog box, select My table has headers, and then select OK.

      Vytvorenie tabuľky

      Excelový súbor má teraz formát tabuľky.Your Excel file is now in a table format. Ďalšie informácie o formátovaní tabuliek v programu Excel nájdete v téme Formátovanie údajov ako tabuľky.See Format the data as a table for more information about table formatting in Excel.

    4. Tabuľku nazvite Drawings:Name the table Drawings:

      Premenovanie tabuľky na Drawings

  3. Excelový súbor uložte do služby OneDrive for Business ako SavePen.xlsx.Save the Excel file to OneDrive for Business as SavePen.xlsx.

  4. V službe PowerApps vytvorte prázdnu aplikáciu.In PowerApps, create a blank app.

  5. Do aplikácie pridajte konto OneDrive for Business ako zdroj údajov:In your app, add the OneDrive for Business account as a data source:

    1. Kliknite alebo ťuknite na kartu Zobraziť a potom kliknite alebo ťuknite na položku Zdroje údajov.Click or tap the View tab, and then click or tap Data sources.

    2. Kliknite alebo ťuknite na položku Pridať zdroj údajov a potom kliknite alebo ťuknite na položku OneDrive for Business.Click or tap Add data source, and then click or tap OneDrive for Business.

    3. Kliknite alebo ťuknite na položku SavePen.xlsx.Click or tap SavePen.xlsx.

    4. Vyberte tabuľku Drawings a potom kliknite alebo ťuknite na položku Pripojiť.Select the Drawings table, and then click or tap Connect.

      Pripojenie

      Teraz je tabuľka Drawings uvedená v zozname ako zdroj údajov.Now, the Drawings table is listed as a data source.

  6. Na karte Vložiť vyberte možnosť Text a potom položku Vstup perom.On the Insert tab, select Text, and then select Pen input.

  7. Nový ovládací prvok premenujte na MyPen:Rename the new control MyPen:

    Premenovanie

  8. Z karty Vložiť pridajte ovládací prvok Tlačidlo a nastavte jeho vlastnosť OnSelect na tento vzorec:On the Insert tab, add a Button control, and set its OnSelect property to this formula:

    Patch(Drawings, Defaults(Drawings), {Image:MyPen.Image})Patch(Drawings, Defaults(Drawings), {Image:MyPen.Image})

  9. Pridajte ovládací prvok Galéria obrázkov (karta Vložiť > Galéria) a jeho vlastnosť Items nastavte na Drawings.Add an Image gallery control (Insert tab > Gallery), and set its Items property to Drawings. Vlastnosť Image ovládacieho prvku Galéria sa automaticky nastaví na ThisItem.Image.The Image property of the gallery control is automatically set to ThisItem.Image.

    Ovládacie prvky usporiadajte nasledujúcim spôsobom:Arrange the controls so that your screen resembles the following:

    Príklad obrazovky

  10. Stlačte kláves F5 alebo vyberte Ukážku (Press F5, or select Preview ( tlačidlo Ukážka ).).

  11. Nakreslite niečo do ovládacieho prvku MyPen a potom vyberte tlačidlo.Draw something in MyPen, and then select the button.

    Prvý obrázok ovládacieho prvku Galéria zobrazí vašu kresbu.The first image in the gallery control displays what you drew.

  12. Pridajte k svojej kresbe ešte niečo a vyberte tlačidlo.Add something else to your drawing, and select the button.

    Druhý obrázok ovládacieho prvku Galéria zobrazí, čo ste nakreslili.The second image in the gallery control displays what you drew.

  13. Stlačením klávesa Esc zavrite okno s ukážkou.Close the preview window by pressing Esc.

    V konte cloudového ukladacieho priestoru sa automaticky vytvoril priečinok SavePen_images.In your cloud storage account, a SavePen_images folder has been automatically created. Tento priečinok obsahuje uložené obrázky, ktoré majú čísla ID namiesto názvov.This folder contains your saved images with IDs for their file names. Ak chcete priečinok zobraziť, budete musieť aktualizovať okno prehľadávača napríklad stlačením klávesa F5.To show the folder, you may need to refresh the browser window by, for example, pressing F5.

    V súboru SavePen.xlsx do stĺpca Image zadajte cestu k novým obrázkom.In SavePen.xlsx, the Image column specifies the path to the new images.

Známe obmedzeniaKnown limitations

Informácie o spôsoboch zdieľania excelových údajov v rámci organizácie získate v časti o známych obmedzeniach.For information about how to share Excel data within your organization, review these limitations.

Ďalšie informácieFor more information

Vyskúšajte aplikáciu v rôznych platformách vrátane okna prehľadávača a telefónu.Be sure to test your app on different platforms, including in a browser window and on a phone.

Ďalšie informácie o pokročilejších scenároch, ktoré zahrnujú nahranie multimédií priamo do iného zdroja údajov, získate v téme o odborných tipoch na snímanie obrázkov a vlastných konektoroch na nahrávanie obrázkov.For information about more advanced scenarios that involve uploading multimedia directly to a different data source, see image capture pro tips and custom connectors for image upload.

Ďalší spôsob, ako súbory nahrať do zdroja údajov, je použitie funkcie Patch.Another way to upload files to a data source is to use the Patch function.