#跟着坚果学鸿蒙# 元服务应用100例——1、冥想计时器元服务
前言
本系列文章主要是为了让大家更好的了解元服务,使用大量的元服务应用给大家一个开发方向的提示,让大家在项目开发的过程中有一个思维方向的提示,元服务没有那么难,只要用心搞,大家都能成为一名比较标准的开发工程师,并且获取自己的元服务项目,如果是通过坚果派来发布还能省去很多麻烦的认证环节,很方便。
前置文章
这篇文章中包含了前置的开发工具下载以及元服务的创建,并且单独的录制了虚拟机安装以及使用的视频,可以方便大家对基础内容有一个了解:
https://harmonyosdev.csdn.net/6828289701ee522510959977.html
项目简述以及相关技术说明
该项目是一个名为“冥想计时器”的元服务,旨在提供简单的冥想计时功能,帮助用户放松身心。以下是该项目的技术实现和主要功能的详细介绍:
技术实现
-
界面设计 :使用HarmonyOS的ArkUI框架来实现简约的界面设计。ArkUI是一个高效的用户界面开发框架,适用于快速构建流畅和响应式的用户界面。
-
白噪音播放 :通过调用MediaSession接口实现白噪音的播放功能。MediaSession是HarmonyOS中用于管理音频和视频播放的高级API,可以提供丰富的媒体播放控制。
-
计时功能 :使用Timer组件来实现精准的计时功能。Timer组件允许开发者设置和管理定时任务,非常适合用于需要精确时间控制的应用场景。
主要功能
-
自定义冥想时长 :用户可以根据自己的需要,自定义冥想的时间长度。
-
白噪音播放 :内置多种白噪音,用户可以选择喜欢的声音类型,帮助他们在冥想过程中更好地放松和集中注意力。
-
简约界面 :界面设计简洁直观,易于操作,确保用户能够快速上手并专注于冥想本身。
通过这些技术和功能的结合,该冥想计时器元服务不仅能够提供一个宁静的冥想环境,还能够帮助用户更有效地管理和增强他们的冥想体验。
项目代码-index.ets
/** * @author 坚果派·红目香薰 * @date 2025年5月10日22:05:34 */@Entry@Componentstruct Index { @State message: string = \'冥想计时器\'; @State base_time: Date = new Date(Date.now()); @State str_time: string = this.formatTime(this.base_time.getHours().toString() + \":\" + this.base_time.getMinutes() + \":\" + this.base_time.getSeconds()); @State show_change_time: string = this.getShiChen(this.base_time.getHours(), this.base_time.getMinutes()); @State isf: number = 0; @State button_status: string = \"开始冥想\"; @State timeNow :number = 0; build() { RelativeContainer() { Row() { Text(this.message) .id(\'shiChenShiKe\') .fontSize(50) .fontWeight(FontWeight.Bold) .alignRules({ center: { anchor: \'__container__\', align: VerticalAlign.Center }, middle: { anchor: \'__container__\', align: HorizontalAlign.Center } }) }.id(\'row1\').margin({ top: 50 }).justifyContent(FlexAlign.Center).width(\'100%\') Row() { Text(this.str_time).fontSize(35).fontColor(Color.Black).fontWeight(FontWeight.Bolder) } .backgroundColor(\'#66CCDD\') .id(\'row2\') .margin({ top: 150 }) .justifyContent(FlexAlign.Center) .width(\'100%\') Row() { Text(this.show_change_time).fontSize(40).fontColor(Color.Black).fontWeight(FontWeight.Bolder) } .backgroundColor(\'#66CCDD\') .id(\'row3\') .margin({ top: 250 }) .justifyContent(FlexAlign.Center) .width(\'100%\') Row() { Text(this.timeNow+\" 秒\").fontSize(40).fontColor(Color.Black).fontWeight(FontWeight.Bolder) } .backgroundColor(\'#66CCDD\') .id(\'row4\') .margin({ top: 350 }) .justifyContent(FlexAlign.Center) .width(\'100%\') Row() { Button(this.button_status) .size({ width: 250, height: 80 }) .fontSize(30) .onClick(() => { if (this.button_status == \"收功\") { clearInterval(this.isf); this.button_status = \"开始冥想\"; } else if (this.button_status == \"开始冥想\") { this.isf = setInterval(() => { this.timeNow++; }, 1000); this.button_status = \"收功\"; } }) .id(\"btn1\") .width(\'100%\') }.id(\'row5\').margin({ top: 450 }).width(\'100%\') } .height(\'100%\') .width(\'100%\') } Time_Change_Time(): string { let timeInMs = Date.now(); let dateObj = new Date(timeInMs); this.str_time = this.formatTime(dateObj.getHours() + \":\" + dateObj.getMinutes() + \":\" + dateObj.getSeconds()); return this.getShiChen(dateObj.getHours(), dateObj.getMinutes()); } formatTime(timeStr: string): string { let timeParts = timeStr.split(\':\'); let formattedParts = timeParts.map((part) => { let num = parseInt(part); return num { this.show_change_time = this.Time_Change_Time(); }, 1000); } convertToChineseTimes(hour: number): string { if (23 <= hour || hour < 1) { return \"子时\"; } else if (1 <= hour && hour < 3) { return \"丑时\"; } else if (3 <= hour && hour < 5) { return \"寅时\"; } else if (5 <= hour && hour < 7) { return \"卯时\"; } else if (7 <= hour && hour < 9) { return \"辰时\"; } else if (9 <= hour && hour < 11) { return \"巳时\"; } else if (11 <= hour && hour < 13) { return \"午时\"; } else if (13 <= hour && hour < 15) { return \"未时\"; } else if (15 <= hour && hour < 17) { return \"申时\"; } else if (17 <= hour && hour < 19) { return \"酉时\"; } else if (19 <= hour && hour < 21) { return \"戌时\"; } else { return \"亥时\"; } } convertToChineseTime(hour: number, minute: number): string { let chineseHour = this.convertToChineseTimes(hour); let minuteMark = hour % 2 !== 0 ? \"上\" : \"下\"; if (minute < 15) { minuteMark += \"一刻\"; } else if (minute < 30) { minuteMark += \"二刻\"; } else if (minute < 45) { minuteMark += \"三刻\"; } else { minuteMark += \"四刻\"; } return `${chineseHour}${minuteMark}`; } getShiChen(hour: number, minute: number): string { return this.convertToChineseTime(hour, minute); }}
运行效果
总结
本项目成功实现了一个功能完整、交互简洁的冥想计时器应用,特别之处在于融合了中国传统时辰文化,为用户提供独特的冥想体验。通过合理的技术选型和代码结构设计,确保了应用的性能和可维护性。未来可通过功能扩展和体验优化,进一步提升应用的价值和用户满意度。