Hbuilder Development App step1--Environment Building, Hellomui and real machine commissioning

No1. Must build a Java environment

Requires only the most basic Java environment, that is, CMD can run Java and Javac,

The specific tutorial please Baidu, will have a very detailed tutorial, here is not the focus of introduction.

No2. Download and install Hbuilder

Please download the hbuilder:http://www.dcloud.io/here,

When the download is complete, unzip the zip package to a custom directory (Windows),

and send a shortcut to the desktop HBuilder.exe the directory.

Double-click the shortcut,

The first time to open Hbuilder need to register, also please register, a few minutes to fix,

You can see the Hbuilder main interface after you log in:

Developers who have used eclipse or myeclipse should be familiar with this interface,

Yes, Hbuilder is a two-time development IDE based on Eclipse,

So most of the eclipse operations, shortcut keys can be moved directly to use.

No3. Hbuilder Introduction

A little introduction to what Hbuilder can do:

1. Front-end development

A variety of shortcut keys, various tips, the best point is that all Html,css,js browser compatibility are prompted.

2.web Development

From Eclipse, Natural Java Web Development is not a problem.

3.app Development

This is the play, editing, online packaging, Real machine debugging, 6 of the Fly!!!

No4. Hellomui Sail 1. New Project

Click on the new mobile app in the main interface, or either by right-clicking the Project Manager interface or Ctrl+n,a new,

You will see the following interface:

(1) Fill in the application name

Project names similar to eclipse

(2) Select location

(3) Select template

Empty template version

MUI project, Automatic introduction of MUI-related files

Hello h5+ project, same as Nativejs sample app available on official website

Hello Mui, same as MUI Sample provided on official website

(4) Click Done

Choose the Hello mui template here, you can also choose the Hello h5+ template, and later develop most of the MUI project to choose this template.

2. File structure

When the new is complete, the following directory structure appears in the project manager on the left:

Do the front-end development of the students must be very familiar with it,

The main attention is Manifest.json,

Many app-related configurations: app icons, launch pages, permissions, etc. are all configured here.

End

It is that simple, now, you have finished a hellomui APP, the rest is to see the effect.

3. Real-Machine Commissioning (1) connecting the phone

Connect your phone with a data cable, not a power cord,

iOS needs to download a debug plugin that Android can debug directly,

There's absolutely no need for an extra environment, whether it's iOS or Android,

When you select an item, or open a file in any project,

Click Menu--run--Real machine run--run on XX device,

or directly ctrl+r to run directly,

Once you have modified the file, you can also ctrl+r,app it directly and restart it.

(2) connection failure

When you encounter a connection failure,

Android only need to install a mobile phone assistant, mobile phone assistant connection is successful,

For iOS please refer to the instructions.

(3) Run

Use the shortcut key "Ctrl+r" directly,

Then start enjoying the first app you've made with Hbuilder.

Well, there is time will continue to update, record learning situation, appropriate summary accumulation, one day small white will also grow into the great God, refueling!

Hbuilder Development App step1--Environment Building, Hellomui and real machine commissioning