ContextMenu controlar

Um controle usado para inserir comandos.

Nota

Documentação completa e código-fonte encontrados no repositório de componentes de código GitHub.

Description

Um menu contextual (ContextMenu) é uma lista de comandos baseados no contexto de seleção, posicionamento do mouse ou foco do teclado. São uma das superfícies de comando mais eficazes e altamente usadas, e podem ser usadas em vários lugares.

Este componente de código fornece um wrapper em torno do controle ContextualMenu da Interface do Usuário do Fluent associado a um botão para uso em aplicativos de tela e páginas personalizadas.

Propriedades

Principais propriedades

Propriedade	Description
Items	Os itens de ação a serem renderizados. O primeiro item é considerado o item raiz.

Items Propriedades

Name	Description
ItemDisplayName	O Nome de Exibição do item de menu.
ItemKey	A chave a ser usada para indicar qual item está selecionado e ao adicionar subitens. As chaves devem ser exclusivas.
ItemEnabled	Defina como false se a opção estiver desabilitada.
ItemVisible	Defina como falso, se a opção não estiver visível.
ItemChecked	Defina como verdadeiro, se a opção for marcada.
ItemIconName	O ícone da interface do usuário do Fluent a ser usado (consulte Ícones da interface do usuário do Fluent)
ItemIconColor	A cor para renderizar o ícone (por exemplo, rgb ou valor hexadecimal).
ItemIconOnly	Não mostrar o rótulo de texto - apenas o ícone.
ItemHeader	Renderize o item como um cabeçalho da seção. Se houver itens que tenham ItemParentKey definido para a chave deste item, então eles são adicionados como itens agrupados semanticamente nesta seção.
ItemTopDivider	Renderizar um divisor na parte superior da seção.
ItemDivider	Renderize o item como um divisor de seção - ou se o item for um cabeçalho (ItemHeader = true), então controla se deve renderizar um divisor na parte inferior da seção.
ItemParentKey	Renderizar a opção como item filho de outra opção.

Nota

• ItemIconColor substituirá o valor do tema do componente e ignorará outras cores de estado (por exemplo, desabilitado).
• ItemHeader e ItemDivider deve ser definido como verdadeiro para renderizar como um divisor. Se definido como false, espera outros valores e renderizará em branco.
• Adicionar a propriedade ItemChecked e o comportamento dos itens do submenu impedirá que o submenu feche ao clicar.

Exemplo

Fórmula de exemplo do Power Fx para Items:

  Table(
      {
          ItemKey: "File",
          ItemIconName: "save",
          ItemDisplayName: "Save",
          ItemOverflow:true
      },
       {
          ItemKey: "Delete",
          ItemIconName: "Delete",
          ItemDisplayName: "Delete",
          ItemOverflow:true
      }
  )
  

Propriedades de Estilo

Propriedade	Description
Theme	Aceita uma string JSON que é gerada usando Fluent UI Theme Designer (windows.net). Deixar em branco usará o tema padrão definido pelo Power Apps. Deixar em branco usará o tema padrão definido pelo Power Apps. Consulte os temas para obter orientação sobre como configurar.
Chevron	Mostrar ou ocultar a divisa para baixo no botão raiz
IconColor	Opcional. A cor do ícone no botão do menu de contexto.
HoverIconColor	Opcional. A cor do ícone ao passar o mouse sobre o botão do menu de contexto.
IconSize	Opcional. Em pixels, o tamanho do ícone no botão do menu de contexto.
FontSize	Opcional. Em pixels, o tamanho do texto no botão do menu de contexto.
FontColor	Opcional. A cor do texto no botão do menu de contexto.
HoverFontColor	Opcional. A cor do texto ao passar o mouse sobre o botão do menu de contexto.
FillColor	Opcional. A cor de fundo no botão do menu de contexto.
HoverFillColor	Opcional. A cor de fundo ao passar o mouse sobre o botão do menu de contexto.
TextAlignment	O alinhamento do texto do botão. Valores possíveis: Centro, Esquerda ou Direita
AccessibilityLabel	Rótulo Aria do leitor de tela

Propriedades do Evento

Propriedade	Description
InputEvent	Um evento para enviar ao controle. Por exemplo, SetFocus. Consulte abaixo.

Comportamental

Oferece suporte a SetFocus como um InputEvent.

Configurar o comportamento 'On Select'

Use a fórmula Switch() na propriedade OnSelect do componente para configurar ações específicas para cada item, referindo-se ao ItemKey selecionado do controle como o valor de alternância.

Substitua os valores false por expressões apropriadas na linguagem do Power Fx.

  Switch( Self.Selected.ItemKey,
    /* Action for ItemKey 1 */
    "File", false,
    
    /* Action for ItemKey 2 */
    "Delete", false,
  
    /* Default action */
        false
  )

Como configurar o foco no controle

Quando um novo diálogo for mostrado e o foco padrão tiver que estar no controle, um foco definido explícito será necessário.

Para fazer chamadas para o evento de entrada, você pode definir uma variável de contexto vinculada à propriedade Evento de Entrada para uma string que começa com SetFocus e é seguida por um elemento aleatório para garantir que o aplicativo a detecte como uma alteração.

Por exemplo,

UpdateContext({ctxResizableTextareaEvent:"SetFocus" & Text(Rand())}));

A variável de contexto ctxResizableTextareaEvent seria então vinculada à propriedade Input Event.

Limitações

Esse componente de código só pode ser usado em aplicativos de tela e páginas personalizadas.