Dropdown
Last updated
Was this helpful?
Last updated
Was this helpful?
In order for a Dropdown from Figma to be imported to Unity automatically, certain rules apply when designing a Dropdown in Figma.
In order for Figma Importer to understand which component it is trying to convert a figma node to a Unity UI element, Component Type from Unity Importer plugin must be selected as desired component type. "Dropdown" component type should be selected when designing a Dropdown.
In order for importer to convert a Dropdown component from Figma to Unity's built in Dropdown component, a predefined hierarchy should be applied to have expected behavior.
Keeping in mind the built in Dropdown hierarchy, design of a Dropdown component in Figma should look like:
Notice that the child object "Item" of the "Content" component in Unity built in Dropdown is moved to upper level in the hierarchy as "Dropdown Item" in the example design. Dropdown Item will be explained in the next section.
Dropdown item must be designed as a toggle, it represents each item in the dropdown list. For more information, please visit Toggle documentation.
Dropdowns must have Scroll View. For more information, please visit Scroll View documentation.
In order to apply UI transitions to an interaction with a Dropdown (hover, press etc.) Dropdown may have a Selectable type of instance in it. Selectables are designed the same way as Buttons, just select the Component Type in Unity Importer as "Selectable". For more information, please visit Button documentation.
Unity's Dropdown component needs to have "Template", "Caption Text", "Item Text" set to behave as expected.
In order for importer to set these, binding keys should be set using Unity Importer plugin in Figma.
There is an additional must have key binding in order for Unity Figma Importer to behave as expected with Dropdown instances.