Table of Contents of Series Articles
[Day 1] Introduction to OpenHarmony
Article directory
Preface
Yesterday we introduced some basic concepts. Today we will introduce ide DevEco Studio. And use
DevEco Studio 3.0 beta2 to create and run a hello world
1. Introduction to DevEco Studio
DevEco Studio is a supporting development IDE for HarmonyOS. Because HarmonyOS is developed based on OpenHarmony, OpenHarmony application development can also be carried out using DevEco Studio (supported by HarmonyOS).
The process of developing OpenHarmony applications using DevEco Studio is exactly the same as that of developing HarmonyOS. We only describe the differences between OpenHarmony application development and HarmonyOS application development.
The first is the difference in setting up a development environment: the OpenHarmony application development environment requires the OpenHarmony SDK to be installed first.
Import the OpenHarmony project: For OpenHarmony application development, you can only create a new project by importing the Sample project (standard projects can be created directly after 3.0 and above)
Debug signature configuration: OpenHarmony applications run on real devices and need to be signed. For instructions on signing OpenHarmony applications, please refer to Configuring OpenHarmony application signature information.
Running the application on a real device: You need to use the hdc tool to push the OpenHarmony hap package to the real device for installation.
We use the following diagram to understand the specific differences.
2. Configure OpenHarmony SDK
1. Prerequisites
DevEco Studio 3.0 Beta2 has been downloaded and installed, click the link to download .
When setting up the OpenHarmony application development environment, developers need to configure the corresponding SDK information in DevEco Studio.
The OpenHarmony SDK version simplifies part of the tool chain and is therefore not suitable for HarmonyOS application development.
But in fact, in 3.0 bata1 DevEco Studio, the support for OpenHarmony has been gradually increased, and the support of OpenHarmony will become better and better in the subsequent planning. The tool chain will also be more complete, so you don’t have to worry about this.
2.DevEco Studio operations and features
DevEco Studio manages the SDK and tool chain through the SDK Manager. OpenHarmony includes the following SDK packages:
The steps to configure the Sdk are relatively simple:
1. Run the installed DevEco Studio. For first time use, please select Do not import settings and click OK.
2. Enter the configuration wizard page and set up npm registry. DevEco Studio has preset the corresponding warehouse. Click Start using DevEco Studio directly to proceed to the next step.
If the Set up HTTP Proxy interface appears on the configuration wizard interface, it means that the network is restricted. Please configure the DevEco Studio agent, NPM agent, and Gradle agent according to the reference information, and then download the OpenHarmony SDK.
3. The DevEco Studio wizard guides developers to download the SDK, and the OpenHarmony SDK is downloaded by default. Download the SDK to the user directory. You can also specify the corresponding storage path. The SDK storage path does not support Chinese characters, and then click Next. There are many resources online
here . No need to describe too much, just install it according to the situation. If you encounter problems, most of them will be limited by npm. Here is the official tutorial reference information .
Features (key points)
So here we take DevEco Studio 3.0 Beta2 as an example to mainly talk about the things that other bloggers have not explained .
Chineseization:
This article is mainly explained to students who need Chineseization.
DevEco Studio 3.0 Beta2 supports the Chinese version of the interface function menu, which is displayed in English by default. If you need to enable the Chinese version, please open the Settings interface of DevEco Studio (File>Settings) and manually check "Chinese (Simplified)" in Plugins>installed plug-in, and then restart DevEco Studio to take effect
ets enhanced
Editor feature enhancement:
supports automatic association of eTS code structured views and resources.
Previewer feature enhancement:
supports eTS component preview, which requires compileSdkVersion to be 8 or above.
eTS real-time preview supports modifying properties while displaying the preview effect. There is no need to save the modification before it takes effect. It requires compileSdkVersion to be 8 or above.
This means that we can also use the eTS previewer function to view the layout effect of the application/service in real time, supporting real-time preview and dynamic preview; it also supports simultaneous preview on multiple devices to view the rendering effect of the same layout file on different devices. .
Since we do not have a development board and currently do not provide a simulator, previewer is our best way to debug and learn .
3. Create and preview Hello World
Next we create a Hello World and use the previewer to preview
1. Open DevEco Studio
2. Click create project, scroll to the end and select the last [standard] Empty Ability .
Here is the English explanation
3. Enter the project name, select Application as the type, and default to other Select
Here are some noun concepts explained here
: Project Type: the type of project, Service represents an atomized service, and Application represents a traditional application that needs to be installed. Select Application here.
Atomic service : It is a future-oriented service method provided by HarmonyOS. It has an independent entrance (users can directly trigger it by clicking) and installation-free (no explicit installation is required, it can be used after being installed by the system background). A user application form that can provide users with one or more convenient services.
For example: Traditional shopping applications, after adjusting their design according to the atomized service concept, can be implemented by multiple direct-service, installation-free atomized services, such as "product browsing", "shopping cart", "payment", etc.
4. Select index.hml in this directory
5. Click the viewer on the right to preview
The right side of 6 is shown as follows. At this point we have run a hello world.
