How to use a Figma layout in Android Studio?

Asked

Viewed 673 times

1

I have a project in Figma with some screens, for example the image below:

Tela do Figma

Figma generates the XML or SVG code of each component, such as the "screen":

<!-- layout/*.xml -->
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/editar_perf"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:clipToOutline="true"
    android:background="#FAFAFA"
 />

And for example the orange button with a pencil:

<!-- layout/*.xml -->
<View
android:id="@+id/ellipse"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_alignParentLeft="true"
android:layout_marginLeft="200dp"
android:layout_alignParentTop="true"
android:layout_marginTop="180dp"
android:background="@drawable/ellipse"
 />


<!-- drawable/ellipse.xml -->
<vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt"
android:width="48dp"
android:height="48dp"
android:viewportWidth="48"
android:viewportHeight="48"
 >

<group>

<clip-path
android:pathData="M 48 24C 48 37.2548 37.2548 48 24 48C 10.7452 48 0 37.2548 0 24C 0 10.7452 10.7452 0 24 0C 37.2548 0 48 10.7452 48 24Z"
/>

<path
android:pathData="M 0 0L 0 48L 48 48L 48 0"
android:fillColor="#FFBA31"
/>

</group>

</vector>

Do I need to put each of these snippets in each file? As in layout.xml and drawable/ellipse.xml? Is there any way to insert the screen with all components straight into an xml?

(When I use the whole screen SVG, the file is giant, and gives error if I try to use Vector Asset Studio to insert).

  • Leila vc can not generate a full screen SVG, vc have to generate small SVG for example, one for the "orange button with a pencil" other for the "switch button", another for the icone and so on.

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.