华为云鸿蒙应用入门级开发者认证 实验部分题目及操作步骤
实验一
实验一原题部分
实验一、根据题目描述，使用 DevEco Studio 编写 ArkTS 语言程序完成如下图页面构建 (30 分)
任务 1：补全数据模型数组项（5 分）
得分点：能正确对指定类中创建对象进行构造初始化。
请使用如下配置自行创建 API 12的应用工程：
创建成功后，请打开默认生成的 Index.ets 文件，并复制如下代码。此时文件中已经创建好了 DataSources 类，请对该类使用正确的构造方法进行对象初始化。
class DataSources {id: string; // IDtitle: string; //标题brief: string; //具体描述// 请填写正确代码块：--------（1）-------
}
本任务中需注意以下内容：
（1） 使用错误的命名不得分；
（2） 使用错误的属性名不得分；
（3） 多或者少对象属性不得分。
得分条件：请填写代码后，对答案代码及上下文代码进行完整截图。
任务2：创建自定义组件，并补全代码（10分）
得分点：
1.自定义组件DataCard中数据来源应用使用任务一中创建数据源数据DataSources。
2.必须通过创建自定义组件DataCard构建页面。
定义完数据模型后，请自行分析布局并优先构建组成页面UI的自定义组件DataCard。且自定义组件DataCard中数据来源应使用任务一中创建数据源数据DataSources。
DataCard自定义组件布局如下图所示：
下文已提供自定义组件DataCard构建过程中所需具体样式属性参数。请根据这些信息构建出正确的自定义组件。
// 自定义组件构建请补全代码，填写正确装饰器及函数
___________(1)___________
__(2)__ DataCard{
// 使用@prop装饰器连接数据源DataSources
___________(3)___________
__(4)__ {Row() {Image($r('app.media.startIcon'))//系统自动提供图标.width(80).height(80).margin({ right: 20 })// 请根据提供UI页面图样式，选择正确的容器组件_____(5)_____{//Text组件参数空缺处请补全Text(___ (6) ___).fontSize(20).margin({ bottom: 8 })Text(___ (7) ___).fontSize(16).fontColor(Color.Gray).margin({ bottom: 8 })}.alignItems(HorizontalAlign.Start).width('80%').height('100%')}.padding(20).borderRadius(12).backgroundColor('#FFECECEC').height(120).width('100%').justifyContent(FlexAlign.SpaceBetween)}
}
本任务中需要注意以下内容：
（1）自定义组件声明错误不得分
（2）数据源没有使用DataSources。而是直接填写数据不得分
（3）容器组件选择错误不得分
（4）Text组件横线处填写错误不得分
得分条件：请填写代码后，对答案代码以及上下文代码进行完整截图
任务3：使用渲染控制语法，构建页面（15分）
得分点：
1、必须正确使用任务二中创建的DataCard组件
2、必须通过渲染控制语法创建页面组件DataSourcesListView
构建完成自定义组件DataCard后，请使用渲染控制语法以及子组件DataCard构建组件DataSourcesListView
如下所示，已提供自定义组件DataSourcesListView构建过程中所需具体样式属性参数，请根据这些信息构建出正确的页面。
//自定义组件构建请补全代码，填写正确装饰器以及函数
---------（1）------
---------（2）------
---（3）---DataSourcesListView {//根据DataSources数据模型构建数组DataSourcesList@State DataSourcesListL:---(5)---=[new ---(6)---('001','标题一','具体描述一'),new ---(7)---('002','标题二','具体描述二'),new ---(8)---('003','标题三','具体描述三'),new ---(9)---('004','标题四','具体描述四'),new ---(10)---('005','标题五','具体描述五')// 自定义组件构建请补全代码，填写正确装饰器及函数___(4) ________ {Column({ space: 5 }) {List() {// 使用正确的循环渲染语法以及利用自定义组件DataCard构建//注意，样式要求自定义组件之间顶部外边距距离为20__(11)________ //此处为代码块，请填写正确代码}.padding(20).scrollBar(BarState.off)}.width('100%').height('100%').backgroundColor(OxF1F3F5)]
}本任务中需注意以下内容
(1)自定义组件声明错误不得分
(2)数据源没有使用DataSources，而是直接填写数据不得分(3)没有使用循环渲染构建页面不得分
(4)自定义组件间样式书写不正确不得分得分条件:请填写代码后，对答案代码以及上下文代码进行完整截图。
实验一操作步骤
1.创建工程,项目名ArkTSExam，设备类型只选phone
2.将原来的代码折叠，下方粘入新代码
关于构造函数constructor有两种方法:
1.手敲
2.右击空白处--->Generate--->Constructor---->按住ctrl+A全选，点击ok，就会自动创建
（方法2需等待dev建立索引以后，大约20s）
class DataSources{id: string; // IDtitle: string; //标题brief: string; //具体描述//请填写正确的构造函数constructor(id: string, title: string, brief: string) {this.id = id;this.title = title;this.brief = brief;}}任务1到此结束，可以截图保存实验记录了 （注意是否需要包含左侧项目结构）
3.自定义组件DataCard
继续在下面空白处粘入代码并补全即可
@Component
struct DataCard{@Prop dataSources : DataSources;build() {Row(){Image($r('app.media.startIcon'))//系统自动提供图标.width(80).height(80).margin({ right: 20 })// 请根据提供UI页面图样式，选择正确的容器组件Column(){//Text组件参数空缺处请补全Text(this.dataSources.title).fontSize(20).margin({bottom:8})Text(this.dataSources.brief).fontSize(16).fontColor(Color.Gray).margin({ bottom: 8 })}.alignItems(HorizontalAlign.Start).width('80%').height('100%')}.padding(20).borderRadius(12).backgroundColor('#FFECECEC').height(120).width('100%').justifyContent(FlexAlign.SpaceBetween)}
}任务2到此结束，可以截图保存实验记录了（注意是否需要包含左侧项目结构）
上面这些都是在Index页面中，
截完图提交实验记录之后在class DataSources和 struct DataCard前添加export关键字
3.创建DataSourcesListView页面
导入组件DataCard和DataSources构建页面，补全代码
import {DataCard , DataSources} from './Index'
@Entry
@Component
struct DataSourcesListView{//根据DataSources数据模型构建数组DataSourcesList@State DataSourcesList:Array<DataSources>=[new DataSources('001' ,'标题一', '具体描述一'),new DataSources('002','标题二', '具体描述二'),new DataSources('003','标题三', '具体描述三'),new DataSources('004','标题四', '具体描述四'),new DataSources( '005','标题五', '具体描述五')]// 自定义组件构建请补全代码，填写正确装饰器及函数build() {Column({space:5}){List(){ForEach(this.DataSourcesList,(item:DataSources)=>{ListItem(){DataCard({dataSources:item})}})}.padding(20).scrollBar(BarState.Off)}.width('100%').height('100%').backgroundColor(0xF1F3F5)}
}任务2到此结束，可以截图保存实验记录了（注意是否需要包含左侧项目结构）
最终预览效果（不需要截图，这里只是展示结果正确）
实验二
实验二原题部分
根据题目描述，使用DevEco Studio实现启动应用内的UIAbility并获取返回结果（35分）
任务1：创建UIAbility并指定启动页面
本实验包含两个UIAbility，每个UIAbility关联一张Page页面。
EntryAbility与其关联的Page页面Index.ets创建好HarmonyOS工程后默认提供
接下来，请自行创建好一个UIAbility命名为SecondAbility，再创建好一个页面名叫Second，使其成为SecondAbility的指定启动页面。
注释:该实验工程为API12的应用工程得分点:成功创建SecondAbility并指定其启动页面为Second.ets.
详细操作步骤，请务必截图。得分条件:
1、创建UlAbility步骤截图(请注意必须包含UIAbility命名截图缺失不得分。)
2、创建Second.ets页面步骤截图(请注意必须包含页面命名截图，缺失不得分。)
3、书写指定启动页面代码并截图，截图需能展示在哪个文件中书写的此段代码(请注意此处代码截图需带上左侧目录结构，缺失不得分。)
任务2：启动应用内的SecondAbility并传递参数（15分）
本实验代码中，已经将Index.ets页面的基本UI界面提前构建完毕。接下来，请补全Apply()方法，使其可以完成启动SecondAbility并传递参数的功能。最终实现如下功能效果:Index页面中存在一个文本输出框，当用户在其中输出文本，并点击提交按钮。应用会将用户所输入文本在Second页面上显示，提供Index.ets文件中部分代码如下，请将Index.ets文件代码补全
//1.请填入正确导入代码
--------------（1）------------
import Prompt from '@system.prompt';
import( BusinessError } from '@kit.BasicServicesKit'
const RESULT_CODE:number=1000;@Entry
@Component
struct Index{@State newData: string=''//是否提交@State isApply: boolean = falsebuild(){Column(){//2、添加正确的事件从而完善TextInput组件，确保将用户输TextInput ({placeholder:“请输入信息”,text: this.newData})--------------(2)----------Button('提交申谓'，{type:ButtonType.Normal}).onClick(()=>{if (!this.isApply) {this.Apply()}else{Prompt.showToast({message:'信息已答复，不能重复提交'})}})}}Apply(){//3.获取上下文---------------（3）--------------//4.创建want对象，将要传递的自定义参数放入其中let wantInfo = {----(4)-----:'',//为空代表本设备----(5)-----,//应用名----(6)-----:'SecondAbility',//目标Ability----(7)-----:{----(8)-----//传递的参数}}if (this.newData != ''&& this.newData !== ''){context.startAbilityForResult(wantInfo).then((data)=>{if (data?.resultCode === RESULT_CODE) {let result = data.want?.parameters?.info}else {console.info('未能获取到返回结果')}}).catch((err:BusinessError)=>{console.info('获取返回结果失败')})this.isApply = !this.isApply}}
}得分点:成功启动应用内的SecondAbility并传递参数
得分条件:请填写代码后，对答案代码以及上下文代码进行完整截图
任务3:接收EntryAbility传递的参数(6分)
在正确的生命周期回调中接收EntryAbility在启动SecondAbility时传递过来的自定义参数(即文本输入框信息)，并将接收到的参数存入AppStorage对象中。将参数存放在AppStorage对象中后，即可在Second.ets改面中显示改文本。
请选择正确的文件中的正确的声明周期填入以下代码，并将代码补齐：
//1.请填入正确代码
//导入
------------------
//接收EntryAbility；传递过来的参数------------------
//解析参数let info = SecondAbilityInfo?.parameters?.info
//将解析好的参数信息存到AppStorage，方便在批假页面中使用
-------------------（'info',info）
得分点:成功启动接收EntryAbility传递的参数，需要选择正确的文件中的正确的生命周期回调函数中填写正确代码
得分条件:填空处代码，连带上下文进行截心用于评审得分(请注意此处代码截图需带上左侧目录结构，缺失不得分。)
实验二操作步骤
1、创建UlAbility步骤截图(请注意必须包含UIAbility命名截图缺失不得分。)
下面这张截图必须要有，完完整整
2、创建Second.ets页面步骤截图(请注意必须包含页面命名截图，缺失不得分。)
下面这张就是页面名命截图
设置 Second 页面为SecondAbility的启动页
打开SecondAbility，将Index改为Second并截图
需要将左侧目录结构也截图
将Index.ets文件代码补全
1 填空1不必手动操作，直接操作后续步骤，代码会自动导入
2 填空3的单词 common利用编辑器代码补全功能即可，但是要注意选对第几项，不要选错。
3 先在=前面添加类型 : Want 完整示例：let wantInfo: Want =...
//1.请填入正确导入代码,这一步不用操作，后面用到了会自动导入
import Prompt from '@system.prompt';
import { BusinessError } from '@kit.BasicServicesKit'
import { common, Want } from '@kit.AbilityKit';const RESULT_CODE: number = 1000;@Entry
@Component
struct Index {@State newData: string = ''//是否提交@State isApply: boolean = falsebuild() {Column() {//2、添加正确的事件从而完善TextInput组件，确保将用户输TextInput({placeholder: '请输入信息',text: this.newData}).onChange((val) => {this.newData = val})Button('提交申谓', { type: ButtonType.Normal }).onClick(() => {if (!this.isApply) {this.Apply()} else {Prompt.showToast({message: '信息已答复，不能重复提交'})}})}}Apply() {//3.获取上下文let context: common.UIAbilityContext = getContext(this) as common.UIAbilityContext//4.创建want对象，将要传递的自定义参数放入其中let wantInfo: Want = {deviceId: '', //为空代表本设备bundleName: getContext(context).applicationInfo.name, //应用名abilityName: 'SecondAbility', //目标Abilityparameters: {info: this.newData//传递的参数}}if (this.newData != '' && this.newData !== '') {context.startAbilityForResult(wantInfo).then((data) => {if (data?.resultCode === RESULT_CODE) {let result = data.want?.parameters?.info} else {console.info('未能获取到返回结果')}}).catch((err: BusinessError) => {console.info('获取返回结果失败')})this.isApply = !this.isApply}}
}记得截图
打开EntryAbility，在OnCreate中接收EntryAbility在启动SecondAbility时传递过来的自定义参数，并将接收到的参数存入AppStorage对象中
记得截图
任务4:参数在Second页面中展示。
//获取EntryAbility传递过来存储在Appstorage中的参数
let info = AppStorage.get("info") as string
@Entry
@Component
struct Second {//确保每次从EntryAbility传递过来的参数都能刷新到UI@State message: string = info;build() {Column({space:30}){Text(this.message)}.height('100%').width('100%')}
}记得截图
实验三
实验三原题部分
实验三:开发ArkTS卡片(35分)
任务1:创建ArkTS卡片(5分)
得分点:能在HarronyOs应用工程中正确创建基于ArkTS UI的服务卡片，卡片创建成功后，提供应用工程目录的截图.
本任务中需注意以下内容
（1）本考试任务需要考生自行创建一个HarmonyOS应用工程，创建应用工程时相关配置如下表：
（2）本考试任务需要考生自行创建ArkTS卡片，创建ArkTS卡片时相关配置如下表：
详细操作步骤
1、使用开发工具DevEco Studio，创建-个名为CardExam的HarmonyOs应用工程
2、CardExam应用工程创建完毕后，为该应用创建一张ArkTS卡片，卡片创建完成后，对应用的工程目录进行截图，截图内容务必包含卡片相关的文件目录(即截图示例中红框标注的卡片相关文件)，截图示例如下:
任务2:使用router事件跳转到EntryAbility(22分)
得分点:在EntryAbility.ts文件中补全onCreate()、onNewWant()、onWindowStageCreate()三个生命周期回调函数中的代码，以实现使用router事件跳转到EntryAbility，并根据传递的参数拉起指定页面。
详细操作步骤:
1、在ets\>pages日录下新建一张名为"Detail”的Page页面，将下列代码复制到新建的Detail.ets文件中，覆盖Detail:ets文件中的原有代码:
@Entry
@Component
struct Detail{@State message :string = '这是详情页'build(){Row(){Column(){Text(this.message).fontSize(50).fontWeight(FontWeight.Bold)}.width('100%')}.height('100%')}
}2.将下列代码复制到ExamCard.ets文件中，覆盖ExamCard.ets文件中的原有代码。
上面的代码不用动复制就行
3.将下列代码复制到EntryAbility.ts文件中，覆盖EntryAbility.ts文件中的原有代码，并根据注释补全缺失代码，实现在Entrybility中接收router事件并获取参数，根据传递的params不同，选择拉起不同的页面。
4.补全代码后，对补全的代码进行截图，示例如下：
任务3：通过message事件刷新卡片内容
得分点:在EntryFormAbility.ts文件中补全onFormEvent()生命周期回调函数中的代码。
详细操作步骤:
1、将下列代码复制到EntryFormAbility.ts中，覆盖EntryFormAbility.ts原有的代码，并根据注释补全缺失代码，以实现通过message事件刷新卡片的内容。
2.补全代码后，对补全的代码进行截图，截图示例如下
实验提醒
A、所有考试行为都将被记录，如有违规行为，将会取消考试资格或作废考试成绩。
B、考试过程中考试平台如有问题请单独给监考人员留言发私信
C、点击交卷后，所有配置和操作将不能再被修改，请认真检查您的实验步骤，确保无误后再提交。
D、实验考试通过后48小时，可前往个人中心-我的开发者认证查看证书编号和下载电子证书。
实验三操作步骤
任务1：创建ArkTS卡片
先创建一个工程
新建一个动态卡片
提交对应截图，截图内容务必包含卡片相关的文件目录
任务2:使用router事件跳转到EntryAbility
1、在ets\>pages日录下新建一张名为"Detail”的Page页面，将下列代码复制到新建的Detail.ets文件中，覆盖Detail:ets文件中的原有代码（直接复制粘贴即可，不需要补全）
@Entry
@Component
struct Detail{@State message :string = '这是详情页'build(){Row(){Column(){Text(this.message).fontSize(50).fontWeight(FontWeight.Bold)}.width('100%')}.height('100%')}
}将代码复制到ExamCard.ets文件中，覆盖ExamCard.ets文件中的原有代码。无需填空
//太多了，此处无需补全，省略将下列代码复制到EntryAbility.ts文件中，覆盖EntryAbility.ts文件中的原有代码，并根据注释补全缺失代码，实现在Entrybility中接收router事件并获取参数，根据传递的params不同，选择拉起不同的页面。
import { AbilityConstant, ConfigurationConstant, UIAbility, Want } from '@kit.AbilityKit';
import { hilog } from '@kit.PerformanceAnalysisKit';
import { window } from '@kit.ArkUI';const DOMAIN = 0x0000;export default class EntryAbility extends UIAbility {selectPage = ''onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): void {if (want?.parameters?.params) {let params:Record<string,Object> = JSON.parse(want.parameters.params as string)this.selectPage = params.targetPage as string}}onNewWant(want: Want, launchParam: AbilityConstant.LaunchParam): void {if (want?.parameters?.params) {let params: Record<string, Object> = JSON.parse(want.parameters.params as string)this.selectPage = params.targetPage as string}}onDestroy(): void {hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onDestroy');}onWindowStageCreate(windowStage: window.WindowStage): void {let targetPage : stringswitch (this.selectPage){case 'detail':targetPage = 'pages/Detail';break;default :targetPage = 'pages/Index';break;}windowStage.loadContent(targetPage, (err) => {if (err.code) {hilog.error(DOMAIN, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err));return;}hilog.info(DOMAIN, 'testTag', 'Succeeded in loading the content.');});}onWindowStageDestroy(): void {// Main window is destroyed, release UI related resourceshilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onWindowStageDestroy');}onForeground(): void {// Ability has brought to foregroundhilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onForeground');}onBackground(): void {// Ability has back to backgroundhilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onBackground');}
}
记得截图提交
在EntryFormAbility.ts文件中补全onFormEvent()生命周期回调函数中的代码。
将代码复制到EntryFormAbility.ts中，覆盖EntryFormAbility.ts原有的代码，并根据注释补全缺失代码，以实现通过message事件刷新卡片的内容。（直接复制然后照着补全就行）
onFormEvent(formId: string, message: string) {class FormDataClass{'refresh':string='message刷新后'}let formData = new FormDataClass()let formInfo = formBindingData.createFormBindingData(formData)formProvider.updateForm(formId,formInfo).then((data)=>{console.info('FormAbility updateForm success.'+JSON.stringify(data))}).catch((error:BusinessError)=>{console.error('FormAbility updateForm failed.'+JSON.stringify(error))})}
记得截图提交
华为云鸿蒙开发实验部分到此结束，请等待30s-1min后交卷
点个赞，谢谢~