unity-figma-importer's Introduction

Unity Figma Importer

Transforming your Figma designs seamlessly into Unity UI elements is a breeze with the Unity Figma Importer. This powerful tool not only bridges the gap between design and development but also effortlessly binds codes with the layout files, empowering you to swiftly craft stunning Unity apps with precision and ease.

For enhanced functionality and seamless integration with Unity, it is recommended to use the Unity Figma Importer plugin with Figma app alongside this package.

Installation

Installing Unity Figma Importer Package

Open Package Manager in Unity
Press "+" and "Add package from git URL..."
Enter this repository and version as https://github.com/cdmvision/unity-figma-importer.git#1.9.0 (see latest version here)

Unity Figma Importer - UGUI

https://github.com/cdmvision/unity-figma-importer.git#1.9.0-ugui (see latest version here)

Supported UI systems

Unity UI (UGUI)
UI Toolkit

Supported Figma Nodes

Page
Frame
Group
Instance
Component (as Instance)
Component Set (as Instance)
Text
Vector
Rectangle
Polygon
Star
Line
Ellipse
Boolean

Contribution

Unity Figma Importer is a fully open-source project, and we welcome contributions. Information on how to get started can be found in our contributor guide.

unity-figma-importer's People

Contributors

Stargazers

Watchers

unity-figma-importer's Issues

Customizable effect style converter

Dynamic grid layout with flexible cell size

Dynamic grid layout with flexible cell size should be implemented.

Allow adding multiple effects on the same node

Allow binding nodes with type of `GameObject` in addition to the `UnityEngine.Component`

Additional Unity Editor search functions

In addition to the page search window; these filters could be nice to have:

Search node by id
Search node by name
Search node by binding key

Importing the override colors of the instance swap

For example, when an icon is used for instance swap in a component set variant, it is imported with the actual icon component color. It should be the color that in the component set variant.

`FigmaNodeAttribute` does not work on `FigmaPage`

Stack overflow happens while importing if the same binding key is used on different classes.

Editor-prev.log

Importing image respecting its scale mode

Fill
Fit
Tile
Stretch

Json deserialization bug when deserializing empty boolean operation nodes.

Empty boolean operation node has null transform and bounds.

Add importer option to set GameObject layer

Inherited private members don't get bound

Blend modes

How to implement blend modes?

Min-max texture size option

Add option to not mark Font as dependency asset to prevent reimporting (e.g. dynamic font)

Importing blur effect

Background blur
Layer blur

Take scale factor into account while calculating the Sprite's borders.

Auto resizing text regarding to auto-width, auto-height and fixed-size properties

BUG: Assertion failed on expression: 'processed == fileSize'

Came across during download time. Reason: Unknown, sometimes it causes download process to get stuck. There is no stack trace.

Dropdown Converter Caption Image Binding is missing

ContentItemImage binding is available but there is no binding for Caption Image (to bind to Caption Image property in Unity's Dropdown component)

Migrate new component property api

Should we change `isRequired` to `optional`?

Binding with FigmaNodeAttribute, FigmaResourceAttribute and FigmaLocalizeAttribute, most of time we use isRequired = true. So what if we change isRequired to optional, and set its default value as optional = false? In this way, we dont need to write isRequired frequently.

@gunseliozkan ?

Figma design needs to be reimported after initial Unity project importing

Add an option to download specific version of the figma document

Attached node could not be pinged by clicking log entry

Add `ResourceAttribute` for binding asset from Resource folder

It might be useful to bind asset with specified path from the Resource folder to access external assets.

Binding key problem when parent figma node has more than one component of same type as child

Example:

First of all,
"Scrollview" component must have "Content" binding key to convert figma node to a Scrollview component.

Let's say Parent Frame has two scrollviews (as child in hierarchy) for two different jobs: JobA and JobB, each of them has Content binding key because they MUST have it in order to be a scrollview. While binding Parent Frame and assigning mono behavior to it, say we have a figma node with binding key "Content" and it is associated with JobA. Now, if JobB (scrollview figma node) is higher than JobA (scrollview figma node) in hierarchy, the Content of Parent Frame will be bound to JobB's Content.

How should we prevent that?

Importing image referenced in nodes

Custom localization converter option

Importing mask (not frame's clip content)

Figma masks nodes that are siblings of the mask node:

Unity masks game objects that are children of the mask node:

Fails to import sprites properly if the Editor runs as batchmode while building for iOS (Unity Cloud Build)

We need to test building for iOS on a local mac with batchmode enabled:

https://support.unity.com/hc/en-us/articles/9466056266004-How-do-I-Build-Unity-Project-in-Batchmode-Locally-

Option to have generating page prefabs while importing the figma file

Importing images as fill color on the same node

All images on the same node should be imported as well as other fills.

New personal access token migration (scopes)

https://www.figma.com/developers/api#dev-resources

Text Truncate Options: Wrap when height is available?

Should we truncate text if height is available for word wrapping?

Figma document is giving error to right click in editor

Add stroke multiplier import settings

Bug when importing components with layout properties

While importing components with layout element component, rect transform's parameters is set to NaN.
Tried detaching the problematic component and then importing the node, it imports as it supposed to.

Specifying `LocalizedString` as attribute to bind automatically

Import fails if `FigmaNodeAttribute` added on a member and not `SerializedField`

Content size fitter on text elements cause positioning-sizing problems

Import multicolor text characters

Figma returns colors for each characters in the text component if it has multiple color. So we can import them.

{
  "id": "86:14",
  "name": "Roboto Black Italic",
  "type": "TEXT",
  "scrollBehavior": "SCROLLS",
  "blendMode": "PASS_THROUGH",
  "absoluteBoundingBox": {
    "x": 563,
    "y": 464,
    "width": 140,
    "height": 28
  },
  "absoluteRenderBounds": {
    "x": 563.03515625,
    "y": 467.98828125,
    "width": 140.94140625,
    "height": 18.29296875
  },
  "constraints": {
    "vertical": "TOP",
    "horizontal": "LEFT"
  },
  "fills": [
    {
      "blendMode": "NORMAL",
      "type": "SOLID",
      "color": {
        "r": 0,
        "g": 0,
        "b": 0,
        "a": 1
      }
    }
  ],
  "strokes": [],
  "strokeWeight": 1,
  "strokeAlign": "OUTSIDE",
  "effects": [],
  "characters": "Roboto Black",
  "style": {
    "fontFamily": "Roboto",
    "fontPostScriptName": "Roboto-BlackItalic",
    "italic": true,
    "fontWeight": 900,
    "textAutoResize": "WIDTH_AND_HEIGHT",
    "fontSize": 24,
    "textAlignHorizontal": "LEFT",
    "textAlignVertical": "TOP",
    "letterSpacing": 0,
    "lineHeightPx": 28.125,
    "lineHeightPercent": 100,
    "lineHeightUnit": "INTRINSIC_%"
  },
  "layoutVersion": 3,
  "characterStyleOverrides": [
    68,
    68,
    68,
    68,
    68,
    68,
    68,
    40,
    40,
    40,
    40,
    40
  ],
  "styleOverrideTable": {
    "40": {
      "fills": [
        {
          "blendMode": "NORMAL",
          "type": "SOLID",
          "color": {
            "r": 0,
            "g": 0,
            "b": 0,
            "a": 1
          }
        },
        {
          "blendMode": "NORMAL",
          "type": "SOLID",
          "color": {
            "r": 1,
            "g": 0,
            "b": 0,
            "a": 1
          }
        }
      ]
    },
    "68": {
      "fills": [
        {
          "blendMode": "NORMAL",
          "type": "SOLID",
          "color": {
            "r": 0,
            "g": 0.039999961853027344,
            "b": 1,
            "a": 1
          }
        }
      ]
    }
  },
  "lineTypes": [
    "NONE"
  ],
  "lineIndentations": [
    0
  ]
}

cdmvision / unity-figma-importer Goto Github PK