MLN development environment

Overview

Setting up development environment through the following steps:
1. Install IDEA, and hot-reload plugin;
2. Download MLN template project;
3. Download and install the hot-reload application;
4. Start to develop. 

1. Install IntelliJ IDEA

1.1 Download IDEA

  IDEA download address. Just install by default after downloading the installation package.

1.2 Install hot-reload plugin

  (i) Download LuaNative, The compressed file extension must be zip.
  (ii) Open IDEA and click Configure, then select Preferences-> Plugins-> ⚙-> Install Plugin from Disk. Find the downloaded archive and restart IDEA.

2. Download MLN template project

2.1 Clone MLN template project

git clone https://github.com/momotech/MLN_Toolkit

2.2 Open template project with IDEA

open IDEA -> find the MLNTemplate directory -> open the project(⚠️Select the MLNTemplate directory instead of directly opening the MLN_Toolkit directory)

3. Download and install Hot-Reload Application

3.1 Clone MLN client project

git clone https://github.com/momotech/MLN

3.2 Run on phone

• Android: Find the MLN-Android directory and open it in Android Studio. Click run button to install the application on your phone.
  Problems you may encounter during installation:
  (i) If you encounter an error like Error: No such property: GradleVersion for class: JetGradlePlugin, please upgrade Android Studio to version 3.5.
  (ii) If you encounter a gradle incompatibility problem, please use version 5.1.1 for gradle and version 3.4.0 for gradle plugin in the project, then click Sync Project With Gradle Files in toolbar.
• Run on iOS: Find the MLN-iOS / Example / MLN.xcworkspace directory, opening it in Xcode, running and installing on your phone.
  If you encounter problems during the installation, you can go to Demo Run to see the solution.

4. Start to development

In step 1, the LuaNative plugin is installed, and now we can officially start developing with hot-reload.

  (i) Please connect your development device to the computer via USB, open the app installed in step 3 and enter the hot-reload page in app(hot-reload page is necessary for connecting). Click the LuaNative tab in the lower left corner of IDEA, as follows.

  (ii) According to your development device system, find and select your device from the corresponding options under Devices Info. If you cannot find your phone or the connection is unsuccessful, try restarting IDEA and replugging the phone.
  (iii) In the src directory, select a lua file as the entry (the entry file must be in the src directory). For example, we can select index.lua and right-click the Make As Entry File option.
  (iv) The entry file in the "EntryFile" tab is updated to index.lua. Paste the test code below into the entry file, and click the refresh button under the "EntryFile" tab. The mobile phone will update the UI interface synchronously.

label = Label()
label:setGravity(Gravity.CENTER)
label:text("Hello MLN!")
window:addView(label)

  (v) If turning on the "Auto Sync" function, checking and updating action will be automatically done when editting the entry file. If closing, you must click the refresh button to update files from IDEA to phone.
  (vi) Modify the content in index.lua and see if it is updated in real time!

For more hot-reload issues, please go to Hot-Reload

5. MomoKit Code Tip Tool

1. In the template project of step 2, the MLNCodeHint/MomoKit directory is the code hinting toolkit.
2. Class name, method name completion
3. Intelligent completion of function parameters

Complete the auto-completion by typing `closure` with Enter

4. As MomoKit is continuously added and improved, click here to download the latest version of MomoKit, after decompression, copy the MomoKit folder to your project In the root directory, the code hint function can be used. ⚠️ If the code prompt still does not take effect, please try to restart IDEA and try again.