HarmonyOS实战—页面跳转

简介: HarmonyOS实战—页面跳转
  • 实现步骤:

①:编写第一个页面(文本+按钮) xml编写
②:编写第二个页面(文本) java 编写
③:给按钮添加一个跳转

  • 设计思路:

第一步:在第一个界面中把HelloWorld改写为第一个界面,并添加一个按钮。
第二步:写第二个界面
第三步:书写跳转关系

  • 鸿蒙UI中,提供了两种编写布局的方式:
  1. 在XML中声明UI布局
  2. 在代码中创建布局
  • 这两种方式创建出的布局没有本质差别,但是XML方式较为方便简单,以后开发中,也都是用XML布局的方式。
  • 但是这两种方式都需要我们熟悉。所以,所以我们将通过XML的方式布局第一张页面,然后再通过代码的方式布局第二张页面。

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

1. 第一个页面布局(xml编写)

  1. 打开layout下面的“ability_main.xml”文件
  2. 在“ability_main.xml”文件中创建一个文本Text和一个按钮Button
  • xml 编写
  • match-context 相当于 安卓中的 wrap_content
<?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_helloworld"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:background_element="$graphic:background_ability_main"
        ohos:layout_alignment="horizontal_center"
        ohos:text="第一个页面"
        ohos:text_size="40vp"
        />
   <Button
       ohos:id="$+id:but1"
       ohos:height="match_content"
       ohos:width="match_content"
       ohos:background_element="red"
       ohos:text_size="40fp"
       ohos:text="点我">
   </Button>

</DirectionalLayout>

在这里插入图片描述

2. 第二个页面布局(java编写)

  • java 代码编写
  • 创建 :

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

  • 删除 layout 下的ability_second.xml
  • 注释掉报错的这段:

在这里插入图片描述

  • DirectionalLayout 布局,是从上往下的排列

在这里插入图片描述

SecondAbilitySlice

public class SecondAbilitySlice extends AbilitySlice {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        //super.setUIContent(ResourceTable.Layout_ability_second);

        // 1. 创建布局对象
        DirectionalLayout d1 = new DirectionalLayout(this);

        //2. 创建文本对象
        Text t = new Text(this);
        //设置内容
        t.setText("第二个页面");
        //设置文字大小
        t.setTextSize(55);
        //设置文字颜色
        t.setTextColor(Color.BLUE);

        //3.把文本对象添加到布局中
        d1.addComponent(t);

        //4.把布局添加到子界面当中
        super.setUIContent(d1);
    }

3. 页面跳转实现

MainAbilitySlice

public class MainAbilitySlice extends AbilitySlice implements Component.ClickedListener {
    Button but;
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_ability_main);

        //1. 找到按钮 id
        but = (Button) findComponentById(ResourceTable.Id_but1);
        //2.给按钮添加点击事件
        //如果没有添加点击事件,那么用鼠标点击按钮是没有任何反应
        //如果添加了点击事件,鼠标点击之后就可以执行对应的代码了
        //
        but.setClickedListener(this);
    }

    @Override
    public void onActive() {
        super.onActive();
    }

    @Override
    public void onForeground(Intent intent) {
        super.onForeground(intent);
    }

    @Override
    public void onClick(Component component) {
        //点击按钮只要执行的代码
        //跳转到第二个页面
        if (component == but ){
            //只有点击个按钮,才能跳转

            //跳转到哪个页面中(意图)
            Intent i = new Intent();
            //包含了页面跳转的信息
            Operation operation = new Intent.OperationBuilder()
                    //要跳转到哪个设备上,如果传递一个空的内容,表示跳转到本机
                    .withDeviceId("")
                    //要跳转到哪个应用上,小括号里面可以写包名
                    .withBundleName("com.example.myapplication")
                    //要跳转的页面
                    .withAbilityName("com.example.myapplication.SecondAbility")
                    //表示将上面的三个信息进行打包
                    .build();
                    //把打包之后的operation设置到意图当中
            i.setOperation(operation);
            //跳转页面
            startAbility(i);
        }
    }
}

在这里插入图片描述

  • 点击后跳转到第二个页面

在这里插入图片描述

目录
相关文章
|
2月前
|
存储 Java 数据管理
HarmonyOS实战—HarmonyOS入门第一课
HarmonyOS实战—HarmonyOS入门第一课
31 0
HarmonyOS实战—HarmonyOS入门第一课
|
3月前
|
存储 监控 安全
HarmonyOS 实战项目
本章将介绍如何在 HarmonyOS 上进行实际项目开发。我们将从项目需求分析开始,逐步完成项目的设计、开发、测试和上线过程。
43 1
|
6月前
|
缓存 自然语言处理 JavaScript
HarmonyOS实战—服务卡片初体验
最近看到很多博客网站上出现了HarmonyOS的征文活动,看到那些精美的奖品让我也安耐不住开了,当然奖品的诱惑当然是抵挡不住我对技术的狂热追求,对于开发者而言技术没有顶峰没有终点。那么今天给大家做一个卡片服务开发的经验分享,如果有什么地方说的不对的请各位开发者进行指正,如果有什么问题也可以发私信或者直接在帖子中留言,我也会及时回复大家。
|
6月前
|
XML Java 数据格式
HarmonyOS学习路之开发基础——快速入门(创建另一个页面)
在上一节中,我们用XML的方式编写了一个包含文本和按钮的页面。为了帮助开发者熟悉在代码中创建布局的方式,接下来我们使用代码的方式编写第二个页面。
|
6月前
|
XML Java 数据格式
HarmonyOS学习路之开发基础——快速入门(编写第一个页面)
在Java UI框架中,提供了两种编写布局的方式:在XML中声明UI布局和在代码中创建布局。这两种方式创建出的布局没有本质差别,为了熟悉两种方式,我们将通过XML的方式编写第一个页面,通过代码的方式编写第二个页面。
|
8月前
|
缓存 搜索推荐 Java
HarmonyOS实战—亮眼的原子化服务体验
HarmonyOS实战—亮眼的原子化服务体验
|
8月前
HarmonyOS ArkTS Ability内页面的跳转和数据传递
HarmonyOS ArkTS Ability 的数据传递包括有 Ability 内页面的跳转和数据传递、Ability 间的数据跳转和数据传递。本节主要讲解 Ability 内页面的跳转和数据传递。 打开 DevEco Studio,选择一个 Empty Ability 工程模板,创建一个名为 “ArkUIPagesRouter” 的工程为演示示例。
202 1
|
XML Java 数据格式
HarmonyOS实战—可编辑的卡片交互
HarmonyOS实战—可编辑的卡片交互
175 0
HarmonyOS实战—可编辑的卡片交互
|
JavaScript Java
HarmonyOS实战—欧洲杯还可以这么玩?(二)
HarmonyOS实战—欧洲杯还可以这么玩?(二)
101 0
|
JavaScript Java
HarmonyOS实战—欧洲杯还可以这么玩?(一)
HarmonyOS实战—欧洲杯还可以这么玩?(一)
132 0
HarmonyOS实战—欧洲杯还可以这么玩?(一)

相关产品

  • 云迁移中心