快快速速入入门门HarmonyOS的的Java UI框框架架的的教教程程

本文档适用于HarmonyOS应用开发的初学者。编写两个简单的页面， 现在第一个页面点击按钮跳转到第二个页面。

注意：运行Hello World在创建工程时，设备类型和模板分别以Wearable和Empty Feature A bility(Java)为例，本文档也基于相同

的设备类型和模板进行说明。

编编写写第第一一个个页页面面

在Java UI框架中，提供了两种编写布局的方式：在XML中声明UI布局和在代码中创建布局。这两种方式创建出的布局没有本质

差别，为了熟悉两种方式，我们将通过XML的方式编写第一个页面，通过代码的方式编写第二个页面。

X ML编编写写页页面面

在 Proj ect”窗口，打开 entry > src > main > resources > base”，右键点击 base”文件夹，选择 New > Directory”，命名为 layo

ut”。

键点击 layout”文件夹，选择 New > File”，命名为 main_ layout.xml”。

在 layout”文件夹下可以看到新增了main_ layout.xml”文件。

打开 main_ layout.xml”文件，添加一个文本和一个按钮，示例代码如下：

xmlns:ohos="/res/ohos"

ohos:width="match_parent"

ohos:height="match_parent"

ohos:background_element="#000000">

ohos:id="$+id:text"

ohos:width="match_content"

ohos:height="match_content"

ohos:center_in_parent="true"

ohos:text="Hello World"

ohos:text_color="white"

ohos:text_size="32fp"/>

ohos:id="$+id:button"

ohos:width="match_content"

ohos:height="match_content"

ohos:text_size="19fp"

ohos:text="Next"

ohos:top_padding="8vp"

ohos:bottom_padding="8vp"

ohos:right_padding="80vp"

ohos:left_padding="80vp"

ohos:text_color="white"

ohos:background_element="$graphic:button_element"

ohos:center_in_parent="true"

ohos:align_parent_bottom="true"/>

上述按钮的背景是通过 button_element”来显示的，需要在 base” 目录下创建 graphic”文件夹，在 graphic”文件夹中新建一个 bu

tton_element.xml”文件。

button_element.xml”的示例代码如下：

xmlns:ohos="/res/ohos"

ohos:shape="oval"