在 Pixelbook 上开发 Flutter 应用

文 / Tim Sneath，谷歌 Dart & Flutter 产品组产品经理

译 / 王鑫磊，CFUG 社区译者，贡献者，博客 xinlei.dev

原文：ProAndroidDev Medium 专栏

提示：本文已在 2019 年 1 月更新以匹配较新版本的 ChromeOS。然而，随着 Google 在持续不断对其优化，你可能会看到一些部分与本文描述内容有微小的差异。如果你在本文的最新版本中看到任何不清楚或错误的内容，请留下备注或评论，我会修正它。

在 Google I/O 2018 演讲中，Emilie Roberts 介绍了 Chrome OS 中一些很酷的新特性，主题是在 Pixelbook 上进行 Android 开发 。借助 Linux on Chromebooks 这一新功能，你现在可以直接在 Pixelbook 上运行 Android Studio，并通过 Wi-Fi 连接调试 Android 设备，甚至可以在 Pixelbook 上直接运行生成的 Android 应用程序。这一切都得感谢 Crostini 计划，它为设备提供了一个 Linux 容器实例。

更酷的是这一切都能在 Flutter 上表现得同样出色。这意味着你可以直接在设备上进行所有开发，甚至不需要模拟器来测试你的应用程序。虽然这有一点实验性质，但它对于那些不需要加入苹果生态系统的 Flutter 开发者来说变得相当有吸引力。

下面的截图来自一台正在运行 Visual Studio Code 的 Pixelbook，而且通过 Android Device Bridge 连接的 Flutter 应用程序同样也运行在本地。这可不是什么模拟器——Flutter 应用能够在 Pixelbook 上直接运行（请看 Visual Studio代码状态栏右下角的目标平台）。

接下来我将在这篇文章中分步说明如何在你自己的设备上运行它。Linux on Chromebook 支持现在已经进入 beta 阶段，但它需要一台支持 Crostini 的设备，包括 Pixelbook。但也可能会出现一些失灵的情况，这都因人而异。当然，ChromeOS 设备的性能特征将与典型的 iPhone 或 Android 设备的性能特征相差较大。我们也不能保证每个 Flutter 场景都能在这个平台上正确运行。这算是一个足够的警告了吧；）

要获得 Flutter 完整的调试功能，目前你需要将你的设备设为开发者模式，这样就可以移除一些为典型消费者使用的沙箱保护措施，并让你的设备支持不受 Play 商店信任的应用程序。在 Pixelbook 上，你可以在按下电源（Esc）按钮的同时按住 Refresh 键进入开发者模式。系统将重新启动并进入恢复页面（他会提示你插入U盘）。你只需要忽略这段文字并按住 Ctrl + D 即可，这将会在一段警告后进入该模式。

由于这种支持正在不断发展，将设备切换到 Chrome OS 的 beta 频道 并不是一个坏主意，它将会为你提供最新的信息（在 2019 年 1 月时它是 71.0.3578.94，但它会定期更新）。当你切换频道后，你需要让 Chrome OS 下载并安装该频道的最新版本，然后重启。

当你使用最新的频道重启后，你会在"设置"中看到一个新的条目，该条目可以让你在 Chromebook 上安装 Linux 支持。

在你打开开启它之后，ChromeOS 将会弹出下载并激活 Linux 容器的窗口。

我的机器花费了几分钟的时间来完成它。完成后，你会看到应用程序启动器上有一个闪亮的新终端应用程序图标，我立即把它固定到任务栏。

现在该来讲点有趣的事了。打开终端，然后使用 apt 进行检查，确保你正在使用较新版本的 Linux。你可以运行 sudo apt update && sudo apt upgrade 这个命令来完成这项操作。

我们还将在接下来的步骤中安装一些你需要的其他工具包和依赖项。

$ sudo apt install libglu1-mesa lib32stdc++6

由于你正在运行一个容器，在当前版本中下载到容器实例的最简单方法是使用 wget（你也可以使用 Chrome 下载它们并通过 SSH 隧道发送它们，但那会更加复杂）。你能够通过以下命令很轻松地下载并安装 Flutter。

curl -O https://storage.flutter-io.cn/flutter_infra/releases/stable/linux/flutter_linux_v1.5.4-hotfix.2-stable.tar.xz 
tar xf flutter_linux_v1.5.4-hotfix.2-stable.tar.xz
export PATH=`pwd`/flutter/bin:$PATH

现在你应该可以运行 flutter doctor 命令了，它会为 Flutter 提供一个干净的运行环境，即使它会在这个阶段抱怨缺乏必要的工具或设备。

现在，是时候安装一两个 IDE 了。Flutter 主要支持的两个 IDE （Android Studio 和 Visual Studio Code）都在 Chrome OS Linux 支持版上运行得相当完美。但是，无论你是否计划将Android Studio 作为 IDE，你都需要安装它以便拥有 Android 的构建工具。

你能够在官网上直接下载 Android Studio，但是由于 Linux 运行在与 Chrome 浏览器不同的容器中，所以你必须手动移动它才能在终端进行访问。拖住时同时按住 Shift 健，将其从 Download 目录移动到 Linux 文件节点中（它在 Linux 容器中代表了 home ~ 目录）。

然后，你就可以运行以下内容来解压缩并安装 Android Studio：

unzip android-studio.zip
sudo mv ~/android-studio /usr/local/
cd /usr/local/android-studio/bin
./studio.sh

你将会看到下面这样的弹窗：

点击剩下的设置步骤（我没有为选择 Android 虚拟设备而烦恼，因为你知道的，我们不再需要它了！）。当 IDE 启动时，创建一个新的空白项目（使用默认设定即可）。为了更加轻松地返回 Android Studio，我们将添加一个启动图标，所以请转到 Tools / Create Desktop 项。

现在我们能够为 Android Studio 安装 Flutter 插件了。要安装这些工具和集成，请跳到 File / Settings 并选择 Plugin 节点，然后点击 Browse repositories 。在这里搜索 Flutter 插件，如下所示，然后点击 Install 按钮。

这部分的最后一步——通过运行以下命令以确保你已同意所有 Android 许可证：

$ flutter doctor --android-licenses

对于 Visual Studio Code，你可以按照以下说明下载并安装。这将会下载 Visual Studio Code 包及必要的依赖并安装（go.microsoft.com URL会自动重定向到最新版本）。

curl -L -o vscode.deb https://go.microsoft.com/fwlink/?LinkID=760868
sudo apt install ./vscode.deb

最后打开 Visual Studio Code 安装 Flutter 扩展。

你马上就要完成了！运行 flutter doctor -v，现在应该显示所有设置都已完成，除了 no connected devices 这项，我们将会在最后解决这个问题。

我们需要处理一些事情，以便让 Pixelbook 被 Android 识别为开发设备。

首先是修改 Chrome OS 的防火墙，以 允许来自 Linux 端传入 ADB 链接。在一个 Chrome 窗口中点击 Control+Alt+T 来开启 Chrome OS 的终端，然后输入 shell 来启动一个终端中的 shell。如果 shell 不起作用，那么你可能是忘记了将设备设为开发者模式，我们前面提到过这一点。

现在，运行一些 sudo 命令：

chronos@localhost / $ sudo crossystem dev_boot_signed_only=0
chronos@localhost / $ sudo /usr/libexec/debugd/helpers/dev_features_rootfs_verification
chronos@localhost / $ sudo reboot

在系统重启后，你只需要运行这最后一个命令：

chronos@localhost / $ sudo /usr/libexec/debugd/helpers/dev_features_ssh

接下来是打开 Android 开发者模式。你也许会想，我们最开始不是已经完成这一步了吗？但是我们仅仅是设置 Pixelbook 自身为开发者模式：安卓端需要使用你也许用过的手机上相同的魔术开关。这个设置隐藏的有点深：从设置应用中选择 Google Play Store 菜单，然后选择管理 Android 偏好设置（Manage Android preferences）：

这将会为 Android 托管环境打开另一个设置应用，你可以在其中找到"关于设备"（About device）页面。

连续点击 build number 7 次：这是解锁开发者选项屏幕的神奇咒语，可让你打开 ADB 调试：

现在，你终于可以建立 Flutter 能够访问的本地设备的 ADB 连接。假设你是在主目录下解压 Android Studio，那么你会在以下位置找到 adb ：$/Android/Sdk/platform-tools/adb

执行以下命令，以连接到本地 Android 实例：

$ adb connect 100.115.92.2:5555

幸运的话，flutter doctor 会给你一个干净健康的环境。你现在可以创建并运行 Flutter 应用了！例如：

flutter create testapp
cd testapp
flutter run

等 Gradle 编译完 APK 并将其安装后，你将会看到一个全屏的正在运行样例应用代码的窗口跳出来。

与其他在 Pixelbook 上运行的 Android 应用程序一样，你可以从最大化的窗口恢复为正常大小，这时候应用程序将会看上去和手机上运行的外观非常相似：除了它是直接运行在你的 Pixelbook 上的！

你可能希望稍微调整屏幕 DPI 设置以获得更多空间。有些应用程序在这方面上比其他应用程序响应更好;特别是我发现一些 Android Studio 对话框对于给定的 DPI 设置来说太小了。

然而总的来说，这似乎非常有用，特别是如果你愿意使用这些由各个团队完成的最新特性的话。如果你有 Pixelbook 并一直在等待一个学习 Flutter 或尝试构建应用的方法的话，它绝对值得你试一试！祝你玩得开心，欢迎告诉我们你的故事：你可以在 Twitter 上的 @flutterio 中找到我们团队。

除非另有说明，本文档之所提及适用于 Flutter 的最新稳定版本，本页面最后更新时间: 2024-05-10。 查看文档源码 或者 为本页面内容提出建议。