Monday Hero
Website
V1
V1
  • Overview
  • Workflow Basics
  • Getting Started
    • Installation
    • Login & Create a Project
    • Roles & Manage the Project Team
    • Prepare Design To Get Best Results
    • Import Design File Into Monday Hero
  • WORKING WITH MONDAY HERO
    • Automatically Generated Components
      • Views
      • Texts
      • Images
    • Convert to Components
      • How to Convert to Components
      • Convert to Button
      • Convert to TextField/EditText
      • Convert to Text Area
      • Convert to Status Bar
      • Convert to Search Bar
      • Convert to Lists and Grids
        • Convert to List
        • Convert to Grid
    • Export Code
      • Export All Screens as a New Project
      • Export Only Selected Screen as a New Project
      • Export Only Selected Screen Into an Existing Project
    • 🚧 Configure Code Preferences (WIP)
  • Step-By-Step Tutorials
    • 🏖️Travel App
  • Reach Us
    • Get Support
    • Get Demo
  • Join & Follow Us
    • Slack Community
    • GitHub
    • Twitter
    • LinkedIn
    • Blog
    • Instagram
    • Facebook
    • YouTube
Powered by GitBook
On this page
  • Export Code and Support Native iOS/Android
  • Download Code & Assets
  • Example of an Exported Project and Generated iOS/Android Code

Was this helpful?

  1. WORKING WITH MONDAY HERO
  2. Export Code

Export All Screens as a New Project

Convert Adobe XD/Sketch design to code, export the generated UI code as iOS/Android code, and run in both Android Studio/Xcode. Bring your idea to life in minutes.

PreviousExport CodeNextExport Only Selected Screen as a New Project

Last updated 4 years ago

Was this helpful?

Export Code and Support Native iOS/Android

Download Code & Assets

To export all of the screens in the Monday Hero project as a new Xcode/Android Studio Project, there are 3 easy steps.

  1. Click Export Icon and choose the path to export.

  2. Select As a New Project option.

  3. Click the Export button, and downloading will start.

The exporting progress bar will pop-up and a 'blink' sound will be heard when it's done. Open the directory that is exported, the project is there and ready to run.

Example of an Exported Project and Generated iOS/Android Code

Monday Hero exports an Xcode/Android Project with colors, fonts, assets, string, and layout files. Please note that there are no duplicate values in colors, fonts, and string files.

The results of the downloaded project are different for Android and iOS Projects.

Project Structure

Monday Hero downloads the project as iOS-Example.

Storyboard File The screens are downloaded as Main.storyboard file (Also it is possible to export only code, without Storyboard). Downloaded Storyboard file:

Colors The colors are downloaded as a single file and automatically named by Monday Hero in Colors.swift file. The color values are also not duplicated.

Fonts The fonts and their sizes are downloaded in one file as text styles and can be found/edited in the Fonts.swift file. The font values are also not duplicated.

Strings The strings are also exported in a single file for the whole project in Localizable.strings file.

Assets One of the most important exported files is assets. They are downloaded in 1x, 2x, and 3x densities. They are all ready to use and automatically sized. They can be found in Assets.xcassets folder.

Project Structure

Monday Hero downloads the project as AndroidExample.

Layouts The layouts are ready as can be seen below.

Colors We can see the colors in colors.xml file. These colors are named automatically by Monday Hero.

Please note that there are no duplicated values in colors, fonts, and strings.

Strings As we mentioned above, the strings are also exported. They are placed in the strings.xml file.

Fonts Also, we gather the fonts and their sizes in one place as text styles and which can be found/edited in the fonts.xml file.

Assets And the last but not least, the assets. They are all ready to use and automatically sized in the res folder. The images are downloaded in mdpi, hdpi, xhdpi, xxhdpi and xxxhdpi densities.

As can be seen above, the project is ready to run. After these steps, the development takes place out of Monday Hero. With already exported project UI as an Xcode project or Android Studio project, and it is ready for development. Now it is time to work on the backend services and configurations as planned. Happy coding!

Export as a new project with all screens in Monday Hero.
Exported iOS Project.
Downloaded Storyboard file for entire project.
Colors.swift file.
Fonts.swift file.
Localizable.strings file.
Asset folder and files in an exported project.
Exported Android Project.
List page layout of Travel App in Android Studio.
Downloaded Colors in colors.xml
Downloaded Strings in strings.xml file
Downloaded Text Styles in fonts.xml
Asset folder and files in an exported project.