HarmonyOS 5.0 应用开发——图像 PixelMap 变换
作者:高心星
- 2024-10-31 江苏
本文字数:1807 字
阅读完需:约 6 分钟
【高心星出品】
图像变换
图片处理指对 PixelMap 进行相关的操作,如获取图片信息、裁剪、缩放、偏移、旋转、翻转、设置透明度、读写像素数据等。图片处理主要包括图像变换、位图操作,本文介绍图像变换。
图形裁剪
// 裁剪图片 x,y为裁剪的起始坐标,size为裁剪的图片宽和高
temp.cropSync({ x: 20, y: 20, size: { width: this.imagewidth - 20, height: this.imageheight - 20 } })
复制代码
图形缩放
// 缩放图片
temp.scaleSync(0.5, 0.5)
复制代码
图形偏移
// 偏移图片
temp.translateSync(30, 20)
复制代码
图形旋转
// 旋转角度
temp.rotateSync(90)
复制代码
图形反转
// 水平反转图片
temp.flipSync(true, false)
复制代码
图形透明度
// 图片半透明
temp.opacitySync(0.5)
复制代码
完整代码
import { image } from '@kit.ImageKit';
@Entry
@Component
struct PmChange {
@State message: string = 'Hello World';
@State pm: PixelMap | undefined = undefined
@State crop: PixelMap | undefined = undefined
private imagewidth: number = 0
private imageheight: number = 0
genpm(index: number) {
// 获取资源图片的字节
let buffer = getContext(this).resourceManager.getMediaContentSync($r('app.media.jingse')).buffer.slice(0)
// 生成imagesource
let source = image.createImageSource(buffer)
// 转化为pixelmap
let temp = source.createPixelMapSync({ editable: true })
switch (index) {
case 0:
// 裁剪图片 x,y为裁剪的起始坐标,size为裁剪的图片宽和高
temp.cropSync({ x: 20, y: 20, size: { width: this.imagewidth - 20, height: this.imageheight - 20 } })
return temp
case 1:
// 缩放图片
temp.scaleSync(0.5, 0.5)
return temp
case 2:
// 偏移图片
temp.translateSync(30, 20)
return temp
case 3:
// 旋转角度
temp.rotateSync(90)
return temp
case 4:
// 水平反转图片
temp.flipSync(true, false)
return temp
case 5:
// 图片半透明
temp.opacitySync(0.5)
return temp
default :
return temp
}
}
aboutToAppear(): void {
this.pm=this.genpm(-1)
let imginfo = this.pm.getImageInfoSync()
// 获取图片的宽和高
this.imagewidth = imginfo.size.width
this.imageheight = imginfo.size.height
}
build() {
Column() {
Image(this.pm).width(300).height(300).margin({ top: 20 })
Flex({
direction: FlexDirection.Row,
wrap: FlexWrap.Wrap,
justifyContent: FlexAlign.SpaceAround,
}) {
Stack() {
Image(this.genpm(0)).width(100).height(100).border({width:2,color:Color.Red})
Text('裁剪掉20vp')
}.margin({top:20})
Stack() {
Image(this.genpm(1)).width(100).height(100).objectFit(ImageFit.ScaleDown).border({width:2,color:Color.Red})
Text('缩小一半')
}.margin({top:20})
Stack() {
Image(this.genpm(2)).width(100).height(100).objectFit(ImageFit.Fill).border({width:2,color:Color.Red})
Text('偏移图片')
}.margin({top:20})
Stack() {
Image(this.genpm(3)).width(100).height(100).border({width:2,color:Color.Red})
Text('旋转90°')
}.margin({top:20})
Stack() {
Image(this.genpm(4)).width(100).height(100).border({width:2,color:Color.Red})
Text('水平反转')
}.margin({top:20})
Stack() {
Image(this.genpm(5)).width(100).height(100).border({width:2,color:Color.Red})
Text('图片半透明')
}.margin({top:20})
}.width('100%')
.padding(20)
}.width('100%')
.height('100%')
}
}
Color.Red})
Text('图片半透明')
}.margin({top:20})
}.width('100%')
.padding(20)
}.width('100%')
.height('100%')
}
}
复制代码
划线
评论
复制
发布于: 刚刚阅读数: 4
高心星
关注
天将降大任于斯人也,必先苦其心志。 2024-10-17 加入
华为开发者专家(HDE)。 10年教学经验,兼任多家科技公司技术顾问。先后从事JavaEE项目开发、Python爬虫、HarmonyOS移动应用开发等课程的教学工作。参与开发《鸿蒙应用开发基础》和《鸿蒙项目实战》等课程。
评论