联系方式

Rik Arends: Twitter @rikarends，https://fosstodon.org/@rikarends#

Eddy Bruel: Twitter @ejpbruel

Sebastian Michailidis: Twitter @SebMichailidis

我们的 Makepad Discord 频道: https://discord.gg/adqBRq7Ece

关于 Makepad 的最新演讲: https://www.youtube.com/watch?v=rC4FCS-oMpg

Makepad

概述

这是 Makepad 的代码仓库，Makepad 是一种使用 Rust 为原生平台和 Web 构建 UI 的新方法。

Makepad 由 Makepad 框架和 Makepad Studio 组成。

Makepad 框架是我们的 UI 框架。它由多个 crate 组成，但顶层 crate 是 makepad-widgets。有关 Makepad 框架的进一步说明，请参阅该 crate 的 README。

Makepad Studio 是我们使用 Makepad 框架构建的 IDE 原型。它仍在积极开发中，但我们最终的目标是创建一个 IDE，使应用程序的设计可以在运行时更改。Makepad Studio 的主要 crate 是 makepad-studio。更多信息请参阅该 crate 的 README。

演示链接:

makepad-example-fractal-zoom

makepad-example-ironfish

makepad-example-simple

先决条件

要构建 Makepad crate，首先需要安装 Rust。 https://www.rust-lang.org/tools/install

我们的原生构建可以在稳定的 Rust 工具链上运行。但是，Makepad 在运行时生成的一些错误（特别是那些源自我们的 DSL 的错误）不包含行信息，除非使用 nightly Rust 工具链。此外，我们的 Web 构建目前只能在 nightly 版本上运行。因此，我们建议您使用 nightly Rust 工具链构建 Makepad。

对于非标准构建目标（苹果 iOS、苹果 tvOS、Android、wasm），我们有一个名为 'cargo-makepad' 的构建工具，您需要安装它。

从仓库安装:

cargo install --path=./tools/cargo_makepad

或从 cargo 安装（可能落后于仓库）

cargo install cargo-makepad

现在可以使用这个工具为每个平台安装所需的工具链

cargo makepad wasm install-toolchain

cargo makepad apple ios install-toolchain

cargo makepad apple tvos install-toolchain

cargo makepad android --abi=all install-toolchain

运行 makepad studio

Makepad studio 允许您轻松构建和查看示例，它内部使用 cargo-makepad，所以请确保按上述方法安装 cargo-makepad。

cargo run -p makepad-studio --release

或从 cargo 安装（可能落后于仓库）

cargo install makepad-studio

如果您构建 wasm 应用程序，可以在以下地址打开它:

http://127.0.0.1:8010

构建和运行命令

Makepad 是一个用 Rust 编写的跨平台 UI 框架。 它正在积极开发中，但已经可以用来构建快速原型和简单（甚至复杂的 UI）应用程序。

Makepad 的一个主要特点是能够简单、快速地在多个平台上构建和运行应用程序，包括 MacOS、Windows、Linux、Android、iOS 和 WebAssembly。

以下是在不同平台上构建和运行 Makepad 应用程序的当前/最新说明。

假设

我们将假设以下内容: 应用程序名称: makepad-example-simple

它可以更改为 Makepad 示例文件夹 中的任何现有示例应用程序。

构建和运行说明

按照下面的步骤 1 命令进行 Makepad 构建和运行环境的初始设置。 在步骤 2 之后，您可以选择一个或多个您感兴趣的构建平台。

1. 设置 Makepad

将 projects 替换为您自己的目录名。

cd ~/projects

克隆 Makepad 仓库

git clone https://github.com/makepad/makepad.git

或

git clone git@github.com:makepad/makepad.git

切换到最新的 'rik' 分支（可选）

cd ~/projects/makepad
git branch rik

为 cargo 安装 makepad 子命令

cd ~/projects/makepad
cargo install --path ./tools/cargo_makepad

安装平台工具链

rustup toolchain install nightly

2. 进入示例文件夹（可选）

cd ~/projects/makepad/examples
ls -l

该目录中的所有示例的应用程序名称都以 makepad-example- 为前缀，后跟目录名。

3. MacOS / PC

在桌面上运行是尝试示例应用程序最快的方法。

cd ~/projects/makepad/examples/simple
cargo run

或

cd ~/projects/makepad
cargo run -p makepad-example-simple

现在应该有一个桌面应用程序窗口正在运行（在 MacOS 的 Dock 上可能需要点击图标才能显示）

4. Android 构建

安装 Android 工具链（首次使用）

cargo makepad android install-toolchain

在 Android 设备或 Android 模拟器上安装应用

打开 Android 模拟器或连接到真实的 Android 设备 使用 adb 命令确保正确连接了单个设备，然后按以下方式安装和运行:

cd ~/projects/makepad
cargo makepad android run -p makepad-example-simple --release

应用程序将安装并在模拟器或设备上启动。

5. iOS 设置和安装

安装 iOS 工具链（首次使用）

xcode-select --install
cargo makepad apple ios install-toolchain

在 Apple 设备或 iOS 模拟器上安装应用

iOS 设置

对于 iOS，过程稍微复杂一些。涉及的步骤包括:

1. 启用您 iPhone 的开发者模式，请参阅以下说明: 启用开发者模式
2. 设置 Apple 开发者账户
3. 在 XCode 中设置一个空的骨架项目
   1. 文件 -> 新建 -> 项目，创建一个新的 "App"
   2. 将产品名称设置为 makepad-example-simple（稍后在 --app 中使用）
   3. 将组织标识符设置为您选择的值，在本例中我们将使用 my.test（稍后在 --org 中使用）
   4. 设置项目签名和功能，选择适当的团队账户
4. 在 XCode 中，构建/运行此项目以在模拟器和设备上安装和运行应用
5. 一旦模拟器和设备正确安装并运行了 "骨架" 应用，就为 Makepad 安装其应用程序做好了准备。

Makepad 安装

我们将运行 cargo makepad apple ios 命令，类似于上面的 Android 构建，但需要填写 2 到 6 个额外的参数:

--org

组织标识符的前几个部分。通常是 com.somecompany 或 org.orgname 等形式。 这与上面用于设置初始骨架应用的值相同。对于本例:

my.test

--app

应用程序或项目的名称。这与上面用于设置初始骨架应用的产品名称相同。在本例中:

makepad-example-simple

在 iOS 模拟器上安装应用

cd ~/projects/makepad
cargo makepad apple ios \
  --org=my.test \
  --app=makepad-example-simple \
  run-sim -p makepad-example-simple --release

在iOS设备上安装应用

由于可能存在多个配置文件、签名身份和目标设备,在真实设备上安装过程更为复杂。因此,Makepad提供了一个列表命令,用于显示所有本地配置文件、签名身份和连接的设备,这些可以用作后续命令参数的值。

例如,首先运行以下命令:

cd ~/projects/makepad
cargo makepad apple list

该命令将打印出当前系统上所有配置文件、签名身份和设备标识符的列表。用户必须决定并选择每种类型需要使用的内容。

一旦决定好,运行以下命令并填入从输出中选择的唯一起始字符。

cargo makepad apple ios \
 --profile=配置文件的唯一起始十六进制字符串 \
 --cert=签名证书的唯一起始十六进制字符串 \
 --device-identifier=设备的唯一起始十六进制字符串 \
 --org=my.test \
 --app=makepad-example-simple \
 run-device -p makepad-example-simple –release
 

应用程序将安装并在模拟器或真实设备上启动。(确保设备已连接并解锁)

6. WASM构建

将Makepad应用程序作为WASM构建运行就像执行一个简单的命令一样容易。脚本将自动生成必要的index.html和其他文件,并在端口8010上启动本地网络服务器。运行以下命令后,只需在浏览器中打开http://127.0.0.1:8010/即可加载和运行应用程序。

安装WASM工具链(首次使用)

cargo makepad wasm install-toolchain

为浏览器安装WASM二进制应用

cargo makepad wasm run -p makepad-example-simple --release

---

Makepad命令快速参考

Cargo工具安装

这些命令需要至少初次运行一次,以设置Makepad开发环境。 它们也应该时不时运行一次,或在cargo_makepad脚本有更新时运行。

rustup update
rustup install nightly
rustup toolchain install nightly

cd ~/projects/makepad
cargo install --path ./tools/cargo_makepad
cargo makepad android install-toolchain
cargo makepad apple ios install-toolchain
cargo makepad apple tv install-toolchain
cargo makepad wasm install-toolchain

Android

将应用安装到iOS模拟器的命令。

cargo makepad android run -p makepad-example-simple --release

cargo makepad android run -p makepad-example-fractal-zoom --release

cargo makepad android run -p makepad-example-ironfish --release

cargo makepad android run -p makepad-example-news-feed --release

iOS模拟器

将应用安装到iOS模拟器的命令。

cargo makepad apple ios --org=my.test --app=makepad-example-simple run-sim -p makepad-example-simple --release

cargo makepad apple ios --org=my.test --app=makepad-example-fractal-zoom run-sim -p makepad-example-fractal-zoom --release

cargo makepad apple ios --org=my.test --app=makepad-example-ironfish run-sim -p makepad-example-ironfish --release

cargo makepad apple ios --org=my.test --app=makepad-example-news-feed run-sim -p makepad-example-news-feed --release

iOS设备

将应用安装到物理iOS设备的命令。

更详细的说明请参阅上面的第5步。

cargo makepad apple ios --org=my.test --profile=ABC --cert=DEF --device=MyiPhone --app=makepad-example-simple run-device -p makepad-example-simple --release

cargo makepad apple ios --org=my.test --profile=ABC --cert=DEF --device=MyiPhone --app=makepad-example-fractal-zoom run-device -p makepad-example-fractal-zoom --release

cargo makepad apple ios --org=my.test --profile=ABC --cert=DEF --device=MyiPhone --app=makepad-example-ironfish -run-device -p makepad-example-ironfish --release

cargo makepad apple ios --org=my.test --profile=ABC --cert=DEF --device=MyiPhone --app=makepad-example-news-feed run-device -p makepad-example-news-feed --release

Cargo检查构建

检查所有Makepad支持平台的编译是否通过的命令: (将使用100%的CPU并可能导致机器卡顿,仅在高端系统上尝试)

cargo makepad check install-toolchain
cargo makepad check all