Clever Geek Handbook

Anúncio do Flutter 1.20

Desempenho aprimorado, preenchimento automático, novo widget e muito mais!



Olá a todos, sou Evgeny Saturov do Surf. Apresento a tradução do artigo oficial sobre a última atualização do Flutter 1.20 com meus comentários. A estrutura fica mais e mais polida a cada novo lançamento, e hoje vamos dar uma olhada no que o canal stable nos trouxe no final do verão.







A cada novo lançamento, nós nos esforçamos para tornar o Flutter mais rápido, esteticamente mais agradável e produtivo, e para garantir que ele esteja disponível para todas as plataformas suportadas. Na versão 1.20, que, no momento do lançamento deste artigo, já estava em nosso canal estável, o Flutter melhorou cada um desses critérios.



Falando em desempenho , conseguimos melhorar o desempenho tanto nos níveis mais baixos do mecanismo de renderização quanto na própria linguagem Dart.



Para tornar os aplicativos Flutter ainda mais estéticos, adicionamos vários aprimoramentos de IU a esta versão, incluindo suporte de preenchimento automático há muito aguardado, uma nova maneira de mover e escalar widgets, suporte de cursor do mouse, widgets de seleção de material atualizados (como widgets de selecionador de data e hora) e uma nova página responsiva com licenças para a janela Sobre, para aplicativos de desktop e móveis Flutter.



Para ajudá-lo a ser mais produtivo , atualizamos a extensão Flutter para Visual Studio Code :

  • permite que você use o Dart DevTools diretamente em seu IDE;
  • agora você pode mover arquivos pelo projeto e as importações serão atualizadas automaticamente;
  • um novo conjunto de metadados foi adicionado para que você possa escrever suas próprias ferramentas.


Graças à abertura do Flutter e à incrível comunidade do Flutter, este lançamento inclui 3.029 solicitações de pull vazadas e 5.485 questões fechadas de 359 colaboradores de todo o mundo, incluindo 270 colaboradores da comunidade do Flutter. Além disso, este é um número recorde de colaboradores que tínhamos na época do próximo lançamento. Gostaríamos de expressar um agradecimento especial aos colaboradores CareF por 28 solicitações pull, AyushBherwani1998 por 26 (incluindo 10 amostras do Google Summer of Code) e a14npara 13 solicitações pull, muitas das quais adotamos durante o trabalho com segurança nula no Flutter (escreveremos mais sobre isso em breve). Não poderíamos ter construído o Flutter sem esse enorme apoio da comunidade. Obrigado pela sua contribuição!



Com cada novo lançamento do Flutter, vemos o número de usuários crescendo rapidamente. Só em abril, escrevemos que o número de aplicativos Flutter no Google Play chegou a 50 mil. No período de pico, o crescimento foi de 10 mil novos pedidos por mês. Agora, depois de apenas três meses, mais de 90 mil foram publicados no Google Play.



Aplicativos de vibração. Estamos vendo o maior crescimento na Índia, que se tornou a região número um para desenvolvedores de Flutter. Nos últimos seis meses, seu número dobrou, o que é uma consequência direta doaumentando o investimento do Google na região. Finalmente, Flutter não seria Flutter se não fosse por Dart. É bom ver Dart classificado em 12º lugar nas 50 principais linguagens de programação pela revista IEEE Spectrum , quatro posições acima do ano passado.



Melhorias de desempenho para Flutter e Dart



Nós da Flutter estamos sempre procurando novas maneiras de reduzir o tamanho e acelerar seus aplicativos. Por exemplo, nesta versão, corrigimos um problema de desempenho com a remoção do ícone de fonte ao tremer da árvore e também ativamos esse comportamento por padrão ao construir aplicativos não-web. As melhorias mencionadas resultam na remoção de fontes não utilizadas, reduzindo seu tamanho. Testamos isso no aplicativo Flutter Gallery - foi reduzido em 100 KB de tamanho . Este agora é o comportamento padrão para versões de lançamento. Por enquanto, isso só funciona com fontes TrueType, mas essa limitação será removida em versões futuras.



Outra melhoria de desempenho é reduzir a irregularidade da animação na primeira exibição por meio de uma fase de aquecimento. Veja como a suavidade da animação aumentou (a gravação foi desacelerada duas vezes para maior clareza).





Comparação de animações antes e depois da introdução do aquecimento SkSL



No caso de um aplicativo Flutter exibir animação irregular durante o primeiro lançamento, isso pode ser corrigido usando o Skia Shading Language. Ao pré-compilar no estágio de construção do aplicativo, ele pode acelerar a animação em mais de 2 vezes. Se você gostaria de aproveitar esta funcionalidade, vá para a página de aquecimento SkSL em flutter.dev.







, Flutter- . ? - Flutter - . 1.20 . , , .



-, Apple (, ) — - Metal. OpenGL.



-, . , flutter build. , . , .


Finalmente, à medida que otimizamos para desktops, continuamos trabalhando no suporte ao mouse. Neste lançamento, reformulamos o sistema de teste de cliques do mouse para fornecer vários benefícios arquitetônicos que não estavam disponíveis devido a problemas de desempenho. Essa refatoração resultou em uma melhoria de 15x no desempenho em nossos microbenchmarks da web: os usuários obterão um verificador de acertos melhor, mais consistente e mais preciso sem sacrificar o desempenho.



Além do teste de clique aprimorado, adicionamos suporte para cursores de mouse, um dos recursos mais solicitados para computadores desktop. Alguns dos widgets mais comumente usados ​​exibirão os cursores que você espera por padrão. Ou você pode escolher outro na lista de cursores suportados.







- Flutter for Web . 1.20, . , .




Novos cursores do mouse em widgets no Android



Esta versão do Flutter é baseada no Dart 2.9 e inclui um novo decodificador UTF-8 de duas passagens. É baseado em estado e contém primitivas de decodificação otimizadas na máquina virtual Dart e aproveitando as instruções SIMD em parte.



UTF-8 é o método de codificação de caracteres mais comum na Internet. A capacidade de decodificar rapidamente desempenha um papel crítico na obtenção de grandes respostas de rede. Em nossos benchmarks de decodificação UTF-8, notamos melhorias em toda a linha. O aumento de velocidade foi de quase 200% para inglês e até 400% para textos em chinês em dispositivos ARM de baixo desempenho.



Preenchimento automático para aplicativos Flutter



O suporte para preenchimento automático de campos de texto em aplicativos Flutter no Android e iOS tem sido um dos recursos mais cobiçados. Temos o prazer de anunciar que, após a solicitação de pull 52126 , você não precisa mais pedir a seus usuários para inserir novamente os dados que o sistema operacional já coletou para eles.





Autocomplete em ação



Além disso, já começamos a adaptar esta funcionalidade para a web.



Novo widget para ações de modelo



Nesta versão, adicionamos um novo widget - InteractiveViewer. InteractiveViewer foi projetado para implementar ações modeladas em seu aplicativo, como panorâmica, dimensionamento e arrastar e soltar, que funcionam mesmo quando redimensionadas. Veja como este widget funciona para o exemplo de placa em Go .





Escala, panorâmica, redimensionamento, arrastar e soltar com InteractiveViewer



Para integrar InteractiveViewer em seu aplicativo, verifique a documentação da API . Você também pode experimentá-lo em ação no DartPad. Se você estiver interessado em aprender mais sobre o desenvolvimento do InteractiveViewer, confira esta apresentação no canal do Chicago Flutter no YouTube .



Na nova versão, também adicionamosmais opções para arrastar e soltar . Por exemplo, se você precisa saber exatamente onde a queda ocorreu no widget de destino (esta opção estava anteriormente disponível apenas para o objeto Draggable ), agora você pode obter esses dados usando o método DragTarget onAcceptDetails .





onAcceptDetails em ação



Confira este exemplo para aprender mais sobre esse recurso. Na próxima versão do Flutter, essa informação também estará disponível durante o arrastar e soltar, permitindo que o DragTarget atualize seu estado visual em tempo hábil.







InteractiveViewer , , . , : — Justin McCandless. , Flutter. Justin ChicagoFlutter , Transform GestureDetector InteractiveViewer, .


Material- Slider, RangeSlider, TimePicker DatePicker



Junto com novos widgets, esta versão contém uma série de widgets atualizados de acordo com os novos princípios de design de materiais . Especificamente Slider e RangeSlider. Para obter mais informações, consulte O que há de novo no widget Slider? ...







Material deslizante





atualizado Material RangeSlider atualizado O



DatePicker tem um novo design compacto e suporte para intervalos de datas.





DatePicker atualizado



Finalmente, redesenhamos completamente o TimePicker.





TimePicker atualizado



Você pode testar o novo TimePicker nesta demonstração Flutter .



Página de licenças responsivas



Criamos uma nova página de licença responsiva disponível em AboutDialog.





Nova página com licenças



Pull Request 57588 do contribuidor  TonicArtos foi atualizado de acordo com os princípios de design de materiais. Isso não só tornou o widget mais bonito, mas também melhorou a navegação: agora é conveniente usá-lo em tablets, desktops e smartphones. Obrigado, TonicArtos Considerando que todo aplicativo Flutter deve mostrar licenças para os pacotes que usa, você tornou todos os aplicativos Flutter melhores!



Novo formato pubspec.yaml para publicar plug-ins



Claro, Flutter não se trata apenas de widgets. Eles também são ferramentas. Existem muitas atualizações neste lançamento, então vamos falar sobre as mais notáveis.



Vamos começar com um anúncio para os autores do plug-in Flutter: o antigo formato pubspec.yaml não é mais suportado ao publicar plug-ins. Se você tentar usá-lo, obterá um erro ao executar o pub publish.





Ocorreu um erro ao publicar um plug-in no formato pubspec desatualizado. O



formato antigo não era compatível com a especificação das plataformas em que seus plug-ins são executados. Ele está obsoleto desde o Flutter 1.12. O novo formato pubspec.yaml agora é necessário para publicar plug-ins novos ou atualizados .



Os usuários de plug-ins ainda podem usar o antigo formato pubspec. Todos os plug-ins existentes no pub.dev que usam o pubspec.yaml obsoleto continuarão a funcionar com os aplicativos Flutter em um futuro próximo.



Visualização do Dart DevTools integrado no Visual Studio Code



A maior atualização de ferramentas nesta versão está no Visual Studio Code, com uma prévia de um novo recurso que traz o Dart DevTools diretamente para o espaço de desenvolvimento.





Visualização do Layout Explorer no código do Visual Studio



Habilite este recurso com a nova configuração dart.previewEmbeddedDevTools . A captura de tela acima mostra o Flutter Widget Inspector integrado ao Visual Studio Code. Com esta configuração, você pode atribuir uma página favorita do menu Dart DevTools localizado na barra de status.





Este menu permite que você escolha quais páginas mostrar.Este





recurso ainda está na visualização. Contate-nos se tiver algum problema com isso







— , , , Flutter-, VS Code ! , — -. , - , — . : VS Code. Android Studio .




A versão mais recente do Dart DevTools vem com uma versão atualizada do utilitário Network que permite que você crie perfis de solicitações da web.





Duração da



página de rede do Dart DevTools, status e tipo de conteúdo de conexões de soquete A página Rede agora adiciona informações de tempo para chamadas de rede de seu aplicativo - junto com outros dados, como status e tipo de conteúdo. Melhorias adicionais foram feitas na interface de detalhes da solicitação, que agora exibe dados de um soquete da web ou solicitação http. Temos mais planos para esta página, por exemplo, queremos adicionar a exibição do corpo da solicitação e resposta HTTP, bem como monitorar o tráfego gRPC.



Atualizando importações ao renomear arquivos



Outro novo recurso do Visual Studio Code é que as importações são atualizadas ao mover ou renomear arquivos.





Atualizando arquivos Dart em movimento



Este recurso atualmente funciona apenas para arquivos individuais, mas em breve adicionaremos suporte para vários arquivos ou pastas.



Comentário do



Android Studio, agora se eu fosse você, ficaria seriamente preocupado. Um dos recursos mais sutis, mas tão importantes, de seu amado IDE está agora no VS Code. Agora você pode renomear arquivos o quanto quiser! Você não precisa ajustar manualmente todas as importações (sim, eu sei que todos nós passamos por isso). Oh, quantas horas de trabalho a atualização do plugin VS Code nos salvou. Será interessante saber quais outros recursos avançados de refatoração você usa no VS Code? Escreva nos comentários.



Metadados de ferramentas



Outra atualização é para pessoas que criam ferramentas Flutter. Fizemos um novo projeto no GitHub: lá iremos coletar e publicar metadados sobre o próprio framework. Nele você encontrará arquivos legíveis por máquina contendo estes dados:



Esses são os metadados que usamos para as extensões Android Studio / IntelliJ e VS Code. Achamos que eles poderiam ser úteis na criação de novas ferramentas. Nos aplicativos da família IntelliJ, esses metadados permitem que você habilite a exibição da cor usada em seu código Flutter.







Relacionado a isso está um novo recurso no IntelliJ e no Android Studio que renderiza blocos de cores para Color.fromARGB () e Color.fromRGBO ().







Gostaríamos de expressar um agradecimento especial a dratushnyy no GitHub por contribuir para melhorar as visualizações de cores no IntelliJ!



Canais de plataforma de tipo seguro para comunicação de plataforma cruzada



Em resposta a uma solicitação popular dos autores de plug-ins, decidimos fazer experiências como tornar a comunicação entre o Flutter e a plataforma mais segura e fácil para plug - ins e Add-to-App . Para fazer isso, criamos o Pigeon , uma ferramenta de linha de comando que usa a sintaxe Dart para gerar código de tipo seguro em cima de canais de plataforma sem dependências de tempo de execução adicionais. O Pigeon permite que você chame métodos Java / Objective-C / Kotlin / Swift e passe objetos não primitivos chamando métodos Dart diretamente (e vice-versa) em vez de fazer a correspondência manual de nomes de métodos em canais de plataforma e serializar argumentos.







Apesar do Pigeon ainda estar em estado de pré-lançamento, ele evoluiu o suficiente para que possamos usá-lo em nosso plugin video_player . Se você estiver interessado em experimentar o Pigeon em seu projeto, verifique a documentação do canal da plataforma atualizada e este exemplo .







Pigeon. , . Mobius GDG DevParty, Flutter- . «» , . -. Pigeon — .





Durante a produção do Flutter 1.20, as ferramentas receberam tantas atualizações excelentes que não podemos listá-las todas aqui. No entanto, você certamente terá interesse em dar uma olhada neles:





Quebrando mudanças



Como sempre, tentamos manter as alterações significativas ao mínimo. Aqui está uma lista dessas mudanças no Flutter 1.20.





Resumo



Este é o maior lançamento do Flutter até agora. Neste artigo, abordamos apenas as melhorias mais significativas de ferramentas e desempenho e falamos sobre os widgets mais interessantes, novos e atualizados.



Planejamos adicionar suporte de segurança nula (consulte o artigo detalhado de Bob Nystrom Entendendo a segurança nula ), lançar novas versões dos plug-ins Ads, Maps e WebView e expandir o suporte à ferramenta.



Como você aplicaria os novos recursos do Flutter ao seu projeto?


More articles:


All Articles