[Daily skill] Free your hands, convert Figma design draft into Jetpack Compose code

I saw an interesting article today . The core content is to generate Compose code through Figma design draft and use it in AS. Since access to the original text requires magic, this briefly organizes the article.

The header image is taken from this article

Figma

1. Open Figma to create an account

2. Create or import the example file below

   

3. Install plugins in Figma

4. save to version histor

5. generate token

6. copy Link

AS

1. Install the Relay for Android Studio plugin

   

2. build.gradle uses plugin

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

3. set token

4. Import Figma UI Package

There is a problem with material3, use material here

After build, you can see that Compose code is generated according to the design draft

Then we can call the Compose function to use it~