Visão geral da visualização de formulário (uiFormDefinition)

Uma exibição de formulário é uma descrição JSON de uma experiência de criação do portal Azure. O portal do Azure renderiza o formulário em tempo de execução a partir do JSON; não há código no cliente para escrever. As exibições de formulário usam o formato uiFormDefinition.json e são usadas pelos formulários do portal de especificação de modelo. Aplicativos Gerenciados do Azure usar o formato createUiDefinition.json separado.

O arquivo mínimo tem esta aparência:

{
  "$schema": "https://schema.management.azure.com/schemas/2021-09-09/uiFormDefinition.schema.json#",
  "view": {
    "kind": "Form",
    "properties": {
      "title": "Create my resource",
      "steps": []
    },
    "outputs": {
      "kind": "ResourceGroup",
      "resourceGroupId": "",
      "location": "",
      "parameters": {}
    }
  }
}

Uma exibição de formulário sempre tem:

Campo Obrigatório Description
$schema Recomendado Afixe o 2021-09-09/uiFormDefinition.schema.json schema para IntelliSense.
view.kind Sim Deve ser "Form".
view.properties.title Sim O título da página mostrado acima do formulário.
view.properties.steps Sim Uma ou mais etapas (guias). Confira as etapas.
view.outputs Sim (ao implantar) O contexto de implantação — ou seja, qual assinatura, grupo de recursos, grupo de gerenciamento ou locatário a implantação tem como destino, e os valores dos parâmetros do modelo do Azure Resource Manager. Consulte Saídas.

Steps

steps é uma matriz ordenada. Cada etapa é renderizada como uma guia. O usuário se move entre as etapas com Avançar e Anterior.

"steps": [
  {
    "name": "basics",
    "label": "Basics",
    "description": "Provide the basic settings for the resource.",
    "elements": [
      {
        "name": "name",
        "type": "Microsoft.Common.TextBox",
        "label": "Resource name",
        "toolTip": "Provide a unique name.",
        "constraints": {
          "required": true,
          "regex": "^[a-z0-9]{3,24}$",
          "validationMessage": "3-24 lowercase letters or digits."
        }
      }
    ]
  }
]

Cada etapa tem:

Campo Obrigatório Description
name Sim ID da etapa. Faça referência a ele em expressões como steps('<name>').
label Sim Título da guia.
description No Descrição opcional exibida abaixo do título da aba.
elements Sim Matriz de controles de formulário. Consulte elementos da visualização de formulário.

Agrupar campos relacionados em Microsoft.Common.Section vez de sobrecarregar uma etapa. As seções não podem ser aninhadas.

Saídas (contexto de implantação)

Quando uma exibição de Formulário é usada para implantar um modelo de Azure Resource Manager (o caso comum), view.outputs é o contexto de implantação. O portal o usa para descobrir onde implantar e quais valores de parâmetro passar para o modelo. Há suporte para quatro kind valores:

kind Campos obrigatórios Usado quando
ResourceGroup resourceGroupId, location, parameters A maioria dos recursos. Implanta em um grupo de recursos.
Subscription subscriptionId, location, parameters O modelo $schema é subscriptionDeploymentTemplate.json.
ManagementGroup managementGroupId, location, parameters O modelo $schema é managementGroupDeploymentTemplate.json.
Tenant location, parameters O modelo $schema é tenantDeploymentTemplate.json.

parameters as chaves mapeiam 1:1 para parâmetros de modelo do ARM. Os valores geralmente são expressões que leem a saída de uma etapa.

Para implantações de grupo de recursos, o esquema público oferece suporte a Microsoft.Common.ResourceScope, e o tutorial Criar formulários do portal para especificações de modelo o utiliza para o fluxo comum de seleção de assinatura, grupo de recursos e local. O exemplo a seguir pressupõe que a basics etapa contém um Microsoft.Common.ResourceScope elemento chamado resourceScope. Esse também é o padrão mais seguro quando o formulário inclui controles (como Microsoft.Compute.SizeSelector) que inferem sua assinatura e localização do escopo de implantação.

"outputs": {
  "kind": "ResourceGroup",
  "resourceGroupId": "[steps('basics').resourceScope.resourceGroup.id]",
  "location":        "[steps('basics').resourceScope.location.name]",
  "parameters": {
    "keyVaultName": "[steps('basics').name]",
    "location":     "[steps('basics').resourceScope.location.name]",
    "sku":          "[steps('keyvault').sku]"
  }
}

Se um formulário usar elementos autônomos Microsoft.Common.SubscriptionSelector, Microsoft.Common.ResourceGroupSelector e Microsoft.Common.LocationSelector em vez de Microsoft.Common.ResourceScope, certifique-se de que os controles com reconhecimento de escopo estejam explicitamente vinculados à assinatura e à localização selecionadas por meio da propriedade scope.

Expressions

Cadeias de caracteres do formulário "[ ... ]" são avaliadas como expressões. As funções correspondem ao mesmo conjunto de funções documentado em CreateUiDefinition functions:

Function Returns
steps('<stepName>') Objeto que contém todas as saídas de controle na etapa nomeada.
basics('<elementName>') Saída de um elemento da etapa legada Basics (apenas em CreateUiDefinition).
equals, not, and, or, , if, coalesce, empty Auxiliares lógicos.
concat, split, substring, indexOf, toLower, toUpper, last, , first Funções auxiliares de string e array.
length, min, max, add, , sub, mul, div Auxiliares numéricos.
subscription(), resourceGroup(), location() Escopo selecionado.

Dentro de um controle, visible, defaultValue e a maioria dos campos constraints.* aceitam um valor literal ou uma expressão.

Localization

As cadeias de caracteres voltadas para o usuário podem ser embutidas como literais (como nos exemplos acima).

Ferramentas de criação

  • O sandbox da exibição de formulário pode gerar um formulário padrão a partir de um modelo ARM e visualizar o resultado. Consulte Criar formulários do portal para especificações de modelo para uma explicação completa.

  • O esquema é publicado em https://schema.management.azure.com/schemas/2021-09-09/uiFormDefinition.schema.json. Para habilitar o IntelliSense no Visual Studio Code, adicione a URL do esquema como o valor de nível $schema superior no arquivo de formulário:

    {
      "$schema": "https://schema.management.azure.com/schemas/2021-09-09/uiFormDefinition.schema.json#",
      "view": {
        "kind": "Form"
      }
    }
    

    Se Visual Studio Code solicitar que você confie no domínio do esquema, escolha Configurar Domínios Confiáveis e adicionar https://schema.management.azure.com. Você também pode adicioná-lo posteriormente na Paleta de Comandos com Preferências: Configurar Domínios Confiáveis.

Próximas Etapas