自学记录HarmonyOS Next Image API 13:图像处理与传输的开发实践

简介: 在完成数字版权管理(DRM)项目后,我决定挑战HarmonyOS Next的图像处理功能,学习Image API和SendableImage API。这两个API支持图像加载、编辑、存储及跨设备发送共享。我计划开发一个简单的图像编辑与发送工具,实现图像裁剪、缩放及跨设备共享功能。通过研究,我深刻体会到HarmonyOS的强大设计,未来这些功能可应用于照片编辑、媒体共享等场景。如果你对图像处理感兴趣,不妨一起探索更多高级特性,共同进步。

在完成了数字版权管理(DRM)的项目后,我对HarmonyOS Next的API设计和功能深度有了更多的信心。这次,我决定挑战图像处理相关的功能,学习一下Image API和SendableImage API。当然依然是最新的API 13。

这两个API提供了处理和发送图像的强大能力,支持图像的加载、编辑、存储以及通过跨设备发送共享。我决定实现一个简单的图像编辑与发送工具,包括图像的裁剪、缩放以及通过SendableImage在设备之间共享的功能。


第一步:理解Image API和SendableImage API

Image API

Image API 主要用于图像的加载、编辑和格式转换。它允许开发者对图像进行操作,例如:

  • 裁剪
  • 缩放
  • 转换为不同格式(如PNG、JPEG等)


SendableImage API

SendableImage API 是为图像的跨设备传输设计的。它支持:

  • 将图像数据打包成可发送的格式
  • 通过鸿蒙的跨设备能力进行图像共享

结合这两个API,我计划开发一个包含图像编辑和发送功能的应用。


第二步:项目初始化与配置

在HarmonyOS Next中,确保应用拥有所需权限。

配置权限

在config.json中添加以下内容:

{
  "module": {
    "abilities": [
      {
        "name": "ImageAppAbility",
        "permissions": [
          "ohos.permission.READ_MEDIA",
          "ohos.permission.WRITE_MEDIA",
          "ohos.permission.DISTRIBUTED_DATASYNC"
        ]
      }
    ]
  }
}


第三步:图像加载与编辑

图像加载

首先,通过Image API加载图像。

import image from '@ohos.image';
async function loadImage(filePath: string) {
    try {
        const img = await image.createImageSource(filePath);
        console.info('图像加载成功:', filePath);
        return img;
    } catch (error) {
        console.error('图像加载失败:', error);
    }
}

图像裁剪与缩放

使用Image API对图像进行裁剪和缩放:

async function editImage(imgSource, cropRect, scaleFactor) {
    try {
        const croppedImg = await imgSource.crop(cropRect);
        console.info('图像裁剪成功');
        const scaledImg = await croppedImg.scale(scaleFactor);
        console.info('图像缩放成功');
        return scaledImg;
    } catch (error) {
        console.error('图像编辑失败:', error);
    }
}


第四步:图像保存

编辑完成的图像可以通过Image API保存为指定格式。

async function saveImage(imgSource, outputPath: string, format: string) {
    try {
        await imgSource.save(outputPath, format);
        console.info('图像保存成功:', outputPath);
    } catch (error) {
        console.error('图像保存失败:', error);
    }
}


第五步:通过SendableImage API实现图像发送

创建可发送图像

通过SendableImage API将图像包装成可发送格式。

import sendableImage from '@ohos.sendableimage';
async function createSendableImage(filePath: string) {
    try {
        const sendableImg = await sendableImage.createSendableImage(filePath);
        console.info('SendableImage创建成功');
        return sendableImg;
    } catch (error) {
        console.error('SendableImage创建失败:', error);
    }
}

跨设备发送图像

利用鸿蒙分布式能力将图像发送到其他设备。

async function sendImage(sendableImg, targetDeviceId: string) {
    try {
        await sendableImg.send(targetDeviceId);
        console.info('图像发送成功');
    } catch (error) {
        console.error('图像发送失败:', error);
    }
}


第六步:构建用户界面

在HarmonyOS Next中,界面通过ArkTS和ArkUI实现。

界面布局

import { View, Text, Button, Image } from '@ohos.arkui';
export default View.create({
    build() {
        return (
            {
                type: "flex",
                flexDirection: "column",
                children: [
                    {
                        type: Text,
                        content: "图像处理与发送",
                        style: { height: "50vp", fontSize: "20vp", textAlign: "center" },
                    },
                    {
                        type: Button,
                        content: "加载图像",
                        style: { height: "50vp", marginTop: "20vp" },
                        onClick: this.onLoadImage
                    },
                    {
                        type: Button,
                        content: "编辑图像",
                        style: { height: "50vp", marginTop: "10vp" },
                        onClick: this.onEditImage
                    },
                    {
                        type: Button,
                        content: "发送图像",
                        style: { height: "50vp", marginTop: "10vp" },
                        onClick: this.onSendImage
                    }
                ]
            }
        );
    },
    async onLoadImage() {
        const filePath = '/data/media/sample.jpg';
        this.imgSource = await loadImage(filePath);
    },
    async onEditImage() {
        const cropRect = { x: 10, y: 10, width: 100, height: 100 };
        const scaleFactor = 2.0;
        this.editedImage = await editImage(this.imgSource, cropRect, scaleFactor);
        await saveImage(this.editedImage, '/data/media/edited.jpg', 'jpeg');
    },
    async onSendImage() {
        const sendableImg = await createSendableImage('/data/media/edited.jpg');
        const targetDeviceId = 'device123';
        await sendImage(sendableImg, targetDeviceId);
    }
});


最后的小感悟

通过自己的研究,还是发现了其强大的能力。从图像加载到编辑,再到分布式传输,每一个环节都体现了HarmonyOS的设计精妙。

未来,这些功能可以广泛应用于照片编辑、媒体共享和分布式协作场景。如果你也对图像处理感兴趣,不妨从这些基础功能开始,探索更多高级特性,打造属于自己的创新应用。

当然如果你也在这一领域研究,不妨关注我,我们一起进步~!

目录
相关文章
|
29天前
|
监控 搜索推荐 API
淘宝店铺详情API接口的开发、应用与收益
淘宝开放平台提供了丰富的API接口,帮助开发者获取海量的商品和店铺数据。本文聚焦于淘宝店铺详情API接口的开发、应用及收益。首先,开发者需注册账号并创建应用以获取API密钥。接着,通过阅读接口文档,使用Python等语言编写代码调用API,处理返回的数据。该接口广泛应用于竞品分析、数据分析、价格监控、个性化推荐等领域,为开发者带来提高用户体验、降低运营成本、增加收入等多方面收益。同时,开发者需注意遵守法律法规、请求频率限制及数据安全等问题,确保合法合规地使用接口资源。
61 4
|
10天前
|
数据采集 搜索推荐 API
小红书笔记详情 API 接口的开发、应用与收益
小红书(RED)作为国内领先的生活方式分享平台,汇聚了大量用户生成内容(UGC),尤其是“种草”笔记。小红书笔记详情API接口为开发者提供了获取笔记详细信息的强大工具,包括标题、内容、图片、点赞数等。通过注册开放平台账号、申请API权限并调用接口,开发者可以构建内容分析工具、笔记推荐系统、数据爬虫等应用,提升用户体验和运营效率,创造新的商业模式。本文详细介绍API的开发流程、应用场景及潜在收益,并附上Python代码示例。
149 61
|
4天前
鸿蒙开发:了解@Builder装饰器
@Builder装饰是鸿蒙UI开发中,非常重要的一个装饰器,在实际的开发中,合理且正确的使用,能够让我们的代码更加的简洁,有两点需要注意,一是,是用私有还是全局,取决于当前的组件的复用机制,如果多个页面都使用了,建议以全局为主;二是传参的动态更新,有更新就使用引用参数传递,没有更新按值传递即可。
51 28
|
5天前
|
人工智能 Rust 安全
DeepClaude:结合 DeepSeek R1 和 Claude AI 各自优势开发的 AI 应用平台,支持 API 调用和零延迟的即时响应
DeepClaude 是一个开源的 AI 应用开发平台,结合了 DeepSeek R1 和 Claude 模型的优势,提供即时响应、端到端加密和高度可配置的功能。
162 4
DeepClaude:结合 DeepSeek R1 和 Claude AI 各自优势开发的 AI 应用平台,支持 API 调用和零延迟的即时响应
|
5天前
|
JSON 前端开发 API
以项目登录接口为例-大前端之开发postman请求接口带token的请求测试-前端开发必学之一-如果要学会联调接口而不是纯写静态前端页面-这个是必学-本文以优雅草蜻蜓Q系统API为实践来演示我们如何带token请求接口-优雅草卓伊凡
以项目登录接口为例-大前端之开发postman请求接口带token的请求测试-前端开发必学之一-如果要学会联调接口而不是纯写静态前端页面-这个是必学-本文以优雅草蜻蜓Q系统API为实践来演示我们如何带token请求接口-优雅草卓伊凡
29 5
以项目登录接口为例-大前端之开发postman请求接口带token的请求测试-前端开发必学之一-如果要学会联调接口而不是纯写静态前端页面-这个是必学-本文以优雅草蜻蜓Q系统API为实践来演示我们如何带token请求接口-优雅草卓伊凡
|
13天前
|
搜索推荐 数据挖掘 API
淘宝商品描述 API 接口的开发、应用与收益
淘宝商品描述API接口是淘宝开放平台提供的服务,允许开发者编程获取商品详情,如标题、价格、图片等。通过注册账号、申请权限并调用API,可构建比价工具、推荐系统、自动化上架工具等应用,提升用户体验与运营效率,创造新的商业模式。该接口为电商从业者提供了强大的数据支持和创新机会。
66 22
|
23天前
|
监控 Cloud Native 安全
基于 API 网关践行 API First 开发实践
API First 开发模式的核心在于:以 API 为先,将其视为“头等公民”,在构建应用、服务及集成之前,应优先定义并设计 API 及其配套。API First 作为一种相对较新的开发模式,它已逐渐流行并获得业内的广泛认可。
|
10天前
|
供应链 搜索推荐 数据挖掘
阿里巴巴热卖商品推荐 API 接口的开发、应用与收益
阿里巴巴热卖商品推荐API为开发者提供了获取平台热卖商品信息的强大工具,涵盖商品标题、价格、销量等数据。通过注册开放平台账号、申请API权限并调用接口,开发者可构建热卖商品推荐系统、数据分析工具及供应链管理系统等应用,提升用户体验与运营效率,创造新的商业模式。该API采用RESTful风格,支持多种应用场景,助力电商从业者实现创新与增值。
61 7
|
13天前
|
供应链 数据挖掘 API
1688APP 原数据 API 接口的开发、应用与收益
1688作为阿里巴巴旗下的B2B平台,汇聚海量供应商和商品资源。其APP原数据API接口为开发者提供获取商品详细信息的强大工具,涵盖商品标题、价格、图片等。通过注册开放平台账号、申请API权限并调用接口,开发者可构建比价工具、供应链管理及自动化上架工具等应用,提升用户体验与运营效率,创造新的商业模式。示例代码展示了如何使用Python调用API并解析返回结果。
68 8
|
11天前
|
搜索推荐 数据挖掘 API
亚马逊详情 API 接口的开发、应用与收益
亚马逊详情API接口是亚马逊开放平台提供的强大工具,允许开发者编程获取商品的详细信息,如标题、价格、描述等。通过注册账号、申请权限并调用API,开发者可构建比价工具、推荐系统和数据分析工具等应用,提升用户体验与运营效率,创造新商业模式。本文详细介绍其开发流程、应用场景及潜在收益,并附代码示例。
28 6

热门文章

最新文章