【HarmonyOS】【DevEco Studio】NOTE04：How to Jump to a Page(页面间的跳转)

页面创建与基本设置

创建页面

创建两个新页面，分别为AbilityPage1、AbilityPage2

设置页面基本内容

以AbilityPage1为例

导包

import com.example.myapplication.ResourceTable;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;

继承

package com.example.myapplication.slice;
import com.example.myapplication.ResourceTable;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
public class AbilityPage1 extends AbilitySlice{

}

回调函数

按下Ctrl+O

设置UI

创建UI.xml

    @Override
    protected void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_ability_page1);
    }

由于现在还没有对应文件，所以会报错，我们现在需要去写对应的xml文件

注意文件名保持一致

配置UI.xml基本内容

萌狼蓝天打算添加一个文本框

<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:height="match_parent"
    ohos:width="match_parent"
    ohos:alignment="center"
    ohos:orientation="vertical">
<!--在界面中添加一个文本框 @萌狼蓝天-->
    <Text
        ohos:id="$+id:text_Page1sText"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:background_element="$graphic:background_ability_main"
        ohos:layout_alignment="horizontal_center"
        />
</DirectionalLayout>

对上诉代码做一个解释

<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:height="match_parent"
    ohos:width="match_parent"
    ohos:alignment="center"
    ohos:orientation="vertical">
<!--在界面中添加一个文本框 @萌狼蓝天-->
    <Text
        ohos:id="$+id:text_Page1sText"     //设置ID，方便被调用
        ohos:height="match_content"
        ohos:width="match_content"  
        ohos:background_element="$graphic:background_ability_main"  // 基本背景颜色
        ohos:layout_alignment="horizontal_center"   // 布局设置 水平居中
         />
</DirectionalLayout>

现在这个界面什么也没有，接下来我要为这个界面添加一些文字

添加字符串

上面代码虽然添加了一个文本框，但是没有内容，现在，需要去设置内容

  ,
{
   "name": "mainability_page1sText",
   "value": "This is Page 1 @萌狼蓝天"
}

现在设置好了基本字符串，但是却有报错，这是因为没有设置中英文字符串。按如下步骤进行设置

在页面中引用字符串

<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:height="match_parent"
    ohos:width="match_parent"
    ohos:alignment="center"
    ohos:orientation="vertical">
<!--在界面中添加一个文本框 @萌狼蓝天-->
    <Text
        ohos:id="$+id:text_Page1sText"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:background_element="$graphic:background_ability_main"
        ohos:layout_alignment="horizontal_center"
        ohos:text="$string:mainability_page1sText"
        ohos:text_size="40vp"
        />
</DirectionalLayout>

你还可以进行以下设置

属性名称	描述	使用案例
text	显示文本	ohos:text="显示内容"
text_font	文本字体	ohos:text_font="HwChinese-medium"
text_color	文本颜色	ohos:text_color="#A8FFFFFF"
id	控件ID	ohos:id="$+id:component_id"

实现跳转

MainAbilitySlice添加跳转监听

回到MainAbilitySlice

添加findComponentByID和setClickedListener

        //使用Text需要导包 import ohos.agp.components.Text;
        Text text = (Text)findComponentById(ResourceTable.Id_text_helloworld);
        text.setClickedListener(listener->present(new AbilityPage1(),new Intent()));

使用相同方式处理另外一个界面

现在，点击文字，即可实现页面跳转