--- sourceDocument: Criar ou modificar aplicações do Xanadu sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/pt-BR/xanadu/application-development Release : - xanadu ft:locale : - pt-BR ft:publication_title : - Criar ou modificar aplicações do Xanadu ft:clusterId : - cadev bundleId : - cadev workflow : - Creator --- # Autoria dinâmica # Autoria dinâmica {#ariaid-title1} * Versão de lançamento: Xanadu * * Atualizado 1 de ago. de 2024 * * ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 4 min. de leitura Use a criação dinâmica para criar Construtor de IU páginas que se ajustam perfeitamente a diferentes fatores forma (tamanhos), como desktop, tablet e dispositivos móveis. ## Autoria dinâmica no Construtor de IU {#responsive-authoring__section_mfl_5jp_qbc} A autoria dinâmica permite que você crie páginas com boa aparência e que funcionem corretamente em qualquer fator forma, facilitando a interação das pessoas com o conteúdo. Por exemplo, uma página que contém três colunas quando exibida em um laptop pode ser ajustada para uma única coluna em telas menores. Construtor de IU atualmente oferece três fatores de forma padrão: * Desktop (1281 pixels até o infinito) * Tablet (1280 pixels e menor) * Móvel (500 pixels a zero) {#responsive-authoring__ul_qsx_xwp_qbc} Além desses fatores forma, você pode criar até três pontos de interrupção personalizados adicionais (larguras). Para obter mais informações, consulte [Criar um ponto de interrupção para criação dinâmica](https://servicenow-prod.fluidtopics.net/xSM_zPKBnWNj7uidvumzTw "Aprenda a criar pontos de interrupção personalizados para criação dinâmica para controlar a aparência de uma página em diferentes fatores forma."). Existem diferentes técnicas para editar páginas, portanto, elas podem ser usadas em diferentes fatores forma. Use uma das seguintes opções: * [Mostrar ou ocultar componentes](https://servicenow-prod.fluidtopics.net/S6PjlixUPr4ce~apG28MRg "Ao criar páginas com autoria dinâmica para diferentes fatores forma, aprenda a mostrar ou ocultar componentes concluindo as etapas para ocultar uma imagem no tamanho móvel.") * [Mudar configuração do componente](https://servicenow-prod.fluidtopics.net/Fit87yGB9C92q2mZazqDkw "Ao criar páginas com autoria dinâmica para diferentes fatores forma, saiba como o ajuste de algumas opções de configuração de componente pode melhorar a aparência e o funcionamento das páginas em tamanhos menores.") * [Editar estilos](https://servicenow-prod.fluidtopics.net/uc6ZLrMZLs_5Yr~CdCSdeQ "Ao criar páginas com autoria dinâmica para diferentes fatores forma, saiba como alterar as opções de estilo para aumentar a usabilidade da página em tamanhos menores.") * [Reorganizar o layout](https://servicenow-prod.fluidtopics.net/QkcrB~YCkxxD5njwOSQ9nA "Ao criar páginas com autoria dinâmica para diferentes fatores forma, saiba como ajustar o layout para melhorar a aparência da página em tamanhos menores.") {#responsive-authoring__ul_yn3_5qb_1cc} ## Autoria dinâmica e refluxo {#responsive-authoring__section_yw3_xrs_rbc} A partir da versão 1 da Xanadu Store, a criação dinâmica só está disponível ao criar Construtor de IU páginas a partir do zero. A autoria dinâmica não está disponível para páginas existentes ou páginas criadas com um modelo. Esses tipos de páginas continuam a usar o modelo de refluxo padrão existente para ajustar páginas para diferentes larguras de tela. O refluxo transforma layouts de página em uma exibição vertical empilhada automaticamente sem perda de conteúdo ou funcionalidade quando os usuários aumentam o zoom do navegador para 400%. Este ajuste ajuda os usuários com baixa visão ou que têm problemas para visualizar o conteúdo da Web em um navegador devido ao tamanho do monitor, tipo de dispositivo, pouca iluminação ou outras situações. Todas as páginas existentes que foram criadas com modelos ou do zero usam o refluxo automaticamente. Agora, ao criar páginas do zero em Construtor de IU, uma etapa extra mostra que a criação dinâmica está selecionada por padrão. Você pode optar por usar o refluxo selecionando Usar regras de refluxo automático. No entanto, o uso da opção de criação dinâmica oferece mais controle sobre como as páginas funcionam e observam diferentes fatores forma. Para obter mais informações sobre como criar páginas em Construtor de IU, consulte [Criação de uma página no Construtor de IU](https://servicenow-prod.fluidtopics.net/oXLwDAYTDqDRVYtO2ECqbg "Crie uma página em Construtor de IU para um portal, espaço ou aplicação personalizada para que você possa criar uma experiência na Web para seus usuários."). Para obter mais informações sobre o refluxo, consulte [Reflow for Configurable Workspace](https://www.servicenow.com/docs/access?context=auto-reflow&version=xanadu&pubname=xanadu-platform-user-interface&ft:locale=en-US). Para obter uma lista de componentes Construtor de IU que oferecem suporte ao refluxo, consulte a seção Suporte para refluxo das [notas de versão dos Componentes do Next Experience](https://www.servicenow.com/docs/access?context=component-rn&version=xanadu&pubname=xanadu-release-notes&ft:locale=en-US). ## Aplicação e cascateamento de mudanças {#responsive-authoring__section_j1j_wrs_rbc} Todas as mudanças feitas em um fator forma são aplicadas a todos os fatores forma menores automaticamente. Por exemplo, todas as mudanças feitas no tablet se aplicam ao tablet e ao celular. No entanto, se você fizer mudanças no fator de forma móvel, ele substituirá as configurações em cascata do fator de forma do tablet. Essa funcionalidade em cascata permite que você faça mudanças específicas para cada fator forma menor para que a página tenha uma boa aparência e funcione bem. Nota: As mudanças não são colocadas em cascata para tamanhos maiores. Por exemplo, as mudanças feitas no tablet não são aplicadas à área de trabalho. ## Autoria dinâmica e controladores {#responsive-authoring__section_onj_1mp_lcc} Se você adicionar um controlador a uma página, as propriedades do controlador serão globais e não poderão ser definidas por fator forma. Para obter mais informações sobre controladores, consulte [Vincular dados a Construtor de IU páginas usando controladores (recurso avançado)](https://servicenow-prod.fluidtopics.net/5gsUs5SRTqPcjjRLgxlrPw#controllers "Os controladores simplificam a vinculação de dados e a lógica de eventos para habilitar predefinições de componente em Construtor de IU."). ## Como usar a autoria dinâmica ao criar páginas {#responsive-authoring__section_bls_vjp_qbc} Ao criar páginas, crie designs personalizados para controlar a aparência de diferentes fatores forma. Por padrão, na fase, você cria páginas para a área de trabalho (1281 pixels até o infinito). A qualquer momento, selecione outro ícone para ver a página na fase em um fator forma diferente, como tablet ou dispositivo móvel. Conforme necessário, edite a página para que ela seja exibida corretamente no novo fator forma. Esta é a aparência de uma página de amostra no fator forma da área de trabalho. Esta é a mesma página personalizada para o fator forma do tablet. Para o tablet, os componentes de título e imagem foram reduzidos em tamanho. A configuração do componente de lista simples foi editada para mostrar quatro colunas em vez de seis e o número máximo de linhas foi definido como 5. Ao editar um componente para um fator de forma, os campos que mudaram são marcados com um ícone em cascata para esse fator de forma ( neste caso, tablet). O ícone permite que você determine facilmente as diferenças entre os fatores forma de uma determinada página. Esta é a mesma página personalizada para o fator forma móvel. O número de palavras no título foi reduzido e o componente de imagem foi ocultado. A configuração do componente de lista simples foi editada para mostrar duas colunas em vez de quatro e a opção para ocultar a opção de rodapé "exibir tudo" foi selecionada. Os dois campos personalizados especificamente para dispositivos móveis têm um ícone móvel em cascata ao lado deles. O campo Máximo de linhas ainda retém o ícone em cascata do tablet porque esse campo está herdando a configuração do tablet e não foi personalizado para dispositivos móveis. Além dos fatores de forma padrão na exibição do editor, a qualquer momento você pode inserir manualmente um número no campo de pixel. A fase se ajusta ao fator forma mais próximo com base no intervalo. Por exemplo, inserir 850 pixels ajusta a fase ao fator forma do tablet porque seu intervalo é definido como 1280 a 501 pixels. ![Setas pretas apontando para o ícone do fator de forma do tablet e o campo de pixel.]() Nota: Os fatores forma e a capacidade de inserir uma largura de pixel também estão disponíveis ao visualizar uma página. Para obter mais informações, consulte [Saiba como exibir e testar sua experiência Construtor de IU](https://servicenow-prod.fluidtopics.net/3m4vPiWUowvii7SqgiAfdg "Visualize sua experiência em Construtor de IU para ver como ela é e funciona ao criar uma experiência. A visualização ajuda a garantir que sua experiência funcione conforme o esperado, que os recursos de dados estejam disponíveis e que os layouts estejam configurados corretamente."). * **[Como ajustar a visibilidade do componente na criação dinâmica](https://servicenow-prod.fluidtopics.net/S6PjlixUPr4ce~apG28MRg)** Ao criar páginas com autoria dinâmica para diferentes fatores forma, aprenda a mostrar ou ocultar componentes concluindo as etapas para ocultar uma imagem no tamanho móvel. * **[Configuração de componentes para criação dinâmica](https://servicenow-prod.fluidtopics.net/Fit87yGB9C92q2mZazqDkw)** Ao criar páginas com autoria dinâmica para diferentes fatores forma, saiba como o ajuste de algumas opções de configuração de componente pode melhorar a aparência e o funcionamento das páginas em tamanhos menores. * **[Ajustar estilos para criação dinâmica](https://servicenow-prod.fluidtopics.net/uc6ZLrMZLs_5Yr~CdCSdeQ)** Ao criar páginas com autoria dinâmica para diferentes fatores forma, saiba como alterar as opções de estilo para aumentar a usabilidade da página em tamanhos menores. * **[Ajustar layout para criação dinâmica](https://servicenow-prod.fluidtopics.net/QkcrB~YCkxxD5njwOSQ9nA)** Ao criar páginas com autoria dinâmica para diferentes fatores forma, saiba como ajustar o layout para melhorar a aparência da página em tamanhos menores. * **[Criar um ponto de interrupção para criação dinâmica](https://servicenow-prod.fluidtopics.net/xSM_zPKBnWNj7uidvumzTw)** Aprenda a criar pontos de interrupção personalizados para criação dinâmica para controlar a aparência de uma página em diferentes fatores forma.