Controle Caixa de combinação no Power Apps

Um controle que permite que os usuários façam seleções entre opções fornecidas. Dá suporte para pesquisa e seleção múltipla.

Descrição

Um controle Caixa de combinação permite pesquisar itens que você seleciona. A pesquisa é executada no servidor na propriedade SearchField para que o desempenho não seja afetado por fontes de dados grandes.

O modo de seleção múltipla ou única é configurado por meio da propriedade SelectMultiple.

Ao procurar por itens a serem selecionados, para cada item, você pode optar por mostrar um único valor de dados, dois valores ou uma imagem e dois valores (Pessoa) modificando as configurações de Layout no painel Dados.

Ao exibir em telas pequenas, o submenu da lista de itens se tornará um controle de tela inteira para melhor usabilidade.

Limitações

O controle da caixa de combinação tem estas limitações:

• Quando você usa um controle da caixa de combinação dentro de uma galeria, as seleções não são mantidas quando o usuário percorre a galeria. Isso não será um problema se você usar um controle da caixa de combinação dentro de uma galeria que não rola. Não há uma solução alternativa disponível no momento.

Seletor de Pessoas

Para usar a Caixa de combinação como um seletor de pessoas, escolha o modelo Pessoa nas configurações de Layout no painel Dados e configure as propriedades de dados relacionadas para serem mostradas para a pessoa abaixo.

Principais propriedades

Items – a fonte de dados da qual é possível fazer seleções.

DefaultSelectedItems – os itens selecionados inicialmente antes do usuário interagir com o controle.

SelectedItems – lista de itens selecionados resultante da interação do usuário.

SelectMultiple – se o usuário pode selecionar um único item ou vários itens.

IsSearchable – se o usuário pode pesquisar itens antes de selecionar.

SearchFields – os campos de dados da fonte de dados pesquisada quando o usuário está inserindo o texto.

Propriedades adicionais

AccessibleLabel – rótulo para leitores de tela.

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.

DisplayFields – lista de campos mostrados para cada item retornado pela pesquisa. Mais fácil de configurar por meio do painel Dados na guia Opções propriedades.

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

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.

InputTextPlaceholder – texto de instrução mostrado aos usuários finais quando nenhum item está selecionado.

OnChange - Ações a serem executadas quando o usuário altera uma seleção.

OnNavigate - Ações a serem executadas quando o usuário seleciona um item.

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

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

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).

Exemplos

Caixa de combinação básica

As etapas neste exemplo aplicam-se a qualquer fonte de dados que forneça tabelas, mas para segui-las exatamente, use um ambiente com banco de dados do Microsoft Dataverse que possua dados de exemplo.

1. Selecione Inserir > Entrada > Caixa de combinação e nomeie-o como "Combobox1".

2. No painel Propriedades no lado direito da tela, abra a lista Selecione uma fonte de dados (ao lado de Items) e, em seguida, adicione ou selecione uma fonte de dados, como a tabela Contas.

3. No mesmo painel, selecione Editar (ao lado de Campos).

4. No painel Dados, abra a lista Texto Primário e, em seguida, selecione a coluna Nome Primário que será exibida na Caixa de combinação.

5. Mantenha a tecla Alt pressionada e selecione a seta para baixo para abrir o controle Caixa de combinação.

   O controle mostra os dados do Nome Principal que você especificou na fonte de dados que você especificou.

(Opcional) Mostrar o primeiro registro por padrão

1. Defina a propriedade DefaultSelectedItems como esta expressão, substituindo Fonte de dados pelo nome da sua fonte de dados:

   First(DataSource)
   

(Opcional) Exibir o valor do Nome da conta selecionado em um rótulo

1. Selecione Inserir > Rótulo de texto e depois selecione Rótulo.

2. Defina a propriedade Text como esta expressão, substituindo Text pela seguinte fórmula:

   If(CountRows(ComboBox1.SelectedItems)>0, Concat(ComboBox1.SelectedItems,'Account Name',", "), "NO SELECTED ITEM")
   

   Observação

   A instrução If verificará como os itens selecionados existem e os exibirá em um rótulo delimitado por vírgulas ou em uma mensagem "SEM ITEM SELECIONADO" quando vazio.

Simular um comportamento suspenso simples

Ao definir IsSearchable como falso e SelectMultiple como falso, você pode obter a mesma funcionalidade de um menu suspenso.

1. Selecione Inserir > Entrada e então selecione Caixa de combinação.

2. No painel Propriedades no lado direito da tela, abra a lista Selecione uma fonte de dados (ao lado de Items) e, em seguida, adicione ou selecione uma fonte de dados.

3. No mesmo painel, selecione Editar (ao lado de Campos).

4. No painel Dados, abra a lista Texto principal e, em seguida, selecione a coluna que deseja mostrar no controle Caixa de combinação.

5. Defina a propriedade IsSearchable como falso.

6. Defina a propriedade SelectMultiple como falso.

7. Mantenha a tecla Alt pressionada e selecione a seta para baixo para abrir o controle Caixa de combinação.

   O controle mostra os dados da coluna que você especificou na fonte de dados especificada.

   Observação

   O texto "Localizar itens" desapareceu e você só poderá selecionar um único item.

Diretrizes de acessibilidade

Contraste de cores

É necessário haver um contraste de cores adequado entre:

• ChevronFill e ChevronBackground
• ChevronHoverFill e ChevronHoverBackground
• SelectionColor e SelectionFill
• SelectionFill e Fill
• SelectionTagColor e SelectionTagFill

Isso é adicional aos requisitos de contraste de cores padrão.

Suporte ao leitor de tela

• AccessibleLabel precisa estar presente.

  Observação

  Em telas touch, os usuários de leitores de tela podem navegar pelo conteúdo da caixa de combinação em sequência. A caixa de combinação atua como um botão que mostra ou oculta seu conteúdo quando selecionado.

Suporte de teclado

• TabIndex deve ser zero ou maior para que os usuários de teclado possam navegar para ela.

• Os indicadores de foco precisam ser evidentes. Use FocusedBorderColor e FocusedBorderThickness para fazer isso.

  Observação

  A tecla Tab navega para a caixa de combinação ou para fora dela. As teclas de seta navegam pelo conteúdo da caixa de combinação. A tecla Esc fecha a lista suspensa, quando aberta.