Partilhar via

Tirar e carregar fotografias de realidade mista

  • Artigo

Neste artigo, iremos criar uma aplicação que pode tirar fotografias de uma sessão de realidade mista e enviá-las para uma pasta no OneDrive. Utilizaremos o controlo Ver no MR neste exemplo, mas os controlos Ver a forma no MR e Câmara de medição também funcionaria.

Iremos cobrir as seguintes tarefas:

  • Adicionar um controlo Objeto 3D para ver e manipular um objeto 3D de amostra
  • Ligar um controlo Objeto 3D a um controlo Ver no MR para ver o objeto 3D no mundo real
  • Adicionar um controlo Galeria para ver fotografias tiradas com o controlo Ver no MR
  • Carregar as fotografias para o OneDrive com um fluxo do Microsoft Power Automate
  • Carregar fotografias capturadas em realidade mista para o Dataverse

Pré-requisitos

Dica

Os controlos mixed-reality (MR) funcionam melhor em ambientes bem iluminados com superfícies de textura plana. O monitorização é melhor em dispositivos compatíveis com LIDAR.

Adicionar um botão para tirar uma fotografia de um objeto 3D em realidade mista

Este exemplo tem três partes. Primeiro, adicionaremos um botão que permite aos utilizadores tirar uma foto de um objeto 3D numa experiência de realidade mista.

Inserir um controlo Objeto 3D

Com a sua aplicação aberta para edição no Power Apps Studio:

  1. Abra o separador Inserir e expanda Suporte de dados.

  2. Selecione Objeto 3D para colocar um objeto 3D no ecrã da aplicação. Arraste o controlo para o ecrã para posicioná-lo com mais precisão.

    O controlo vem com uma forma de cubo transparente. Se quiser, altere a propriedade Source do controlo para carregar um modelo 3D diferente. Neste exemplo, usaremos o URL https://raw.githubusercontent.com/microsoft/experimental-pcf-control-assets/master/robot_arm.glb.

    Uma captura de ecrã de um controlo Objeto 3D em construção no Microsoft Power Apps Studio, mostrado com a respetiva propriedade Source.

Inserir e ligar um controlo Ver no MR

  1. Abra o separador Inserir e expanda Realidade Mista.

  2. Selecione o controlo Ver no MR para o colocar o controlo no ecrã da aplicação ou arraste-o para o ecrã para o posicionar de forma mais precisa.

  3. Altere a propriedade Source do controlo para 3DObject1.Source. (3DObject1 é o nome do controlo Objeto 3D que adicionámos anteriormente.) Esta expressão direciona o controlo Ver no MR para sobrepor o modelo 3D no feed da câmara do dispositivo.

    Uma captura de ecrã de um controlo Ver no MR em construção no Microsoft Power Apps Studio, mostrado com a respetiva propriedade Source.

  4. Guarde e publique a aplicação e execute-a no seu dispositivo móvel.

  5. Selecione Ver no MR para ver o objeto 3D em realidade mista. Selecione o ícone de câmara para tirar uma foto da vista MR.

Em seguida, iremos adicionar uma galeria para que os utilizadores possam ver as fotos que tiraram.

  1. Edite novamente a sua aplicação. Abra o separador Inserir e coloque um controlo Galeria vertical no ecrã.

  2. Altere a propriedade Items do controlo para ViewInMR1.Photos. (ViewInMR1 é o nome do controlo Ver no MR que adicionámos anteriormente.)

  3. Opcionalmente, altere a propriedade Layout da galeria para Imagem e título.

    Uma captura de ecrã de uma galeria vertical em construção no Microsoft Power Apps Studio, mostrada com os respetivas propriedades Items e Layout.

  4. Pré-visualize a aplicação e selecione Ver no MR para gerar uma foto de amostra. A galeria é povoada com uma imagem de amostra.

    Uma captura de ecrã de uma aplicação de tela que mostra um modelo 3D e uma foto do modelo numa galeria.

Nota

Se os utilizadores saírem da vista MR para ver a galeria, entre novamente na vista MR e tire mais fotos, as novas fotos irão substituir as que foram tiradas anteriormente.

Para tornar as fotos na galeria mais fáceis de ver, pode adicionar uma sobreposição em tamanho completo que aparece quando o utilizador seleciona uma imagem de miniatura.

  1. Edite novamente a sua aplicação. Abra o separador Inserir e expanda Suporte de dados.

  2. Selecione Imagem para colocar um controlo Imagem no ecrã. Mova-o e dimensione-o de acordo com a forma como pretende que a foto maior apareça quando uma imagem da miniatura for selecionada.

    Uma captura de ecrã de um controlo Imagem em construção no Microsoft Power Apps Studio.

  3. Altere as propriedades do controlo Imagem: | Propriedade | Valor | | - | - | | OnSelect | UpdateContext({vVisibleImageZoom:false}) | | Image | Gallery1.Selected.Image2 (assumindo que o controlo Galeria é Gallery1 e a primeira imagem de miniatura é Image2) | Visível | vVisibleImageZoom

  4. Selecione a primeira imagem de miniatura no controlo Galeria. Altere a respetiva propriedade OnSelect para UpdateContext({vVisibleImageZoom:true}).

    Uma captura de ecrã de uma imagem de miniatura numa galeria no Microsoft Power Apps Studio, mostrada com a respetiva propriedade OnSelect.

  5. Guarde e publique a aplicação e execute-a no seu dispositivo móvel.

  6. Selecione Ver no MR e, em seguida, selecione o ícone de câmara para tirar uma foto. Selecione a seta Anterior na parte superior do ecrã para sair da vista MR.

  7. Selecione a miniatura na galeria para mostrar uma versão maior da foto. Selecione a imagem para ocultá-la.

Carregar fotografias para OneDrive com um fluxo Power Automate

Por último, criaremos um fluxo de trabalho utilizando o painel do Power Automate. O fluxo de trabalho carrega fotografias da aplicação para uma pasta chamada MRPhotos no OneDrive.

Criar um fluxo no Power Automate

  1. Edite a sua aplicação. No menu de criação de aplicações, selecione Power Automate > Criar novo fluxo.

  2. Procure e selecione o modelo de botões do Power Apps.

    Uma captura de ecrã da página de modelos do Power Automate, com o modelo de botões do Power Apps selecionado.

  3. Na janela Criar o seu fluxo, selecione Editar em modo avançado.

  4. Selecione Botão do Power Apps na parte superior da janela e introduza um novo nome para o seu fluxo. Neste exemplo, iremos nomear o fluxo Carregar Foto MR.

    Uma captura de ecrã da janela de edição do Power Automate, com o nome do fluxo de trabalho realçado.

  5. Selecione o botão Power Apps na parte superior da janela e introduza um novo nome para o seu fluxo. Neste exemplo, iremos nomear o fluxo Carregar Foto MR.

    Uma captura de ecrã da janela de edição do Power Automate, com o passo do PowerApps selecionado para eliminação.

  6. Pesquise por PowerApps (V2) e selecione o acionador PowerApps (V2).

    Uma captura de ecrã da janela de edição do Power Automate, com o acionador PowerApps (v2) selecionado.

  7. Selecione Adicionar uma entrada e, em seguida, selecione Ficheiro.

  8. Altere a etiqueta Conteúdo do ficheiro para Imagem.

    Uma captura de ecrã da janela de edição do Power Automate, com a etiqueta de entrada de Ficheiro alterada para Imagem.

  9. Selecione Novo passo. Pesquise por Criar ficheiro do OneDrive e selecione a ação Criar ficheiro.

    Uma captura de ecrã da janela de edição do Power Automate, com a ação Criar ficheiro do OneDrive selecionado.

  10. Em Caminho da Pasta, selecione o ícone de pasta e navegue para a pasta MRPhotos que criou anteriormente.

  11. Em Nome do Ficheiro, introduza @{triggerBody()?['file']?['name']} (O seu texto muda para "file.name.")

  12. Em Conteúdo do Ficheiro, introduza @{triggerBody()['file']['contentBytes']} (O seu texto muda para "Image.")

  13. Selecione Guardar para guardar o seu fluxo.

O fluxo completo deve ter o seguinte aspeto:

Uma captura de ecrã da janela de edição do Power Automate a mostrar o fluxo de trabalho concluído.

Ligar o fluxo de trabalho a um botão na sua aplicação

  1. Regresse à sua aplicação no Power Apps Studio. O seu fluxo está agora listado sob Fluxos disponíveis.

    Uma captura de ecrã do painel Dados do Power Apps Studio a mostrar o novo fluxo.

  2. Abra o separador Inserir e selecione Botão. Coloque o controlo Botão no ecrã e redimensione-o conforme necessário.

  3. Altere a propriedade Text do botão para Carregar fotos.

  4. Na barra de fórmulas na parte superior da janela do Power Apps, selecione a propriedade OnSelect. Selecione Ação > Power Automate > Carregar Foto MR.

    Uma captura de ecrã de um controlo Botão em construção no Power Apps Studio, com um fluxo adicionado à propriedade OnSelect do controlo.

    A propriedade OnSelect do controlo Botão é alterada para UploadMRPhoto.Run(.

  5. Para carregar a última fotografia tirada, cole o seguinte código depois do parêntesis esquerdo: {file:{name:GUID() & ".png", contentBytes:Last(ViewInMR1.Photos).ImageURI}})

    Uma captura de ecrã da propriedade OnSelect de um controlo Botão na barra de fórmulas do Power Apps Studio, que carrega a última fotografia tirada.

    Se colocar o controlo Botão dentro da galeria, cole, em vez disso, o seguinte código: {file: {name:GUID() & ".png", contentBytes:ThisItem.ImageURI}})

    Uma captura de ecrã da propriedade OnSelect de um controlo Botão na barra de fórmulas do Power Apps Studio, quando o botão está numa galeria.

    Para fazer com que o botão carregue todas as fotografias tiradas, elimine UploadMRPhoto.Run( e cole o seguinte código: ForAll(ViewInMR1.Photos, UploadMRPhoto.Run({file:{name:GUID() & ".png", contentBytes:ImageURI}}))

    Uma captura de ecrã da propriedade OnSelect de um controlo Botão na barra de fórmulas do Power Apps Studio, que carrega todas as fotografias tiradas.

  6. Pré-visualize a aplicação e selecione Ver no MR e, em seguida, selecione Carregar fotos. Verifique a pasta MRPhotos no OneDrive e confirme se a foto de amostra foi carregada.

Adicionar capacidade offline à sua aplicação

Pode utilizar a sua aplicação mesmo quando tiver uma conectividade de rede limitada ou se estiver sem conectividade utilizando as funções SaveData e LoadData.

Carregar fotografias capturadas em realidade mista para o Dataverse

Pode adicionar fotografias a tabelas do Dataverse através de uma coluna do tipo de dados Imagem. As colunas de imagem no Dataverse têm dois campos obrigatórios – Completo e Valor – que podem ser definidos para a saída ImageURI dos controlos de MR.

Por exemplo, se quiser carregar a primeira foto capturada pelo controlo Markup no MR para uma coluna do Dataverse denominada Imagem:

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

Consulte também

Nota

Pode indicar-nos as suas preferências no que se refere ao idioma da documentação? Responda a um breve inquérito. (tenha em atenção que o inquérito está em inglês)

O inquérito irá demorar cerca de sete minutos. Não são recolhidos dados pessoais (declaração de privacidade).