DartPad

DartPad é uma ferramenta open source que permite brincar com a linguagem Dart em qualquer navegador moderno. Muitas páginas deste site têm DartPads incorporados. Para abrir o DartPad como uma página web independente, visite o site do DartPad (dartpad.dev).

Veja como o DartPad se parece quando configurado para executar Dart:

O DartPad suporta as bibliotecas principais dart:* marcadas como multi-platform. Ao escrever aplicativos Flutter, o DartPad também suporta as bibliotecas package:flutter e dart:ui.

O DartPad não suporta deferred loading nem o uso de pacotes do repositório pub.dev além dos pacotes atualmente suportados.

Para se familiarizar com o DartPad, tente executar alguns exemplos e criar um aplicativo de linha de comando simples.

1. Acesse o DartPad.

   O código Dart aparece à esquerda, e a área de saída aparece à direita.

2. Escolha um exemplo Flutter, como Sunflower, usando o botão Samples no menu superior.

   A saída renderizada aparece à direita.

Para criar um aplicativo de linha de comando simples, comece criando um novo snippet:

1. Clique no botão New e confirme que você deseja descartar as alterações do pad atual.

2. Clique na entrada com o logo do Dart.

3. Altere o código. Por exemplo, altere a função main() para conter este código:

   dart

   for (final char in 'hello'.split('')) {
     print(char);
   }
   

   content_copy

   Conforme você digita, o DartPad mostra dicas, documentação e sugestões de preenchimento automático.

4. Clique no botão Format.

   O DartPad usa o formatador Dart para garantir que seu código tenha indentação, espaçamento e quebras de linha adequados.

5. Execute seu aplicativo.

6. Se você não cometeu nenhum erro ao digitar o código, tente introduzir um bug.

   Por exemplo, se você trocar split por spit, verá avisos no canto inferior direito da janela. Se executar o aplicativo, um erro de compilação aparece no console.

As funcionalidades da linguagem e as APIs que o DartPad suporta dependem da versão do Dart SDK que o DartPad está usando. Você pode encontrar essa versão do SDK no canto inferior direito do DartPad.

Você pode incorporar o DartPad em páginas web, personalizando-o para o seu caso de uso. Por exemplo, o tutorial de futures contém vários DartPads incorporados rotulados como examples e exercises.

Para detalhes técnicos sobre como incorporar DartPads, veja o guia de incorporação do DartPad