【每日一技】释放双手,Figma 设计稿转 Jetpack Compose 代码

今天看到一篇有意思的 文章,核心内容是通过 Figma 设计稿生成 Compose 代码在 AS 中使用,由于原文访问需要魔法,故本文对 该文章 进行了简单整理

头图取自 该文章

Figma

  1. 打开 Figma 创建账号

  2. 创建或导入下方的 示例文件

  3. 在 Figma 中安装 插件

  4. save to version histor

  5. 生成 token

  6. 复制链接

AS

  1. 安装 Relay for Android Studio 插件

  2. build.gradle 使用 plugin

plugins {
    id 'com.android.application'
    id 'kotlin-android'
    id 'com.google.relay' version '0.3.02' // Relay 
}
  1. 设置 token

  1. 导入 Figma UI Package

material3 有点问题,这里使用 material

build 后可以看到根据设计稿生成了 Compose 代码

之后我们就可以调用 Compose 函数使用它啦~

猜你喜欢

转载自juejin.im/post/7232856799169708092