首页 文章详情

Dart 官方开源的在线编辑器,还能跑 Flutter

知识小集 | 113 7天前 0 0 0
UniSMS (合一短信)

DartPad

地址:https://github.com/dart-lang/dart-pad

⭐️:1.3k

语言:Dart

官网:https://dartpad.dev/

DartPad 是一个免费的开源在线编辑器,可帮助开发人员了解 Dart 和 Flutter。

DartPad 最初是由 Dart 工具团队于 2015 年构建的 Dart 语言在线 Playground。它可以编译、分析和显示 Dart 代码的结果,并且可以作为 iframe 嵌入到其他网站中。

在 2019 年 12 月,Dart 工具团队推出了新版本的 DartPad (dartpad.dev),让这个工具有了全新的外观和对流行的 Flutter UI 工具包的支持。可以直接在浏览器中运行 Dart 程序,还可以运行 Flutter 应用程序。

创建新项目

要用 DartPad 创建一个新的 Flutter 项目,可以打开 https://dartpad.dev/ 页面,然后单击顶部的 New Pad 按钮并选择 Flutter

编辑器中会有一些启动代码,我们可以运行它。当 DartPad 看到我们在使用 package:flutter 时,就会出现一个面板来显示 UI。也可以使用右上角的 Samples 菜单查找 Flutter 示例。

DartPad 的特点

Flutter 的所有核心库,例如 cupertinomaterial 都可以使用,并且 DartPad 可以显示它们的文档。选择一个符号以查看底部面板中的文档。

DartPad 使用 Dart 格式化程序 (dartfmt) 格式化代码,并且提供帮助文档,提供修复,建议自动完成,并显示错误和警告。

当我们准备好分享代码片段时,可以创建一个 GitHub gist 并将 gist ID 放在如下 URL 中:https://dartpad.dev/<GistID>。我们可以在 bug reportStackOverflow 或其它一些社交媒体平台上共享此链接。

我们也可以将 DartPad 嵌入到页面中,就像在这个 https://docs.flutter.dev/codelabs/layout-basics 这个页面中一样。嵌入式 DartPads 特别适合用于文章、代码实验室和教程。具体的操作指南可以参考 https://github.com/dart-lang/dart-pad/wiki/Embedding-Guide

good-icon 0
favorite-icon 0
收藏
回复数量: 0
    暂无评论~~
    Ctrl+Enter