App Builder Versão: Ligação de dados bidirecional, atualização do esquema OpenAPI da fonte de dados e muito mais
Outro lançamento emocionante App Builder foi lançado hoje. Agora, avançando no desenvolvimento de aplicativos com vinculação de dados bidirecional, esquema OpenAPI de fonte de dados atualizado e outros.
Zdravko Kolev
6min de leitura
O lançamento App Builder em maio está aqui, trazendo uma série de novos recursos e melhorias. Os usuários agora podem atualizar as fontes de dados existentes para o esquema OpenAPI mais recente, com a capacidade de visualizar quaisquer diferenças. As melhorias também incluem suporte à vinculação de dados bidirecional para os componentes Input, Checkbox, Switch, Date Picker, Calendar, Rating e Slider.
O que mais? As ações de dados para criar, atualizar e excluir linhas agora estão disponíveis no componente Grade de árvore, e as variáveis podem ser atualizadas com base em eventos de seleção de linha no componente Grade de árvore. O componente Árvore foi aprimorado com propriedades para expansão de nó único e alternância no clique do item. Além disso, uma nova opção de estilo de pesquisa para o componente Entrada foi adicionada.
Antes de mergulhar nessas novas funcionalidades, se esta é a primeira vez que você aprende sobre App Builder, deixe-me compartilhar rapidamente por que você deve considerá-lo como uma ferramenta fundamental no processo de desenvolvimento de aplicativos para sua organização:
- Um construtor de aplicativos visuais – a plataforma unificada para gerentes de produto, designers, desenvolvedores e partes interessadas.
- Ferramenta de arrastar e soltar WYSIWYG baseada em nuvem que ajuda as empresas a projetar e criar aplicativos de negócios completos 80% mais rápido do que nunca.
- Uma ferramenta low-code que gera código Blazor, código Angular e código Web Components pronto para produção a partir de seus designs Figma e Sketch.
Suporte à vinculação de dados bidirecional
Nesta versão App Builder, adicionamos suporte à vinculação de dados bidirecional aos componentes Entrada, Caixa de Seleção, Alternância, Seletor de Data, Calendário, Classificação e Controle Deslizante.
O suporte à associação bidirecional permite que você marque uma propriedade de componente como twoWayBindable quando a propriedade está associada a uma variável. Mas o que exatamente é uma ligação bidirecional? Imagine manter a interface do usuário e os dados subjacentes sincronizados. Portanto, quando você altera os dados, a interface do usuário é atualizada automaticamente e, quando você altera a interface do usuário, os dados variáveis são atualizados automaticamente.
Como usuário, agora você pode:
- Defina o conteúdo de entrada como algum valor e gere-o como um campo de associação de dados bidirecional no código gerado.
- Vincule uma propriedade value/content correspondente do componente a uma variável.
- Controle se essa associação será gerada como uma associação bidirecional ou não.
App Builder versão com a atualização do esquema OpenAPI da fonte de dados
A interface do usuário de fontes de dados do App Builder apresenta ao desenvolvedor uma visualização de seus pontos de extremidade e esquemas de fonte de dados. As fontes de dados evoluem ao longo do tempo e seu esquema muda, portanto, a interface do usuário da fonte de dados do App Builder deve ser atualizada adequadamente.
Com esta versão App Builder, agora você tem uma maneira de atualizar facilmente suas fontes de dados existentes para usar a versão atualizada mais recente do esquema OpenAPI e mostrar diferenças, se houver.
Qual é a essência desse novo recurso?
- Esse recurso permite que você sincronize sua fonte de dados com sua WebAPI de back-end enquanto desenvolve seu front-end no App Builder.
- Se você atualizar sua fonte de dados e as propriedades do esquema de dados usadas para vinculação de dados permanecerem inalteradas, suas vinculações de dados permanecerão intactas.
- Se você atualizar sua fonte de dados e as propriedades do esquema de dados usadas para a alteração da vinculação de dados, receberá uma notificação com uma lista de vinculações de dados afetadas para que possa atualizar manualmente os componentes da interface do usuário de acordo.
*No futuro, planejamos introduzir a atualização automática em segundo plano, que será útil quando a URL da API Web da fonte de dados não tiver sido alterada. Um novo recurso de mapeamentos de dados também estará disponível, fornecendo uma interface do usuário para você atualizar suas associações de forma mais conveniente.
Ações de grade de árvore
Agora você pode configurar ações de dados para criar, atualizar e excluir linhas no componente Tree-grid com chamadas de API Web. Você pode conectá-los aos botões de ação de edição da Grade de Árvore e aproveitar as atualizações da API Web em tempo real. Após a geração do código, App Builder criará os serviços necessários para lidar com as chamadas de API para criar, obter, atualizar e excluir um recurso por meio dos métodos HTTP Post/Put/Delete disponíveis.
Interação de seleção de linha de grade de árvore
Com esta versão App Builder, você também pode atualizar uma variável com base no evento Seleção de linha no componente Grade de árvore.
Como lembrete, em uma versão importante do App Builder no ano passado, expusemos vários manipuladores de eventos de componentes, que são fundamentais no contexto do Gerenciamento de Variáveis.
Os principais eventos incluem:
- Evento de seleção alterada: Utilizado no componente Combo.
- Evento de Seleção de Linha Alterada: Empregado nos componentes Grade e Grade de Árvore.
- Evento de clique: disponível para todos os componentes, esse evento é usado no contexto da configuração de uma variável em uma ação de clique.
- Eventos de componentes específicos. O componente Stepper, por exemplo, expõe as seguintes ações – Próximo/Anterior passo, Redefinir e Ir para o passo (x).
Verifique este tópico para obter mais informações –Trabalhando com eventos e ações no App Builder.
Novas propriedades do componente de árvore nesta versão App Builder também
Adicionadas propriedades do componente Árvore para expansão de nó único e alternância no clique do item.
- Expansão de nó único– se ativado, apenas um nó de árvore será expandido por vez. Ao tentar abrir um segundo, o primeiro entrará em colapso.
- Alternar item ao clicar– esta é uma propriedade que alterna o estado de expansão/recolhimento ao clicar nos nós, não apenas no ícone de expandir/recolher.
Outras melhorias
- Adicionada opção de estilo de pesquisa para o componente Entrada
- Angular aplicativos são gerados usando o Ignite UI for Angular 17.2.0
- Os aplicativos de Componente Web são gerados usando o Ignite UI for Web Components 4.9.0
- Blazor aplicativos são gerados usando o Ignite UI for Blazor 23.2.204
Embrulhar
Em conclusão, App Builder é um divisor de águas no processo de desenvolvimento de aplicativos. Com seu construtor visual baseado em nuvem, recursos de baixo código e novos recursos, é uma ferramenta obrigatória para qualquer organização. Experimente hoje! Se precisar de mais detalhes, recomendamos que você confira nosso:
Para experimentar tudo, visite o portal do cliente e obtenha a versão mais recente. Como de costume, estamos sempre ansiosos para receber seus comentários e ouvir o que você deseja adicionar ou recomendar. Então, por favor, envie-me um e-mail para zkolev@appbuilder.dev e deixe-me saber como podemos ajudá-lo a continuar agregando valor aos seus clientes com a Infragistics.
- Como obter personalização completa de low-code?
- Criando formulários React com App Builder facilitado
- Por que a flexibilidade de código é crucial no desenvolvimento moderno de low-code?
- Lidando com dados complexos – Escolhendo o componente certo para sua estrutura de dados
- Riscos de aprisionamento do fornecedor: por que as plataformas low-code devem priorizar a liberdade?
