Afbeeldingen in een Excel-bestand opslaan en deze afbeeldingen vervolgens toevoegen aan uw appHow to save images in an Excel file, and then add these images to your app

In deze zelfstudie worden de volgende punten besproken:In this tutorial, we:

  • Een Excel-bestand maken en opmaken als tabelCreate an Excel file and format it as a table
  • Een verbinding met OneDrive voor Bedrijven maken.Create a connection to OneDrive for Business. Dit is mogelijk met ieder soort cloudopslagaccount.Any cloud storage account will work. In deze zelfstudie wordt OneDrive voor Bedrijven gebruikt.In this walk-through, OneDrive for Business is used.
  • Een app maken met een besturingselement voor pen-invoerCreate an app with a pen input control
  • Afbeeldingen gemaakt met behulp van het besturingselement voor pen-invoer opslaan in een Excel-bestandSave the images created from the pen input control to an Excel file
  • Afbeeldingen uit een Excel-bestand weergeven in uw appDisplay images from an Excel file in your app

VereistenPrerequisites

Een Excel-bestand als tabel makenCreate the Excel file as a table

  1. Geef een kolom in een leeg Excel-bestand de naam Image [image].In a blank Excel file, name a column Image [image].
  2. Volg de volgende stappen om een tabel te maken:Create a table using the following steps:

    1. Selecteer een gegevenselement in een willekeurige rij en kolom.Select any piece of data in any row and any column. Selecteer bijvoorbeeld Image.For example, select Image.
    2. Selecteer Tabel op het lintmenu Invoegen.On the Insert ribbon, select Table.
    3. Selecteer in het dialoogvenster Mijn tabel bevat veldnamen en selecteer OK.In the dialog window, select My table has headers, and select OK.

      Uw Excel-bestand is nu opgemaakt als tabel.Your Excel file is now in a table format. De opmaak van een Excel-tabel wijzigen biedt extra informatie over de tabelopmaak in Excel.Format the data as a table provides additional details on table formatting in Excel.

    4. Noem de tabel Drawings:Name the table Drawings:

      De naam van de tabel wijzigen naar Drawings

  3. Noem het Excel-bestand SavePen.xlsx en sla het bestand op in uw cloudopslagaccount (OneDrive voor Bedrijven, Dropbox, etc.).Name the Excel file SavePen.xlsx, and save the file to your cloud storage account (OneDrive for Business, Dropbox, and so on).

Een app maken met het penbesturingselementCreate an app with the pen control

  1. Maak in PowerApps een lege app.In PowerApps, create a blank app.
  2. Voeg het cloudopslagaccount in uw app toe als een gegevensbron.In your app, add the cloud storage account as a data source. Nadat u het account hebt toegevoegd als gegevensbron, voegt u SavePen.xlsx toe als verbinding en selecteert u vervolgens de tabel Drawings:Once added as a data source, add SavePen.xlsx as a connection, and then select the Drawings table:
    VerbindenConnect

    Nu wordt de tabel Drawings vermeld als gegevensbron.Now, the Drawings table is listed as a Data source.

  3. Selecteer Tekst in het menu Invoegen en selecteer vervolgens Peninvoer.On the Insert menu, select Text, and then select Pen input. Wijzig de naam naar MyPen:Rename it MyPen:

    Naam wijzigen

  4. Voeg een besturingselement van het type Button toe (menu Invoegen) en stel de bijbehorende eigenschap OnSelect in op deze formule:Add a Button control (Insert menu), and set its OnSelect property to the following formula:
    Patch(Drawings, Defaults(Drawings), {Image:MyPen.Image})
  5. Voeg een besturingselement Afbeeldingengalerie toe (menu Invoegen > Galerie) en stel de eigenschap Items in op Drawings.Add an Image gallery control (Insert menu > Gallery), and set its Items property to Drawings. De eigenschap Image van het galeriebesturingselement wordt automatisch ingesteld op ThisItem.Image.The Image property of the gallery control is automatically set to ThisItem.Image.

    Uw scherm ziet er nu ongeveer als volgt uit:Your screen should look similar to the following:

    Voorbeeldscherm

  6. Druk op F5 of selecteer Voorbeeld ().Press F5 or select Preview (). Teken iets in MyPen en selecteer de knop.Draw something in MyPen, and the select the button. In de eerste afbeelding van het galeriebesturingselement wordt weergegeven wat u hebt getekend.The first image in the gallery control displays what you drew. Voeg nog iets toe aan uw tekening en selecteer de knop.Add something else to your drawing, and select the button. In de tweede afbeelding van het galeriebesturingselement wordt weergegeven wat u hebt getekend.The second image in the gallery control displays what you drew.

    Sluit het voorbeeldvenster.Close the preview window.

  7. Ga naar cloudopslagaccount.Go to your cloud storage account. Er is automatisch een nieuwe map SavePen_images gemaakt.There's a new SavePen_images folder that is automatically created. U moet de pagina mogelijk verversen om de nieuwe map te zien.You may need to refresh to see the new folder. Deze map bevat uw opgeslagen afbeeldingen met id's als bestandsnaam.This folder contains your saved images with IDs for their file names.

    Open SavePen.xlsx.Open SavePen.xlsx. De Image-kolom bevat het pad naar deze nieuwe afbeeldingen.The Image column includes the path to these new images.

De afbeelding in een Excel-bestand toevoegen aan uw appAdd the image in an Excel file to your app

Een ander voorbeeld: u kunt afbeeldingen opslaan in een cloudopslagaccount en vervolgens een Excel-tabel gebruiken om de afbeeldingen in uw app weer te geven.In another example, you can save images in a cloud storage account, and then use an Excel table to display the images in your app.

In dit voorbeeld gebruiken we de map CreateFirstApp.zip, die ook enkele JPEG-bestanden bevat.In this example, we use the CreateFirstApp.zip that contains some .jpeg files.

Notitie

Bij het weergeven van afbeeldingen uit een Excel-bestand, moet het pad naar deze afbeeldingen slash-tekens gebruiken.When displaying images from an Excel file, the path to these images must use forward slashes. Wanneer PowerApps afbeeldingen opslaat naar een Excel-tabel (zoals in de vorige stap), worden in het pad backslash-tekens gebruikt.When PowerApps saves images to an Excel table (as with the previous steps), the path uses backslashes. U kunt ook de SavePen_images uit het vorige voorbeeld gebruiken.So, you can also use the SavePen_images from the previous example. Als u dit doet, dient u dus de slash-tekens in de paden in de Excel-tabel te vervangen door backslash-tekens.If you do, change the paths in the Excel table to use forward slashes instead of backslashes. Anders worden de afbeeldingen niet weergegeven.Otherwise, the images will not display.

  1. Download eerst CreateFirstApp.zip en pak de map Assets uit naar uw cloudopslagaccount.Download CreateFirstApp.zip, and extract the Assets folder to your cloud storage account.
  2. Maak in een Excel-werkblad een tabel die er ongeveer zo uitziet:In an Excel spreadsheet, create a table that looks similar to the following:

    Tabel Jackets

  3. Noem de tabel Jackets.Name the table Jackets. Noem het Excel-bestand Assets.xlsx.Name the Excel file Assets.xlsx. U kunt ook de naam van de map Assets wijzigen naar Assets_images.You can also rename the Assets folder to Assets_images.
  4. Voeg in uw app de tabel Jackets toe als gegevensbron.In your app, add the Jackets table as a data source.
  5. Voeg een besturingselement Alleen afbeeldingen toe (menu Invoegen > Galerie) en stel de eigenschap Items in op Jackets:Add an Image only control (Insert menu > Gallery), and set its Items property to Jackets:

    Eigenschap Items

    De galerie wordt automatisch bijgewerkt met de afbeeldingen:The gallery is automatically updated with the images:

    Afbeeldingen Jacket

Als u de eigenschap Items instelt, wordt de Excel-tabel automatisch bijgewerkt met een nieuwe kolom met de naam PowerAppsId.When you set the Items property, the Excel table is automatically updated with a new column named PowerAppsId.

Het pad naar een afbeelding kan in de Excel-tabel ook de URL naar een afbeelding zijn.In the Excel table, the image path can also be the URL to an image. Download het voorbeeldbestand Flooring Estimates naar uw cloudopslagaccount, voeg de tabel FlooringEstimates toe als gegevensbron in uw app en stel vervolgens het galeriebesturingselement in op FlooringEstimates.Download the Flooring Estimates sample file to your cloud storage account, add the FlooringEstimates table as a data source in your app, and then set the gallery control to FlooringEstimates. De galerie wordt automatisch bijgewerkt met de afbeeldingen.The gallery is automatically updated with the images.

Meer informatieLearn more

Een afbeelding, video of geluid toevoegenAdd an image, a video, or a sound
Show data in a line, pie, or bar chart in your app (Gegevens in uw app weergeven in een lijn-, cirkel- of staafdiagram)Show data in a line, pie, or bar chart in your app
Understand tables and records in PowerApps (Over tabellen en records in PowerApps)Understand tables and records in PowerApps