Controle Imagem no Power Apps

  • Artigo

Um controle que mostra uma imagem, por exemplo, de um arquivo local ou de uma fonte de dados.

Descrição

Se você adicionar um ou mais controles Imagem ao seu aplicativo, poderá mostrar imagens individuais que não fazem parte de um conjunto de dados, ou pode incorporar imagens de registros em fontes de dados.

Principais propriedades

Imagem – o nome ou a URL da imagem exibida em um controle de imagem, de áudio ou de microfone.

Observação

  • Use HTTPS para todas as imagens externas para garantir a compatibilidade com navegadores modernos.
  • As imagens externas devem ser acessíveis anonimamente (sem qualquer autenticação).

Propriedades adicionais

AccessibleLabel – rótulo para leitores de tela.

ApplyEXIFOrientation – especifica se deve aplicar automaticamente a orientação especificada nos dados EXIF inseridos com a imagem.

AutoDisableOnSelect – desabilita automaticamente o controle enquanto o comportamento OnSelect está sendo executado.

BorderColor – a cor da borda do controle.

BorderStyle – se a borda do controle é Sólida, Tracejada, Pontilhada ou Nenhuma.

BorderThickness – a espessura da borda do controle.

CalculateOriginalDimensions – habilita as propriedades OriginalHeight e OriginalWidth.

DisplayMode – se o controle permite entrada do usuário (Edição), apenas exibe dados (Exibição), ou está desabilitado (Desabilitado).

DisabledBorderColor – a cor da borda de um controle se a propriedade DisplayMode do controle estiver definida como Desabilitado.

DisabledFill – a cor da tela de fundo de um controle se sua propriedade DisplayMode estiver definida como Desabilitado.

Fill – a cor da tela de fundo de um controle.

FlipHorizontal – especifica se deve inverter a imagem horizontalmente antes de exibi-la.

FlipVertical – especifica se deve inverter a imagem verticalmente antes de exibi-la.

FocusedBorderColor – a cor da borda do controle quando ele está focalizado.

FocusedBorderThickness – A espessura da borda de um controle quando ele está focalizado.

Height – a distância entre a parte superior do controle e as bordas inferiores.

HoverBorderColor – a cor da borda do controle quando o usuário mantém o ponteiro do mouse nesse controle.

HoverFill – a cor da tela de fundo de um controle quando o usuário mantém o ponteiro do mouse sobre ele.

ImagePosition – a posição (Preencher, Ajustar, Ampliar, Organizar lado a lado ou Centralizar) de uma imagem em uma tela ou em um controle se ela não tiver o mesmo tamanho da imagem.

ImageRotation – como girar a imagem antes de exibi-la. Os valores podem ser nenhum, CW (sentido horário) em 90 graus, CCW (sentido anti-horário) em 90 graus e sentido horário em 180 graus.

OnSelect – Ações a serem executadas quando o usuário tocar ou clicar em um controle.

OriginalHeight – altura original de uma imagem, habilitada com a propriedade CalculateOriginalDimensions.

OriginalWidth – largura original de uma imagem, habilitada com a propriedade CalculateOriginalDimensions.

PaddingBottom – a distância entre o texto em um controle e a borda inferior desse controle.

PaddingLeft – a distância entre o texto em um controle e a borda esquerda desse controle.

PaddingRight – a distância entre o texto em um controle e a borda direita desse controle.

PaddingTop – a distância entre o texto em um controle e a borda superior desse controle.

PressedBorderColor – a cor da borda do controle quando o usuário toca ou clica nesse controle.

PressedFill – a cor da tela de fundo de um controle quando o usuário toca ou clica nesse controle.

RadiusBottomLeft – o grau para o qual o canto inferior esquerdo de um controle é arredondado.

RadiusBottomRight – o grau para o qual o canto inferior direito de um controle é arredondado.

RadiusTopLeft – o grau para o qual o canto superior esquerdo de um controle é arredondado.

RadiusTopRight – o grau para o qual o canto superior direito de um controle é arredondado.

TabIndex – ordem de navegação do teclado em relação a outros controles.

Tooltip – texto explicativo exibido quando o usuário passa o mouse sobre um controle.

Transparency – o grau no qual os controles por trás de uma imagem permanecem visíveis. Os valores decimais variam de 0 a 1. Onde 0 é opaco, 0,5 é semitransparente e 1 é transparente.

Visible – se um controle é exibido ou está oculto.

Width – a distância entre as bordas esquerda e direita de um controle.

X – a distância entre a borda esquerda de um controle e a borda esquerda de seu contêiner pai (ou a tela, se não houver contêiner pai).

Y – a distância entre a borda superior de um controle e a borda superior de seu contêiner pai (ou a tela, se não houver contêiner pai).

Remove( DataSource, ThisItem )

Exemplos

Mostrar uma imagem de um arquivo local

  1. No menu Arquivo, clique ou toque em Mídia e, em seguida, clique ou toque em Procurar.

  2. Clique ou toque no arquivo de imagem que você deseja adicionar, clique ou toque em Abrir e pressione Esc para retornar ao espaço de trabalho padrão.

  3. Adicione um controle Imagem e defina sua propriedade Image como o nome do arquivo que você adicionou.

    Não sabe como adicionar e configurar um controle?

    O controle Imagem mostra a imagem que você especificou.

Mostrar um conjunto de imagens de uma fonte de dados

  1. Baixe este arquivo do Excel e salve-o em seu dispositivo local.

  2. No Power Apps Studio,, crie ou abra um aplicativo e, em seguida, clique ou toque em Adicionar fonte de dados no painel direito.

    Se Adicionar fonte de dados não aparecer no painel direito, clique ou toque em uma tela na barra de navegação à esquerda.

  3. Clique ou toque em Adicionar dados estáticos ao seu aplicativo, clique ou toque no arquivo do Excel baixado e, em seguida, clique ou toque em Abrir.

  4. Marque a caixa de seleção Estimativas de Piso e clique ou toque em Conectar.

  5. Adicione um controle Galeria com imagens e defina sua propriedade Items como FlooringEstimates.

    Não sabe como adicionar e configurar um controle?

    O controle Galeria mostra imagens de produtos em carpete, madeira e azulejo com base nos links no arquivo do Excel que você baixou.

Diretrizes de acessibilidade

Contraste de cores

  • Os requisitos de contraste de cores padrão se aplicarão, se o elemento gráfico for usado como um botão.
  • Verifique se há problemas de contraste na imagem, caso ela não seja simplesmente decorativa.

Suporte ao leitor de tela

  • AccessibleLabel precisa ser definido para gráficos importantes.

  • Se o gráfico for para decoração ou fornecer informações redundantes, deixe AccessibleLabel vazio ou defina-o como uma string vazia "". Os leitores de tela irão ignorar esses gráficos.

Por exemplo, você pode colocar uma Imagem de um cadeado próximo a um Rótulo que diz: Não é possível modificar este formulário. Você não precisa de um AccessibleLabel para a imagem porque o Label já explica o significado.

Importante

Quando TabIndex é igual a zero ou maior, a Image torna-se um botão. A aparência não muda, mas os leitores de tela a tratarão como um botão. Eles não irão ignorar o controle, mesmo que AccessibleLabel esteja vazio.

Suporte de teclado

  • TabIndex precisará ser zero ou maior se o elemento gráfico for usado como um botão. Os usuários do teclado podem navegar até ele.

  • Os indicadores de foco precisarão ser evidentes, se o elemento gráfico for usado como um botão. Use FocusedBorderColor e FocusedBorderThickness para obter esse resultado.

Observação

Você pode nos falar mais sobre suas preferências de idioma para documentação? Faça uma pesquisa rápida. (Observe que esta pesquisa está em inglês)

A pesquisa levará cerca de sete minutos. Nenhum dado pessoal é coletado (política de privacidade).