Bagikan melalui

Mengambil dan mengunggah foto Mixed Reality

  • Artikel

Di artikel ini, kami akan membuat aplikasi yang dapat mengambil foto sesi mixed-reality dan mengunggahnya ke folder di OneDrive. Kita akan menggunakan kontrol Lihat dalam MR pada contoh ini, namun kontrol Lihat bentuk dalam MR dan Kamera Pengukuran juga akan bermanfaat.

Kita akan mencakup tugas berikut:

  • Menambahkan kontrol objek 3D untuk melihat dan merekatkan objek 3D sampel
  • Menghubungkan kontrol objek 3D ke kontrol Lihat dalam MR untuk melihat objek 3D di dunia nyata
  • Menambahkan kontrol galeri untuk melihat foto yang diambil dengan kontrol Lihat dalam MR
  • Mengunggah foto ke OneDrive dengan alur Microsoft Power Automate
  • Mengunggah foto yang diambil dalam berbagai realisasi campuran ke Dataverse

Prasyarat

  • Membuat aplikasi kanvas kosong.
  • Membuat folder bernama MRPhotos pada OneDrive. Anda dapat menggunakan folder ini untuk menyimpan foto yang diunggah.

Tip

Kontrol realitas campuran (MR) berfungsi terbaik di lingkungan dengan penerangan yang baik dengan permukaan bertekstur datar. Pelacakan lebih baik di perangkat berkemampuan LIDAR.

Tambahkan tombol untuk mengambil foto objek 3D dalam realisasi campuran

Contoh ini memiliki tiga bagian. Pertama, kami akan menambahkan tombol yang memungkinkan pengguna mengambil foto objek 3D dalam pengalaman realisasi campuran.

Sisipkan kontrol objek 3D

Dengan aplikasi Anda terbuka untuk pengeditan di Power Apps Studio:

  1. Buka tab Sisipkan dan luaskan Media.

  2. Pilih objek 3D untuk menempatkan objek 3D pada layar aplikasi. Tarik kontrol ke layar untuk memposisikannya lebih akurat.

    Kontrol dilengkapi dengan bentuk berbentuk kubus yang tembus pandang. Jika Anda suka, ubah properti Sumber kontrol untuk memuat model 3D yang berbeda. Dalam contoh ini, kita akan menggunakan URL https://raw.githubusercontent.com/microsoft/experimental-pcf-control-assets/master/robot_arm.glb.

    Tangkapan layar kontrol objek 3D dalam pembangunan di Microsoft Power Apps Studio, yang ditunjukkan dengan properti Sumbenya.

Memasukkan dan menyambungkan kontrol Lihat dalam MR

  1. Buka tab Sisipkan dan luaskan Mixed Reality.

  2. Pilih Lihat dalam MR untuk meletakkan kontrol di layar aplikasi, atau tarik kontrol ke layar untuk memposisikannya dengan lebih tepat.

  3. Mengubah properti Sumber kontrol ke 3DObject1.Source. (3DObject1 adalah nama kontrol objek 3D yang kami tambahkan sebelumnya.) Ekspresi ini mengarahkan kontrol Lihat dalam MR untuk melapisi model 3D pada umpan kamera perangkat.

    Tangkapan layar kontrol Lihat dalam MR dalam pembangunan di Microsoft Power Apps Studio, yang ditunjukkan dengan properti Sumbenya.

  4. Simpan dan publikasikan aplikasi dan jalankan di perangkat seluler Anda.

  5. Pilih Lihat dalam MR untuk melihat objek 3D dalam Mixed Reality. Pilih ikon kamera untuk mengambil foto dari tampilan MR.

Selanjutnya, kita akan menambahkan galeri agar pengguna dapat melihat foto yang mereka ambil.

  1. Edit aplikasi lagi. Buka tab Sisipkan, dan letakkan kontrol Galeri vertikal di layar.

  2. Mengubah properti Item kontrol ke ViewInMR1.Photos. (ViewInMR1 adalah nama kontrol Lihat dalam MR yang kita tambahkan sebelumnya.)

  3. Cara lainnya, ubah properti Tata Letak galeri menjadi Gambar dan judul.

    Cuplikan layar galeri vertikal sedang dibuat di Microsoft Power Apps Studio, yang ditampilkan dengan itemnya dan properti tata letak.

  4. Pratinjau aplikasi, lalu pilih Lihat dalam MR untuk menghasilkan foto sampel. Galeri diisi dengan gambar sampel.

    Tangkapan layar aplikasi kanvas yang menampilkan model 3D dan foto model di galeri.

Catatan

Jika pengguna keluar dari tampilan MR untuk melihat galeri, kemudian memasukkan kembali tampilan MR dan mengambil foto lainnya, foto baru akan menggantikan foto yang mereka ambil sebelumnya.

Untuk membuat foto di galeri lebih mudah dilihat, Anda dapat menambahkan lapisan ukuran penuh yang muncul bila pengguna memilih gambar mini.

  1. Edit aplikasi lagi. Buka tab Sisipkan dan luaskan Media.

  2. Pilih Gambar untuk menempatkan kontrol gambar pada layar. Pindahkan dan sesuaikan ukuran foto dengan tampilan foto yang lebih besar bila gambar mini dipilih.

    Tangkapan layar kontrol gambar sedang dibuat di Microsoft Power Apps Studio.

  3. Ubah properti kontrol gambar sebagai berikut: | Properti | Nilai | | - | - | | OnSelect | UpdateContext({vVisibleImageZoom:false}) | | Image | Gallery1.Selected.Image2 (dengan asumsi kontrol galeri adalah Gallery1 dan gambar kecil pertama adalah Image2) | Terlihat | vVisibleImageZoom

  4. Pilih gambar mini pertama di Galeri kontrol. Ubah properti OnSelect ke UpdateContext({vVisibleImageZoom:true}).

    Tangkapan layar gambar mini di galeri di Microsoft Power Apps Studio, yang ditampilkan dengan properti OnSelect Sendiri.

  5. Simpan dan publikasikan aplikasi dan jalankan di perangkat seluler Anda.

  6. Pilih Lihat dalam MR dan pilih ikon kamera untuk memotret. Pilih panah kembali di bagian atas layar untuk keluar dari tampilan MR.

  7. Pilih gambar mini di galeri untuk menampilkan versi foto yang lebih besar. Pilih gambar untuk menyembunyikannya.

Unggah foto ke OneDrive dengan alur Power Automate

Terakhir, kita akan membuat alur kerja menggunakan panel Power Automate. Alur kerja mengunggah foto dari aplikasi ke folder bernama MRPhotos di OneDrive.

Buat alur di Power Automate

  1. Edit aplikasi Anda. Pada menu penulisan aplikasi, pilih Power Automate > Buat aliran baru.

  2. Cari dan pilih template tombol Power Apps.

    Tangkapan layar halaman template Power Automate, dengan template tombol Power Apps dipilih.

  3. Di jendela Buat alur, pilih Edit dalam mode lanjutan.

  4. Pilih tombol Power Apps di bagian atas jendela, lalu masukkan nama baru untuk alur Anda. Dalam contoh ini, kita akan namai alur Unggah Foto MR.

    Tangkapan layar jendela edit Power Automate dengan nama alur kerja disorot.

  5. Pilih tombol Power Apps di bagian atas jendela, lalu masukkan nama baru untuk alur Anda. Dalam contoh ini, kita akan namai alur Unggah Foto MR.

    Tangkapan layar jendela edit Power Automate, dengan langkah PowerApps yang dipilih untuk penghapusan.

  6. Cari PowerApps (V2) dan pilih pemicu PowerApps (V2).

    Tangkapan layar jendela edit Power Automate, dengan pemicu PowerApps (v2) dipilih.

  7. Pilih tambahkan input, lalu pilih File.

  8. Mengubah label Konten File ke Gambar.

    Tangkapan layar dari jendela edit Power Automate, dengan label input File diubah ke Gambar.

  9. Pilih langkah baru. Cari buat file OneDrive dan pilih tindakan Buat file.

    Tangkapan layar jendela edit Power Automate, dengan langkah OneDrive tindakan buat file dipilih.

  10. Di Jalur Folder, pilih ikon folder dan navigasikan ke folder MRPhotos yang Anda buat sebelumnya.

  11. Pada Nama File, masukkan @{triggerBody()?['file']?['name']} (Teks Anda berubah ke "file.name.")

  12. Pada Konten File, masukkan @{triggerBody()['file']['contentBytes']} (Teks Anda berubah ke "Image.")

  13. Simpan alur Anda.

Alur lengkap Anda akan terlihat seperti berikut:

Tangkapan layar jendela edit Power Automate dengan alur kerja lengkap ditampilkan.

Sambungkan alur kerja ke tombol di aplikasi Anda

  1. kembali ke aplikasi Anda di Power Apps Studio. Alur Anda sekarang terdaftar dalam Alur yang tersedia.

    Tangkapan layar panel data Power Apps Studio dengan alur baru ditunjukkan.

  2. Buka tab Sisipkan dan pilih tombol. Tempatkan kontrol tombol di layar dan ubah ukurannya jika diperlukan.

  3. Mengubah properti Teks tombol ke Unggah foto.

  4. Dalam bilah rumus di atas judul Power Apps, pilih properti OnSelect. Pilih Tindakan > Power Automate > Unggah Foto MR.

    Tangkapan layar kontrol tombol sedang dibuat dalam Power Apps Studio, dengan aliran yang ditambahkan ke properti OnSelect kontrol.

    Properti OnSelect kontrol tombol berubah ke UploadMRPhoto.Run(.

  5. Untuk mengunggah foto terakhir yang diambil, rekatkan kode berikut setelah tanda kurung buka: {file:{name:GUID() & ".png", contentBytes:Last(ViewInMR1.Photos).ImageURI}})

    Tangkapan layar properti OnSelect kontrol tombol di bilah rumus Power Apps Studio, yang mengunggah foto terakhir yang diambil.

    Jika Anda menempatkan kontrol tombol di dalam galeri, rekatkan kode berikut: {file: {name:GUID() & ".png", contentBytes:ThisItem.ImageURI}})

    Tangkapan layar properti OnSelect kontrol tombol di bilah rumus Power Apps Studio, ketika tombol ada di galeri.

    Untuk membuat tombol mengunggah semua foto yang diambil, hapus UploadMRPhoto.Run( and paste the following code: ForAll(ViewInMR1.Photos, UploadMRPhoto.Run({file:{name:GUID() & ".png", contentBytes:ImageURI}}))

    Tangkapan layar properti OnSelect kontrol tombol di bilah rumus Power Apps Studio, yang mengunggah semua foto yang diambil.

  6. Pratinjau aplikasi, lalu pilih Lihat dalam MR, lalu pilih Unggah foto. Periksa folder MRPhotos di OneDrive dan konfirmasikan bahwa sampel foto telah diunggah.

Tambahkan kemampuan offline ke aplikasi Anda

Anda dapat menggunakan aplikasi meskipun telah membatasi atau tidak ada konektivitas jaringan menggunakan fungsi SaveData dan LoadData.

Mengunggah foto yang diambil dalam berbagai realisasi campuran ke Dataverse

Anda dapat menambahkan foto ke tabel Dataverse melalui kolom Jenis data Gambar. Kolom gambar di Dataverse memiliki dua bidang wajib - Penuh dan Nilai - yang dapat diatur ke output ImageURI dari kontrol MR.

Misalnya, jika Anda ingin mengunggah foto pertama yang diambil dengan kontrol Markup dalam kontrol MR ke kolom Dataverse yang disebut Gambar:

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

Baca juga

Catatan

Apa bahasa dokumentasi yang Anda inginkan? Lakukan survei singkat. (perlu diketahui bahwa survei ini dalam bahasa Inggris)

Survei akan berlangsung kurang lebih selama tujuh menit. Tidak ada data pribadi yang dikumpulkan (pernyataan privasi).