Figma 設(shè)計稿轉(zhuǎn) Compose 代碼

今天看到一篇有意思的文章，核心內(nèi)容是通過 figma 設(shè)計稿生成 Compose 代碼在 AS 中使用：文章在這https://medium.com/@easygautam/relay-android-and-figma-ui-design-with-no-code-a8d36b427146

1. 打開 Figma 創(chuàng)建賬號 https://www.figma.com/

2. 創(chuàng)建或?qū)胂路降氖纠募?/p>

3. 在 Figma 中安裝 插件https://www.figma.com/community/plugin/1041056822461507786/Relay-for-Figma

4. save to version histor

5. 生成 token

6. 復(fù)制鏈接

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. 設(shè)置 token

1. 導(dǎo)入 Figma UI Package

「material3 有點問題，這里使用 material」

build 后可以看到根據(jù)設(shè)計稿生成了 Compose 代碼

之后我們就可以調(diào)用 Compose 函數(shù)使用它啦～