Hello devs,
I’m Hossam, a react native dev from Egypt. I wish this finds you all well.
I’m planning to build a plugin that generates React Native components out of Adobe XD artboards. I’ve read an article talking about a new plugin that will generate Flutter code out of artboards which encouraged me. Also after some search I found a plugin named web export
which generates HTML code. All of this convinced me that it is possible. I’d like to get your impression of the idea.
Thanks
4 Likes
Hi @hossamAbdelnaser, welcome to the forums .
First of all: Thank you for taking the time to introduce yourself here .
I don’t know a lot about React Native (this is one of the far too many topics I want to look into when I find the time ), but you may find the discussion I had in Is this possible: a "translator" that exports XD elements to a given structure in XML format or equivalent - #4 by pklaschka interesting, as this, too, was about (in one way or another) generating some sort of structured output (which, components, after all, are as well), meaning there’s at least some connection there.
Basically, as with any code generator, it depends on the complexity you want. Generating something that looks the same should be relatively easy (emphasis on relative ), generating compontents that work well and potentially even declare elements like buttons correctly is already a lot more complex (how do you “recognize” a button/slider/whatever in an XD document?).
As you can probably tell, I’m really no expert when it comes to React Native (I have no idea what elements are predefined there etc., I only know it doesn’t support HTML elements), meaning I’ll leave it up to others who have more experience with this topic to provide you some more valuable thoughts on that.
Still, I hope that maybe the things I’ve mentioned from a pure XD-side of things are somewhat useful to you,
Best,
Pablo
PS: If you have any questions, please feel free to ask them here. This, thankfully, is one of the few remaining non-toxic communities I know .
2 Likes
Thanks a lot @pklaschka. I will look at the thread you just shared. I already played a round a little bit but when I attempt to log the selected item in the console to see what I can access, I can’t see the entire thing for example I cannot loop over the selected item properties since it is an object.
1 Like
You might want to check out @cpryland’s (or EM Software’s) Layers 4 Developers to interactively see the accessible members of SceneNode
s .
cf. Please give new panel plugin "Layers for Developers" a whirl
2 Likes