HarmonyOS NEXT应用开发—发布图片评论

介绍

本示例将通过发布图片评论场景,介绍如何使用startAbilityForResult接口拉起相机拍照,并获取相机返回的数据。

效果图预览

使用说明

  1. 通过startAbilityForResult接口拉起相机,拍照后获取图片地址。

实现思路

  1. 创建CommentData类,实现IDataSource接口的对象,用于评论列表使用LazyForEach加载数据。源码参考CommentModel.ets。
export class CommentData extends BasicDataSource {
  // 懒加载数据
  private comments: Array<Comment> = [];

  // TODO:知识点:获取懒加载数据源的数据长度
  totalCount(): number {
    return this.comments.length;
  }

  // 获取指定数据项
  getData(index: number): Comment {
    return this.comments[index];
  }

  // TODO:知识点:存储数据到懒加载数据源中
  pushData(data: Comment): void {
    this.comments.push(data);
    AppStorage.setOrCreate('commentCount', this.totalCount());
    // 在数组头部添加数据
    this.notifyDataAdd(this.comments.length - 1);
  }
}
  1. 点击下方输入提示框,拉起评论输入弹窗。源码参考ImageCommentView.ets。
Text($r('app.string.text_input_hint'))
  ...
  .onClick(() => {
    if (this.dialogController != null) {
      // 打开评论输入弹窗
      this.dialogController.open();
    }
  })

3.在输入弹窗中,输入文字,点击相机按钮,拉起相机,拍照后获得返回的图片地址。源码参考CameraUtils.ets。

Image($r('app.media.camera'))
  ...
  .onClick(async () => {
    ...
    let image: string = await cameraCapture(getContext(this) as common.UIAbilityContext);
    ...
  })
...
export async function cameraCapture(context: common.UIAbilityContext): Promise<string> {
  let result: common.AbilityResult = await context.startAbilityForResult({
    action: Constants.ACTION_PICKER_CAMERA,
    parameters: {
      'supportMultiMode': false,
      'callBundleName': context.abilityInfo.bundleName
    }
  });
  if (result.resultCode === 0) {
    let param: Record<string, Object> | undefined = result.want?.parameters;
    if (param !== undefined) {
      let resourceUri: string = param[Constants.KEY_RESULT_PICKER_CAMERA] as string;
      return resourceUri;
    }
  }
  return "";
}

4.点击发布按钮,将评论添加到列表中。

Button($r('app.string.publish'))
  ...
  .onClick(() => {
    if (this.controller) {
      this.textInComment = this.text;
      this.imagesInComment = this.selectedImages;
      this.publish();
      this.controller.close();
      this.textInComment = "";
      this.imagesInComment = [];
    }
  })
...
publishComment(): void {
  let comment: Comment = new Comment("Kevin", this.textInComment, $r('app.media.icon'), this.imageInComment, this.getCurrentDate());
  this.commentList.pushData(comment);
}

工程结构&模块类型

imagecomment                                    // har类型
|---components
|   |---constants
|       |---Constants.ets                       // 常量类
|   |---model
|       |---CommentModel.ets                    // 评论数据类
|       |---MockCommentData.ets                 // 生成模拟数据
|   |---utils
|       |---CameraUtils.ets                     // 拉起相机工具类
|   |---view
|       |---CommentInputDialog.ets              // 输入评论弹窗
|       |---CommentItemView.ets                 // 单个评论组件
|       |---ImageCommentView.ets                // 评论列表页
|       |---ImageListView.ets                   // 评论图片List组件

模块依赖

@ohos/routermodule(动态路由)

参考资料

UIAbilityContext

为了能让大家更好的学习鸿蒙(HarmonyOS NEXT)开发技术,这边特意整理了《鸿蒙开发学习手册》(共计890页),希望对大家有所帮助:https://qr21.cn/FV7h05

《鸿蒙开发学习手册》:

如何快速入门:https://qr21.cn/FV7h05

  1. 基本概念
  2. 构建第一个ArkTS应用
  3. ……

开发基础知识:https://qr21.cn/FV7h05

  1. 应用基础知识
  2. 配置文件
  3. 应用数据管理
  4. 应用安全管理
  5. 应用隐私保护
  6. 三方应用调用管控机制
  7. 资源分类与访问
  8. 学习ArkTS语言
  9. ……

基于ArkTS 开发:https://qr21.cn/FV7h05

  1. Ability开发
  2. UI开发
  3. 公共事件与通知
  4. 窗口管理
  5. 媒体
  6. 安全
  7. 网络与链接
  8. 电话服务
  9. 数据管理
  10. 后台任务(Background Task)管理
  11. 设备管理
  12. 设备使用信息统计
  13. DFX
  14. 国际化开发
  15. 折叠屏系列
  16. ……

鸿蒙开发面试真题(含参考答案):https://qr21.cn/FV7h05

腾讯T10级高工技术,安卓全套VIP课程全网免费送:https://qr21.cn/D2k9D5

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

CSS中如何设置单行或多行内容超出后,显示省略号

1. 设置超出显示省略号 css设置超出显示省略号可分两种情况&#xff1a; 单行文本溢出显示省略号…多行文本溢出显示省略号… 但使用的核心代码是一样的&#xff1a;需要先使用 overflow:hidden;来把超出的部分隐藏&#xff0c;然后使用text-overflow:ellipsis;当文本超出时…

在react中使用tailwindcss

安装tailwind css npm i -D tailwindcssnpm:tailwindcss/postcss7-compat postcss^7 autoprefixer^9安装 CRACO 由于 Create React App 不能让您覆盖原生的 PostCSS 配置&#xff0c;所以我们还需要安装 CRACO 才能配置 Tailwind。 npm install craco/craco配置CRACO 在项目根…

贪心算法(算法竞赛、蓝桥杯)--糖果传递

1、B站视频链接&#xff1a;A31 贪心算法 P2512 [HAOI2008] 糖果传递_哔哩哔哩_bilibili 题目链接&#xff1a;[HAOI2008] 糖果传递 - 洛谷 #include <bits/stdc.h> using namespace std; const int N1000005; int n,a[N],c[N]; long long b,ans;int main(){scanf(&quo…

游戏引擎中的动画基础

一、动画技术简介 视觉残留理论 - 影像在我们的视网膜上残留1/24s。 游戏中动画面临的挑战&#xff1a; 交互&#xff1a;游戏中的玩家动画需要和场景中的物体进行交互。实时&#xff1a;最慢需要在1/30秒内算完所有的场景渲染和动画数据。&#xff08;可以用动画压缩解决&am…

【C语言初阶(五)】数组

❣博主主页: 33的博客❣ ▶文章专栏分类: C语言从入门到精通◀ &#x1f69a;我的代码仓库: 33的代码仓库&#x1f69a; 目录 1. 前言2.一维数组的概念3.一维数组的创建和初始化3.1数组的创建3.2数组的初始化3.3数组的类型 4.一维数组的使用4.1数组下标4.2数组元素打印4.4数组元…

算法——前缀和之除自身以外数组的乘积、和为K的子数组、和可被K整除的子数组、连续数组、矩阵区域和

这几道题对于我们前面讲过的一维、二维前缀和进行了运用,包含了面对特殊情况的反操作 目录 4.除自身以外数组的乘积 4.1解析 4.2题解 5.和为K的子数组 5.1解析 5.2题解 6.和可被K整除的子数组 6.1解析 6.2题解 7.连续数组 7.1题解 7.2题解 8.矩阵区域和 8.1解析 …

Ubuntu 20.04 系统如何优雅地安装NCL?

一、什么是NCL&#xff1f; NCAR Command Language&#xff08;NCL&#xff09;是由美国大气研究中心&#xff08;NCAR&#xff09;推出的一款用于科学数据计算和可视化的免费软件。 它有着非常强大的文件输入和输出功能&#xff0c;可读写netCDF-3、netCDF-4 classic、HDF4、b…

使用PWM实现呼吸灯功能

CC表示的意思位捕获比较&#xff0c;CCR表示的是捕获比较寄存器 占空比等效于PWM模拟出来的电压的多少&#xff0c;占空比越大等效出的模拟电压越趋近于高电平&#xff0c;占空比越小等效出来的模拟电压越趋近于低电平&#xff0c;分辨率表示的是占空比变化的精细程度&#xf…

MATLAB:拟合与插值

一、关于多项式的基本操作 若要求非线性方程的根&#xff0c;则采用fzero, fminbnd函数 二、多项式拟合 clc, clear x0:0.2:10; y0.25*x20*sin(x); plot(x,y,k.,MarkerSize,15) grid on; hold on [p1,s1,mu1]polyfit(x,y,3); %3阶多项式拟合 y1polyval(p1,x,s1,mu1); [p2,s…

mmz批量多页抓取数据-AES.CBC算法-爬虫

目标&#xff1a;mmz多页下载 方法&#xff1a;加一个for循环实现多页的下载 问题&#xff1a;浏览器传输服务器时对页码参数做了加密处理 解决方法&#xff1a; 1、判断加密算法模式&#xff08;mmz是AES-CBC算法&#xff09; 2、找到加密的key和iv 代码&#xff1a; i…

微信小程序开发学习笔记——3.11完成form评论案例的实现逻辑

>>跟着b站up主“咸虾米_”学习微信小程序开发中&#xff0c;把学习记录存到这方便后续查找。 课程连接&#xff1a;https://www.bilibili.com/video/BV19G4y1K74d?p25&vd_source9b149469177ab5fdc47515e14cf3cf74 一、javascript参考手册——splice https://www.…

9.用FFmpeg测试H.264文件的解码时间

1. Essence of Method 要测试对H.264文件的解码时间&#xff0c;可以使用FFmpeg进行操作。FFmpeg是一个开源的多媒体处理工具&#xff0c;可以用来处理视频和音频文件&#xff0c;包括解码H.264文件。以下是使用FFmpeg的命令行来测试解码时间的方法&#xff1a; ffmpeg -i in…

01_什么是深度学习

人工智能包含了机器学习&#xff0c;而深度学习是机器学习的一个分支。 人工智能 试图将通常由人类完成的智力任务自动化—这就是人工智能。 用硬编码的方式实现人工智能&#xff0c;这称作符号主义人工智能Symbolic AI。其中包含专家系统。 机器学习 机器学习是一种替代符…

一个接口白嫖四个AI平台, 五个翻译平台

牙叔教程 简单易懂 家人们, 我这标题起的咋样, 请在评论区打出你对标题的评价 今天我们介绍的仓库是 OneYiGitHub - snailuncle/oneyi: 一个翻译接口, 对接多个平台, one译. 完全免费开源, 没有任何限制, 这是一个翻译接口, 他支持以下平台 五个翻译平台 小牛翻译 小牛翻译开…

sparksession对象简介

什么是sparksession对象 spark2.0之后&#xff0c;sparksession对象是spark编码的统一入口对象&#xff0c;通常我们在rdd编程时&#xff0c;需要SparkContext对象作为RDD编程入口&#xff0c;但sparksession对象既可以作为RDD编程对象入口&#xff0c;在sparkcore编程中可以通…

ARP和DDOS攻击防御介绍

学习目标&#xff1a; 1. 如何利用ARP漏洞进行攻击&#xff1f; 2. 怎样有效地防御ARP攻击&#xff1f; 3. 如何应对DDOS攻击&#xff1f; ARP攻击如何产生&#xff1f; ARP如何进行有效防御&#xff1f; ARP基础工作原理&#xff1a; 交换机会根据mac地址表&#xff0c;进行转…

书客护眼落地灯销量火爆,售罄、补货、又断货、再补货!又成断货王!

今日&#xff0c;备受关注的书客Sun护眼大路灯在市场上掀起了一股抢购热潮&#xff0c;作为近年来照明领域中最大的黑马品牌&#xff0c;始终坚持并最求技术创新的书客品牌&#xff0c;在近日发布全新系列落地护眼台灯后&#xff0c;不仅备受消费者青睐&#xff0c;更是成为了新…

C#,T检验(T -Test)的算法与源代码

1 T-Test 学生t检验(英语:Students t-test)是指虚无假设成立时的任一检定统计有学生t-分布的统计假说检定,属于母数统计。学生t检验常作为检验一群来自正态分配母体的独立样本之期望值的是否为某一实数,或是二群来自正态分配母体的独立样本之期望值的差是否为某一实数。举…

ABC345(A-C)

A - Leftrightarrow(100 points) 语法题&#xff0c;输入一个字符串&#xff0c;判断是否是&#xff1a;的样式&#xff0c;输入后只需判断是第一个和最后一个字符是否分别为">"和"<",再判断中间是否都是""即可。 #include<bits/stdc…

【C语言步行梯】C语言实现三子棋游戏(含详细分析)

&#x1f3af;每日努力一点点&#xff0c;技术进步看得见 &#x1f3e0;专栏介绍&#xff1a;【C语言步行梯】专栏用于介绍C语言相关内容&#xff0c;每篇文章将通过图片代码片段网络相关题目的方式编写&#xff0c;欢迎订阅~~ 文章目录 需求分析具体实现主函数体菜单实现游戏实…