【鸿蒙】大模型对话应用(三):跨Ability跳转页面

Demo介绍

本demo对接阿里云和百度的大模型API,实现一个简单的对话应用。

DecEco Studio版本:DevEco Studio 3.1.1 Release

HarmonyOS SDK版本:API9

关键点:ArkTS、ArkUI、UIAbility、网络http请求、列表布局、层叠布局

页面跳转

在前序大模型对话应用(一)(二)中完成了接口的调试和页面的构建;

想要从应用首页跳转到百度和阿里云的大大模型对话页面,可以通过 router.pushUrl 方法直接进行页面之间的跳转;

也可以通过跨Ability拉起其他Ability的方式,从EntryAbility(默认的入口Ability)中启动新的Ability;为了可以同时与两个大模型进行对话而不相互影响,本demo才用拉起新的Ability方式进行实现。

新建Ability

ets目录下新建ability,命名为 ALiYunAbility

新建成功后,会自动创建对应的目录和UIAbility(此处是ALiYunAbility);

ALiYunAbility 中 onWindowStageCreate方法是窗口页面展示时(可以简单的这么理解)会触发的系统回调函数;其中 windowStage.loadContent 会指明加载展示的具体页面。

同时src/main/module.json5 文件中,会自动生成对应ability的配置信息:

用同样的方式,可以创建百度云模型对话的Ability(BaiDuYunAbility):

添加点击事件,拉起Ability

在首页src/main/ets/pages/Index.ets 中添加两个按钮(Button组件),分别实现点击事件

@Entry
@Component
struct Index {@State message: string = 'Hello World'build() {Row() {Column({space: 20}) {Text(this.message).fontSize(50).fontWeight(FontWeight.Bold)Button('拉起文心一言').fontSize(25).onClick(() => {})Button('拉起通义千问').fontSize(25).onClick(() => {})}.width('100%')}.height('100%')}
}

复习一下拉起一个Ability的三个步骤:

  1. 获取UIAbility上下文 UIAbilityContext
  2. 构建want参数,描述跳转Ability信息
  3. 调用UIAbilityContext.startAbility(want:Want) 方法完成Ability的启动

根据上述步骤完善首页(Index.ets)按钮点击事件:

Index.ets代码:

import common from '@ohos.app.ability.common'
import Want from '@ohos.app.ability.Want'
@Entry
@Component
struct Index {private context = getContext(this) as common.UIAbilityContext@State message: string = 'Hello World'build() {Row() {Column({space: 20}) {Text(this.message).fontSize(50).fontWeight(FontWeight.Bold)Button('拉起文心一言').fontSize(25).onClick(() => {let want: Want = {deviceId: "",bundleName: "com.example.intelligenttalk",moduleName: "entry",abilityName: "BaiDuYunAbility"}this.context.startAbility(want)})Button('拉起通义千问').fontSize(25).onClick(() => {let want: Want = {deviceId: "",bundleName: "com.example.intelligenttalk",moduleName: "entry",abilityName: "ALiYunAbility"}this.context.startAbility(want)})}.width('100%')}.height('100%')}
}

页面预览效果:

Preview预览器无法实现跨Ability跳转,此处需要使用模拟器(本机/远程均可)或真机调试。

src/main/ets/pages 目录下新建一个Page(注意是新建,复制已有的ets文件不会自动生成路由配置文件),命名为ChatPageALiYun,与ChatPage区分;并将ChatPage的代码复制过来。修改一下对话框头的文本即可。

 修改两个UIAbility文件,指定加载页面

使用模拟器或真机调试

点击首页, [ 拉起文心一言 ] 按钮,页面将发生跳转,此处展示远程模拟器的页面截图效果。(本地模拟器、远程模拟器、真机设备均可达到调试效果)

点击首页, [ 拉起通义千问 ] 按钮,页面将发生跳转,此处展示远程模拟器的页面截图效果。(本地模拟器、远程模拟器、真机设备均可达到调试效果)

打开任务栏,可以看到一个应用启用了三个不同的功能界面

完成在一个Ability中启动另一个Ability的功能后,我们实现了页面的跳转;目前跳转的对话页面,展示的对话内容是固定的。

那么下一步将在跳转至对话页面后,将输入框的输入文本内容,作为调用大模型接口的参数,向大模型发起请求;将大模型接口返回的信息作为对话内容展示在页面中,完成对话效果。

相关参考文档(鸿蒙官方开发指南):文档中心

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/251252.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

excel统计分析——卡方适合性检验

参考资料:生物统计学 适合性检验是卡方检验应用的一种类型,检验实际的观测数与通过某一理论模型计算所得理论数是否相符,相当于1c列联表的卡方检验,也成为单因素离散型数据的卡方检验。 对参数的建设检验总是假定对照总体的分布数…

Linux 网络编程 + 笔记

协议:一组规则 分层模型结构: OSI七层模型:物理层、数据链路层、网络层、传输层、会话层、表示层、应用层TCP/IP 4层模型:链路层/网络接口层、网络层、传输层、应用层 应用层:http、ftp、nfs、ssh、telnet、传输层&am…

C++ 动态规划 线性DP 数字三角形

给定一个如下图所示的数字三角形,从顶部出发,在每一结点可以选择移动至其左下方的结点或移动至其右下方的结点,一直走到底层,要求找出一条路径,使路径上的数字的和最大。 73 8 8 1 02 7 4 4 4 5 2 6 5 输入格式 …

Qt/C++音视频开发66-音频变速不变调/重采样/提高音量/变速变调/倍速播放/sonic库使用

一、前言 之前在做倍速这个功能的时候,发现快速播放会有滴滴滴的破音出现,正常1倍速没有这个问题,尽管这个破音间隔很短,要放大音量才能听到,但是总归是不完美的,后面发现,通过修改qaudiooutpu…

Postman-接口测试教程

接口是软件开发中常用的概念,是软件生产过程中比较核心的任务。对于接口开发者,调试接口是一件较为繁琐的事情,很多时候需要线上线下来回切换。在这里,我就跟大家介绍一个只需要在本地就可以调试接口的方法,即使用post…

node.js与express.js创建项目以及连接数据库

搭建项目 一、技术准备 node版本:16.16.0 二、安装node成功后,安装express,命令如下: npm install -g express 或者: npm install --locationglobal express 再安装express的命令工具: npm install --location…

嵌入式学习第三篇——51单片机

目录 1,嵌入式系统 1,嵌入式系统的定义 2,单片机的定义 2,51单片机 1,开发环境 2,开发板使用的基本思路 1,查看原理图,查看芯片手册 2,获得调用硬件的管…

AI的安全应答之道

作者:统信UOS技术团队 2023,随着各种大语言模型的爆发,整个AI生态正处于从决策式AI进化到生成式AI的进程中。各类AI模型和AI应用层出不穷,也随之带来了与AI相关的各类潜在风险。AI开发和使用过程中的风险防范和治理,成为了不可忽…

SD-WAN的安全性体现在哪里?

SD-WAN技术以其高度灵活、网络自动配置和低成本等优势,将多个物理WAN链接整合为一个逻辑网络,推动网络从“连通驱动”向“服务驱动”导向的转变。同时,企业在追求高效网络时,SD-WAN的安全性也成为一个重要的考量因素。 SD-WAN采用…

OpenCV 8 - 模糊处理(均值滤波,高斯滤波,中值滤波,双边滤波)

模糊处理原理: Blur是图像处理中最简单和常用的操作之一,使用该操作的原因为了给图像预处理时候减低噪声使用,Blur操作其背后是数学的卷积计算, 通常这些卷积算子计算都是线性操作,所以又出线性虑波。 假设有6x6的图像像素点矩阵。卷积过程:6x6上面是个3x3的窗口,从左向右,…

c语言面向过程编码方式

使用模块化编程的方式实现c语言面向过程编码:将main文件,Util文件,头文件分开进行处理 c语言程序头文件 c语言头文件代码 #ifndef __Object_H_ #define __Object_H_// 这个位置编写头文件的代码 int markStudentId(int year, int classNum, …

Hive 主要内容一览

Hive架构 用户接口:Client CLI(command-line interface)、JDBC/ODBC(jdbc访问hive) 元数据:Metastore 元数据包括:表名、表所属的数据库(默认是default)、表的拥有者、列/分区字段、表的类型&am…

Vim工具使用全攻略:从入门到精通

引言 在软件开发的世界里,Vim不仅仅是一个文本编辑器,它是一个让你的编程效率倍增的神器。然而,对于新手来说,Vim的学习曲线似乎有些陡峭。本文将手把手教你如何从Vim的新手逐渐变为高手,深入理解Vim的操作模式&#…

【测试运维】性能测试笔记文档第2篇:性能测试分类和指标(已分享,附代码)

本系列文章md笔记(已分享)主要讨论性能测试相关知识。入门阶段:认识性能测试分类-(负载测试、压力测试、并发测试、稳定性测试),常用性能测试指标-(吞吐量、并发数、响应时间、点击数…),性能测试工具选择。性能脚本&a…

如何在Vue应用程序中使用Vue-Router来实现路由嵌套动画效果

Vue-Router是Vue.js官方的路由管理插件,可以帮助我们轻松管理应用程序的路由。除了基本的路由功能外,Vue-Router还允许我们在切换路由时添加动画效果,提升用户体验。本文将介绍如何使用Vue-Router来实现路由嵌套动画效果,并提供具…

Zookeeper分布式队列实战

目录 Zookeeper分布式队列 普通方式实现 设计思路 具体实现 使用Curator实现 具体实现 注意事项 Zookeeper分布式队列 常见的消息队列有:RabbitMQ,RocketMQ,Kafka等。Zookeeper作为一个分布式的小文件管理系统,同样能实现简单的队列功…

AI-数学-高中-21-三角函数-cosx的图像与性质

原作者视频:三角函数】8cosx的图像与性质(易中档)_哔哩哔哩_bilibili cosx图像:就是sinx往左平移π/2的图像。 对称中心:找到一个点,翻转180度能跟自己重合。

25考研|660/880/1000/1800全年带刷计划

作为一个参加过两次研究生考试的老学姐,我觉得考研数学的难度完全取决于你自己 我自己就是一个很好的例子 21年数学题目是公认的简单,那一年考130的很多,但是我那一年只考了87分。但是22年又都说是有史以来最难的一年,和20年的难度…

ShardingSphere 5.x 系列【1】专栏导读

有道无术,术尚可求,有术无道,止于术。 本系列Spring Boot 版本 3.1.0 本系列ShardingSphere 版本 5.4.0 源码地址:https://gitee.com/pearl-organization/study-sharding-sphere-demo 文章目录 1. 背景2. 简介3. 适用人群4. 环境…

Unity | 渡鸦避难所-9 | 角色名字及血条等信息

1 效果预览 游戏中角色的名字和血条是非常重要的元素,它们可以帮助玩家了解角色的身份和状态。在 Unity 中,可以使用 UGUI 来实现这些功能 2 实现方案 1 画布 (Canvas) 画布 (Canvas) 组件表示进行 UI 布局和渲染的抽象空间。所有 UI 元素都必须是附加…