当前位置：首页 > article >正文

HarmonyOS NEXT 实战之元服务：静态案例效果---每日玩机技巧

article 2024/12/27 5:48:02

背景：

前几篇学习了元服务，后面几期就让我们开发简单的元服务吧，里面丰富的内容大家自己加，本期案例仅供参考

先上本期效果图，里面图片自行替换

在这里插入图片描述

效果图1完整代码案例如下：

Index

import { authentication } from '@kit.AccountKit';
import { BusinessError } from '@kit.BasicServicesKit';
import { hilog } from '@kit.PerformanceAnalysisKit';
import { EventExpertItem } from './EventExpertItem';

@Entry
@Component
struct Index {
  @State message: string = 'Hello World';

  build() {
    Column() {
      Text($r('app.string.EntryAbility_label')).fontSize(20).margin({ bottom: 10 })
      List({ space: 6 }) {
        ForEach(['手机拍照与摄像技巧',
          '手机系统功能技巧',
          '手机通讯与社交技巧',
          '手机安全与隐私保护技巧',
          '智能设备互联技巧',
        ], (item: string) => {
          ListItem() {
            EventExpertItem({ title: item })
          }

        })


      }

    }
    .alignItems(HorizontalAlign.Start)
    .height('100%')
    .padding(8)
    .width('100%')
    .margin({ top: 40 })
  }

  aboutToAppear() {
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onCreate');
    this.loginWithHuaweiID();
  }

  /**
   * Sample code for using HUAWEI ID to log in to atomic service.
   * According to the Atomic Service Review Guide, when a atomic service has an account system,
   * the option to log in with a HUAWEI ID must be provided.
   * The following presets the atomic service to use the HUAWEI ID silent login function.
   * To enable the atomic service to log in successfully using the HUAWEI ID, please refer
   * to the HarmonyOS HUAWEI ID Access Guide to configure the client ID and fingerprint certificate.
   */
  private loginWithHuaweiID() {
    // Create a login request and set parameters
    let loginRequest = new authentication.HuaweiIDProvider().createLoginWithHuaweiIDRequest();
    // Whether to forcibly launch the HUAWEI ID login page when the user is not logged in with the HUAWEI ID
    loginRequest.forceLogin = false;
    // Execute login request
    let controller = new authentication.AuthenticationController();
    controller.executeRequest(loginRequest).then((data) => {
      let loginWithHuaweiIDResponse = data as authentication.LoginWithHuaweiIDResponse;
      let authCode = loginWithHuaweiIDResponse.data?.authorizationCode;
      // Send authCode to the backend in exchange for unionID, session

    }).catch((error: BusinessError) => {
      hilog.error(0x0000, 'testTag', 'error: %{public}s', JSON.stringify(error));
      if (error.code == authentication.AuthenticationErrorCode.ACCOUNT_NOT_LOGGED_IN) {
        // HUAWEI ID is not logged in, it is recommended to jump to the login guide page

      }
    });
  }
}

ExpertItem


@Extend(Text)
function textExtend(fontSize: number, fontColor: ResourceColor) {
  .fontSize(fontSize)
  .fontColor(fontColor)
  .maxLines(2)
  .textOverflow({ overflow: TextOverflow.Ellipsis })
}

@ComponentV2
export struct EventExpertItem {
  @Param title: string = ''

  build() {
    Column({ space: 8 }) {
      Text(this.title)
        .textExtend(16, '#222222')

      Text(this.getData())
        .fontSize(11)
        .fontColor('#505050')
        .textOverflow({ overflow: TextOverflow.Ellipsis })

      Row() {
        Text(generateRandomDate()).textExtend(11, '#505050')
        Row({ space: 10 }) {
          Text('阅读量：').textExtend(11, '#505050')
          Text(generateFiveCharacterRandomString())
            .textExtend(11, Color.White)
            .backgroundColor(Color.Blue)
            .borderRadius({ topLeft: 4, bottomRight: 4 })
            .padding({
              top: 1,
              bottom: 1,
              left: 4,
              right: 4
            })
        }

      }.width('100%').margin({ top: 8 }).justifyContent(FlexAlign.SpaceBetween)

    }
    .width('100%')
    .backgroundImage($r('app.media.bg_event_expert_view_item'))
    .backgroundImageSize(ImageSize.Cover)
    .margin({ bottom: 8 })
    .padding(12)
    .alignItems(HorizontalAlign.Start)
    .borderRadius(8)
  }

  // '手机摄影技巧',
  // '手机系统功能技巧',
  // '电脑办公技巧',
  // '电脑娱乐技巧',
  // '智能设备互联技巧',
  private getData(): string {
    if (this.title == '手机拍照与摄像技巧') {
      return '现在的手机都具备多种拍摄模式，以满足不同场景和创意需求。例如夜景模式，能够在光线较暗的环境下，人像模式则可以自动虚化背景，突出人物主体，使人物更加立体、生动'
    }
    if (this.title == '手机系统功能技巧') {
      return '掌握手机系统的快捷操作方式可以大大提高使用效率，还可以通过自定义设置，将常用功能添加到快捷面板中，方便快速操作 。'
    }
    if (this.title == '手机通讯与社交技巧') {
      return '当收到大量消息时，快速回复能提高沟通效率。一些手机支持在通知栏直接回复消息，可以设置为特殊的铃声或者震动模式，确保不错过重要信息。还可以设置消息免打扰时间，在休息或者工作时避免被不必要的消息打扰。'
    }
    if (this.title == '手机安全与隐私保护技巧') {
      return '部分手机提供隐私模式，在这个模式下，可以隐藏特定的应用、照片、文件等内容。没有解密密钥也无法查看内容。在手机设置的安全与隐私选项中，通常可以找到这些功能的设置入口。'
    }
    if (this.title == '智能设备互联技巧') {
      return '手机与电脑互联：实现手机与电脑的互联互通，可以方便地传输文件、同步数据等。，如华为的 Hisuite、小米的 Mi Assistant 等，可实现更全面的设备管理和数据同步功能.'
    }
    return ''
  }
}


function generateRandomDate(): string {
  const minYear = 2024; // 最小年份
  const maxYear = 2024; // 最大年份
  const minMonth = 1; // 最小月份
  const maxMonth = 12; // 最大月份
  const minDay = 1; // 最小日期
  const maxDay = 31; // 最大日期

  // 生成随机年份
  const year = Math.floor(Math.random() * (maxYear - minYear + 1)) + minYear;

  // 生成随机月份
  const month = Math.floor(Math.random() * (maxMonth - minMonth + 1)) + minMonth;

  // 根据月份生成合理的日期
  let day = 0;
  if ([1, 3, 5, 7, 8, 10, 12].includes(month)) {
    day = Math.floor(Math.random() * (31 - minDay + 1)) + minDay;
  } else if ([4, 6, 9, 11].includes(month)) {
    day = Math.floor(Math.random() * (30 - minDay + 1)) + minDay;
  } else if (month === 2) {
    // 处理闰年
    if ((year % 4 === 0 && year % 100 !== 0) || year % 400 === 0) {
      day = Math.floor(Math.random() * (29 - minDay + 1)) + minDay;
    } else {
      day = Math.floor(Math.random() * (28 - minDay + 1)) + minDay;
    }
  }

  // 返回格式化的日期字符串
  return `${year}-${String(month).padStart(2, '0')}-${String(day).padStart(2, '0')}`;
}

function generateFiveCharacterRandomString(): string {
  const characters = '一二三四五六七八九十';
  let result = '';
  for (let i = 0; i < 5; i++) {
    result += characters.charAt(Math.floor(Math.random() * characters.length));
  }
  return result;
}