请教一个问题,如何在图片上写数字,使用arkts?

我有个问题,把一个大图片分隔成小图片后,我想在每个图片上写一个数字,用ArkTS如何写程序完成。可以用什么API。

我原来是用Java写的程序,是从图片上创建一个canvas,然后可以写字。

现在改用ArkTS,应该如何做?


UI
示例代码
2023-12-26 13:22:09
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
Joshun

可以用ArkTS的​OffscreenCanvasRenderingContext2D​离屏绘制的​fillText​方法来实现,最后用它的​getPixelMap​方法或者​transferToImageBitmap​方法拿到绘制完的图像,大概像这样:

async function drawTextToImage(img: image.PixelMap, text: string): Promise<PixelMap> {
  const imageInfo = await  img.getImageInfo()
  const width = imageInfo.size.width
  const height = imageInfo.size.height
  const offC2d = new OffscreenCanvasRenderingContext2D(width, height, {
    antialias: true
  })
  // 配置 OffscreenCanvasRenderingContext2D
  offC2d.font = 'normal bolder 60px sans-serif'
  offC2d.fillStyle = 'rgb(255,0,0)'
  offC2d.textAlign = 'center'
  offC2d.textBaseline = 'middle'
  // 绘制图像
  offC2d.drawImage(img, 0, 0, width, height, 0, 0, width, height)
  // 绘制文字
  offC2d.fillText(text, width / 2, height / 2)
  return offC2d.getPixelMap(0, 0, width, height)
}
分享
微博
QQ
微信
回复
2023-12-26 14:48:04
相关问题
请教一个mysql问题有知道的吗?
2391浏览 • 1回复 待解决
请教一个sql查询需求?
2561浏览 • 1回复 待解决
如果一个多级的获取数据的问题
3404浏览 • 1回复 待解决
如何在Native侧构建一个ArkTS对象
2132浏览 • 1回复 待解决
如何判断一个字符是不是数字
515浏览 • 1回复 待解决
如何一个Component画到Pixelmap
1895浏览 • 1回复 待解决
ArkTS如何实现一个底部弹窗?
798浏览 • 1回复 待解决
如何一个Component画到Pixelmap呢?
2613浏览 • 1回复 待解决
如何创建一个ArkTS应用的项目?
174浏览 • 1回复 待解决
求教一个sql语句里传参怎么
3346浏览 • 1回复 待解决
请教2vp相关的问题,麻烦解答
271浏览 • 1回复 待解决
HarmonyOS 如何访问一个在线的图片
46浏览 • 1回复 待解决
HarmonyOS怎么接入一个JS引擎?
49浏览 • 1回复 待解决