Jetpack Compose: Issues with converting Figma designs to theme using Relay plugin

I’m having trouble with my Jetpack Compose app. I’m trying to use the Relay plugin to turn my Figma designs into a Compose theme. But it’s not going smoothly.

I’ve added the figma_styles.json file to my project. This file holds all the style information from my Figma design, but Android Studio isn’t finding the required packages.

Here’s what I did:

  1. Created the design in Figma
  2. Exported the styles using the Relay plugin
  3. Added the JSON file to my Android project
  4. Tried importing the necessary packages

Now, the IDE doesn’t recognize the imports. Has anyone encountered this issue? I’d appreciate any suggestions on how to resolve it.

yo, i feel ur pain. had similar headaches. try this: delete .gradle and .idea folders, then invalidate caches & restart. sometimes AS gets confused w/ new plugins. also, double-check ur kotlin version matches relay’s requirements. if nothin works, maybe post ur build.gradle? community might spot smthn we missed. hang in there!

hey, had similar issues. make sure ur using latest relay version in gradle. also, check if figma_styles.json is in right folder (src/main/relay). if still no luck, try clean build/rebuild project. sometimes android studio just needs a kick in the pants lol. good luck!

I’ve worked with the Relay plugin for Figma-to-Compose conversion, and it can be tricky. One common issue is outdated dependencies. Make sure you’ve added the latest Relay dependencies to your app’s build.gradle file. Sometimes, the auto-generated code requires specific versions.

Another potential problem is the placement of the figma_styles.json file. It should be placed in the ‘src/main/relay’ directory. If it’s located elsewhere, the plugin might not detect it properly.

Lastly, try invalidating caches and restarting Android Studio. This often resolves package recognition issues. If the problems persist, double-check that your Relay plugin version is compatible with your current Jetpack Compose version, as mismatches can lead to unexpected behavior.

As someone who’s been down this road, I feel your pain. The Relay plugin can be finicky. One thing that helped me was manually syncing the project with Gradle files after adding the JSON. Sometimes Android Studio doesn’t pick up new resources automatically.

Also, double-check your import statements. The Relay-generated classes might be in a different package than you expect. I once spent hours debugging only to realize I was importing from the wrong place.

If all else fails, try creating a new, bare-bones project and importing your Figma styles there. This can help isolate whether it’s a project-specific issue or something broader with your setup. It’s a bit of extra work, but it saved me a ton of headaches in the long run.

Remember, Jetpack Compose is still relatively new, and these tools are evolving. Don’t be too hard on yourself if it takes some trial and error to get it right.

I’ve encountered similar issues with the Relay plugin. One often overlooked solution is to ensure your Kotlin version is compatible with both Jetpack Compose and Relay. Incompatible versions can cause import problems.

Another tip: check if you’ve added the Relay plugin to your project-level build.gradle file. It’s easy to miss this step.

If you’re still stuck, try running ‘gradlew assembleDebug --scan’ in the terminal. This generates a build scan that can pinpoint dependency conflicts or missing components.

Lastly, make sure your Android Gradle Plugin is up-to-date. Outdated AGP versions can sometimes interfere with Compose-related tools like Relay.

Keep at it – these hiccups are frustrating but usually solvable with some persistence.