> 技术文档 > #跟着坚果学鸿蒙# 元服务应用100例——1、冥想计时器元服务

#跟着坚果学鸿蒙# 元服务应用100例——1、冥想计时器元服务


前言

本系列文章主要是为了让大家更好的了解元服务,使用大量的元服务应用给大家一个开发方向的提示,让大家在项目开发的过程中有一个思维方向的提示,元服务没有那么难,只要用心搞,大家都能成为一名比较标准的开发工程师,并且获取自己的元服务项目,如果是通过坚果派来发布还能省去很多麻烦的认证环节,很方便。

前置文章

这篇文章中包含了前置的开发工具下载以及元服务的创建,并且单独的录制了虚拟机安装以及使用的视频,可以方便大家对基础内容有一个了解:

https://harmonyosdev.csdn.net/6828289701ee522510959977.html

项目简述以及相关技术说明

该项目是一个名为“冥想计时器”的元服务,旨在提供简单的冥想计时功能,帮助用户放松身心。以下是该项目的技术实现和主要功能的详细介绍:

技术实现

  1. 界面设计 :使用HarmonyOS的ArkUI框架来实现简约的界面设计。ArkUI是一个高效的用户界面开发框架,适用于快速构建流畅和响应式的用户界面。

  2. 白噪音播放 :通过调用MediaSession接口实现白噪音的播放功能。MediaSession是HarmonyOS中用于管理音频和视频播放的高级API,可以提供丰富的媒体播放控制。

  3. 计时功能 :使用Timer组件来实现精准的计时功能。Timer组件允许开发者设置和管理定时任务,非常适合用于需要精确时间控制的应用场景。

主要功能

  1. 自定义冥想时长 :用户可以根据自己的需要,自定义冥想的时间长度。

  2. 白噪音播放 :内置多种白噪音,用户可以选择喜欢的声音类型,帮助他们在冥想过程中更好地放松和集中注意力。

  3. 简约界面 :界面设计简洁直观,易于操作,确保用户能够快速上手并专注于冥想本身。

通过这些技术和功能的结合,该冥想计时器元服务不仅能够提供一个宁静的冥想环境,还能够帮助用户更有效地管理和增强他们的冥想体验。

项目代码-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); }}

运行效果

image-20250517162204951

总结

本项目成功实现了一个功能完整、交互简洁的冥想计时器应用,特别之处在于融合了中国传统时辰文化,为用户提供独特的冥想体验。通过合理的技术选型和代码结构设计,确保了应用的性能和可维护性。未来可通过功能扩展和体验优化,进一步提升应用的价值和用户满意度。