Tage og uploade mixed reality-fotos

I denne artikel opretter vi en app, der kan tage billeder af en mixed reality-session og overføre dem til en mappe på OneDrive. I dette eksempel bruger vi kontrolelementet Vis i MR, men kontrolelementerne Vis figur i MR og Målekamera virker også.

Vi dækker følgende opgaver:

  • Tilføjelse af et 3D-objekt-kontrolelement for at se og manipulere med et 3D-objekt
  • Oprettelse af forbindelse mellem 3D-objekt-kontrolelementet og Vis i MR, så du kan få vist 3D-objekt i den virkelige verden
  • Tilføjelse af et gallerikontrolelement for at få vist billeder taget med kontrolelementet Vis i MR
  • Overførsel af fotos til OneDrive med et Microsoft Power Automate-flow
  • Overførsel af billeder taget i mixed-reality til Dataverse

Forudsætninger

  • Opret en tom lærredapp.
  • Opret en mappe, der kaldes MRPhotos, på OneDrive. Du skal bruge denne mappe til at gemme de overførte billeder.

Tip

Kontrolelementer til mixed-reality (MR) fungerer bedst i veloplyste miljøer med overflader med flade strukturer. Sporing er bedre på LIDAR-baserede enheder.

Tilføje en knap for at tage et foto af et 3D-objekt i mixed reality

Dette eksempel indeholder tre dele. Først tilføjer vi en knap, der giver brugerne mulighed for at tage et billede af et 3D-objekt i en oplevelse med mixed reality.

Indsæt et 3D-objekt-kontrolelement

Med en åben app, der kan redigeres i Power Apps Studio:

  1. Åbn fanen Indsæt, og udvid Medier.

  2. Vælg 3D-objekt for at placere et 3D-objekt på appskærmen. Træk kontrolelementet til skærmen for at placere det mere præcist.

    Kontrolelementet leveres med en gennemsigtig kubefigur. Hvis du har brug for det, kan du ændre kontrolelementets Source-egenskab, så der indlæses en anden 3D-model. I dette eksempel bruger vi URL-adressen https://raw.githubusercontent.com/microsoft/experimental-pcf-control-assets/master/robot_arm.glb.

    Et skærmbillede af kontrolelementet 3D-objekt under konstruktion i Microsoft Power Apps Studio, der vises sammen med egenskaben Source.

Indsætte og tilknytte et Vis i MR-kontrolelement

  1. Vælg fanen Indsæt, og udvid Mixed Reality.

  2. Vælg Vis i MR for at placere det på app-skærmen, eller træk det til skærmen for at placere det mere præcist.

  3. Rediger objektets egenskab Source til 3DObject1.Source. (3DObject1 er navnet på det 3D-objekt-kontrolelement, vi har tilføjet tidligere). Dette udtryk styrer kontrolelementet Vis i MR til at overlægge 3D-modellen på enhedens kamerafeed.

    Et skærmbillede af kontrolelementet Vis i MR under konstruktion i Microsoft Power Apps Studio, der vises sammen med egenskaben Source.

  4. Gem og udgiv appen , og kør den på din mobilenhed.

  5. Vælg Vis i MR for at få vist 3D-objektet i mixed reality. Vælg kameraets ikon for at tage et foto af MR-visningen.

Derefter tilføjer vi et galleri, så brugerne kan se de billeder, de har taget.

  1. Rediger appen igen. Åbn fanen Indsæt, og placer et Lodret galleri-kontrolelement på skærmen.

  2. Ret kontrolelementets Items-egenskab til ViewInMR1.Photos. (ViewInMR1 er navnet på det Vis i MR-kontrolelementet, vi har tilføjet tidligere.)

  3. Du kan også ændre galleriegenskaben Layout til Billede og titel.

    Et skærmbillede af vertical gallery-kontrolelementet under konstruktion i Microsoft Power Apps Studio, der vises sammen med egenskaberne Items og Layout.

  4. Se eksemplet i appen, og vælg Vis i MR for at oprette et eksempelbillede. Galleriet udfyldes med et eksempelbillede.

    Et skærmbillede af en lærredsapp, der viser en 3D-model og et foto af modellen i et galleri.

Bemærk

Hvis brugerne afslutter MR-visningen for at se galleriet, skal du angive HR-visningen igen og tage flere billeder, så de nye billeder erstatter dem, de har taget tidligere.

Hvis du vil gøre billeder i galleriet nemmere at se, kan du tilføje en overlejring i hel størrelse, der vises, når brugeren vælger et miniaturebilled.

  1. Rediger appen igen. Åbn fanen Indsæt, og udvid Medier.

  2. Vælg Billede for at placere et billedkontrolelement på skærmen. Flyt det, og tilpas størrelsen på det, afhængigt af hvordan det større foto skal vises, når der vælges et miniaturebillede.

    Et skærmbillede af et billedkontrolelement under konstruktion i Microsoft Power Apps Studio.

  3. Rediger billedkontrolelementets egenskaber som følger: | Egenskab | Værdi | | - | - | | OnSelect | UpdateContext({vVisibleImageZoom:false}) | | Image | Gallery1.Selected.Image2 (hvis gallerikontrolelementet er Gallery1, og det første miniaturebillede er Image2) | Visible | vVisibleImageZoom

  4. Vælg det første miniaturebillede i gallerikontrolelementet. Rediger egenskaben OnSelect til UpdateContext({vVisibleImageZoom:true}).

    Et skærmbillede af et miniaturebillede i et galleri i Microsoft Power Apps Studio, der vises med egenskaben OnSelect.

  5. Gem og udgiv appen , og kør den på din mobilenhed.

  6. Vælg Vis i MR, og vælg derefter kameraets ikon for at tage et foto. Vælg tilbagepilen øverst på skærmen for at afslutte MR-visningen.

  7. Vælg miniaturen i galleriet for at få vist en større version af billedet. Vælg billedet for at skjule det.

Uploade fotos til OneDrive med et Power Automate-flow

Til sidst skal du oprette en arbejdsproces i Power Automate. Arbejdsprocessen overfører billeder fra appen til en mappe, der kaldes MRPhotos, på OneDrive.

Opret et flow i Power Automate

  1. Rediger appen. Vælg Opret nyt flow i menuen Power Automate > Opret nyt flow.

  2. Søg efter og vælg skabelonen Power Apps-knap.

    Et skærmbillede af Power Automate-skabelonsiden , hvor Power Apps-knapskabelonen er valgt.

  3. Vælg Rediger i avanceret tilstand i vinduet Opret flow.

  4. Vælg Power Apps-knappen øverst i vinduet, og angiv et nyt navn til flowet. I dette eksempel navngives flowet Upload MR-foto.

    Et skærmbillede af redigeringsvinduet i Power Automate, hvor navnet på arbejdsprocessen er fremhævet.

  5. Vælg Power Apps-knappen øverst i vinduet, og angiv et nyt navn til flowet. I dette eksempel navngives flowet Upload MR-foto.

    Et skærmbillede af redigeringsvinduet i Power Automate, hvor PowerApps-trinnet er valgt til sletning.

  6. Søg efter PowerApps (V2), og vælg udløseren PowerApps (V2).

    Et skærmbillede af redigeringsvinduet i Power Automate, hvor udløseren PowerApps (v2) er valgt.

  7. Vælg Tilføj et input, og vælg derefter Fil.

  8. Rediger etiketten Filindhold til til Billede.

    Et skærmbillede af redigeringsvinduet i Power Automate, hvor etiketten Filinput er ændret til Billede.

  9. Vælg Nyt trin. Søg efter OneDrive, og vælg handlingen Opret fil.

    Et skærmbillede af redigeringsvinduet i Power Automate, hvor OneDrive-handlingen Opret fil er valgt.

  10. I Mappesti skal du vælge mappeikonet og gå til mappen MRPhotos, du oprettede tidligere.

  11. I Filnavn skal du indtaste @{triggerBody()?['file']?['name']} (Teksten ændres til "file.name.")

  12. I Filindhold skal du indtaste @{triggerBody()['file']['contentBytes']} (Teksten ændres til "Image.")

  13. Gem dit flow.

Det komplette flow skulle se sådan ud:

Et skærmbillede af redigeringsvinduet i Power Automate, hvor den fuldførte arbejdsproces er vist.

Forbinde arbejdsprocessen med en knap i din app

  1. Vend tilbage til din app i Power Apps Studio. Flowet vises nu under Tilgængelige flows.

    Skærmbillede af Power Apps Studio-dataruden med det nye flow, der vises.

  2. Åbn fanen Indsæt, og vælg Knap. Placer knapkontrolelementet på skærmen, og tilpas størrelsen efter behov.

  3. Ret knapkontrolelementets Text-egenskab til Upload fotos.

  4. Vælg egenskaben OnSelect på formellinjen øverst i Power Apps-vinduet. Vælg Handling > Power Automate > Upload MR-foto.

    Et skærmbillede af et knapkontrolelement under konstruktion i Power Apps Studio, hvor der er føjet et flow til objektets egenskab OnSelect.

    Knapkontrolelementets OnSelect-egenskab ændres til UploadMRPhoto.Run(.

  5. Hvis du vil uploadee det sidste foto, du har taget, skal du indsætte følgende kode efter parentes begynd: {file:{name:GUID() & ".png", contentBytes:Last(ViewInMR1.Photos).ImageURI}})

    Et skærmbillede af egenskaben OnSelect for et knapkontrolelement i Power Apps Studio-formellinjen, som overfører det seneste foto, der er taget.

    Hvis du har placeret knapkontrolelementet i galleriet, skal du i stedet indsætte følgende kode: {file: {name:GUID() & ".png", contentBytes:ThisItem.ImageURI}})

    Et skærmbillede af egenskaben OnSelect for et knapkontrolelement i Power Apps Studio-formellinjen, når knappen er i et galleri.

    Du kan få knappen til at uploade alle de billeder, du har taget, ved at slette UploadMRPhoto.Run( og indsætte følgende kode: ForAll(ViewInMR1.Photos, UploadMRPhoto.Run({file:{name:GUID() & ".png", contentBytes:ImageURI}}))

    Et skærmbillede af egenskaben OnSelect for et knapkontrolelement i Power Apps Studio-formellinjen, som overfører alle foto, der er taget.

  6. Gennemse appen, vælg Vis i MR, og vælg derefter Upload fotos. Kontrollér mappen MRPhotos på OneDrive, og bekræft, at eksempelbilledet er blevet uploadet.

Tilføje offlinefunktionalitet i din app

Du kan bruge din app, selvom du har begrænset eller ingen netværksforbindelse ved hjælp af SaveData- og LoadData-funktionerne.

Uploade billeder taget i mixed-reality til Dataverse

Du kan føje billeder til Dataverse-tabeller via kolonnen Billeddatatype. Billedkolonner i Dataverse har to obligatoriske felter - Fuld og Værdi - som kan angives til ImageURI-outputtet for MR-kontrolelementerne.

Hvis du f.eks. vil uploade det første foto, der er taget af Markup in MR-kontrolelementet, til en Dataverse-kolonne, der kaldes Billede:

    Image: {Full: First(MarkupInMR.Photos).ImageURI, Value: First(MarkupInMR.Photos).ImageURI}

Se også

Bemærk

Kan du fortælle os om dine sprogpræferencer for dokumentation? Tag en kort undersøgelse. (bemærk, at denne undersøgelse er på engelsk)

Undersøgelsen tager ca. syv minutter. Der indsamles ingen personlige data (erklæring om beskyttelse af personlige oplysninger).