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
  • Text Design to Code
  • Generated iOS/Android Code of Texts

Was this helpful?

  1. WORKING WITH MONDAY HERO
  2. Automatically Generated Components

Texts

Monday Hero can automatically understand the texts, and convert design to Swift/Kotlin code.

PreviousViewsNextImages

Last updated 4 years ago

Was this helpful?

Text Design to Code

Texts are automatically detected and their code is generated by Monday Hero. With texts, you can describe an interface element or provide messages. Texts display static text with no editing features. A Simple label image is and its code is shown below.

Generated iOS/Android Code of Texts

Label

Texts are called as Label in the Swift language. Let's see the generated code and its attributes.

//HomePageViewController.swift 
import UIKit

class HomePageViewController: UIViewController {

//Connection from an Interface Builder to a UI component
@IBOutlet private weak var simpleExampleLabel: UILabel!

	override func viewDidLoad() {
		super.viewDidLoad()
		setupViews()
	}

}

extension HomePageViewController {
	private func setupViews() {
	
		//Text properties
		simpleExampleLabel.text = NSLocalizedString("simple.example", comment: "")
		simpleExampleLabel.textColor = UIColor.black
		simpleExampleLabel.numberOfLines = 0
		simpleExampleLabel.font = UIFont.textStyle10
		simpleExampleLabel.textAlignment = .center
		
}

TextView

Texts are called as TextView in the Android Kotlin/Java XML. Let's see the already generated code and its attributes.

<!--activityExample.xml-->

	<TextView
	android:id="@+id/titleTextView"
	android:layout_width="0dp"
	android:layout_height="wrap_content"
	android:text="@string/title_text"
	style="@style/textStyle13"
	android:textAlignment="center"
	android:textColor="?attr/black"
	android:layout_marginStart="39dp"
	android:layout_marginEnd="39dp"
	android:layout_marginBottom="12dp"
	app:layout_constraintStart_toStartOf="parent"
	app:layout_constraintEnd_toEndOf="parent"
	app:layout_constraintTop_toBottomOf="@+id/mondayHeroLogoImageView"
	app:layout_constraintBottom_toTopOf="@+id/descriptionTextView"/>
	
<!--strings.xml-->
<string name="title_text">"SimpleText"</string>
<string name="description_text">"This is a textView example and textViews are better while it kept short and legible."</string>
A label example.