HarmonyOS Canvas 画文字如何实现字体加粗

Canvas 画文字如何实现字体加粗  代码:

Canvas(this.context) 
 .onReady(() => { 
  //绘制填充类文本-x,y-w,h 
  let grad = this.context.createLinearGradient(0, 0, 80, 80) 
  grad.addColorStop(0.0, '#260000') 
  grad.addColorStop(1.0, '#FF0000') 
  this.context.fillStyle = grad 
  // this.context.font = vp2px(16) + 'px sans-serif-medium' 
  // this.context.font = vp2px(16) + 'px serif' 
  this.context.font = vp2px(16) + 'px sans-serif-black' 
  this.context.fillText("产品热榜", 0, 30) 
  // this.context.strokeText("产品热榜", 0, 30) 
  this.context.textAlign = "start" 
 }) 
 .width(80) 
 .height(48)
HarmonyOS
2024-08-29 09:42:35
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
superinsect

font属性可以一次性设置所有的字体样式,中间使用空格隔开就好。

Canvas(this.context) 
 .onReady(() => { 
  //绘制填充类文本-x,y-w,h 
  let grad = this.context.createLinearGradient(0, 0, 80, 80) 
  grad.addColorStop(0.0, '#260000') 
  grad.addColorStop(1.0, '#FF0000') 
  this.context.fillStyle = grad 
  // this.context.font = vp2px(16) + 'px sans-serif-medium' 
  // this.context.font = vp2px(16) + 'px serif' 
  // font属性可以设置所有的字体样式 
  this.context.font = vp2px(18) + 'px bold sans-serif-black' 
  this.context.fillText("产品热榜", 0, 30) 
  // this.context.strokeText("产品热榜", 0, 30) 
  this.context.textAlign = "start" 
 }) 
 .width(80) 
 .height(48)
分享
微博
QQ
微信
回复
2024-08-29 18:14:46
相关问题
HarmonyOS使用canvas如何使文字垂直居中
149浏览 • 1回复 待解决
Canvas的时候,怎么设置画笔颜色
107浏览 • 1回复 待解决
HarmonyOS如何实现文字轮播效果?
131浏览 • 1回复 待解决
canvas如何实现水印效果
660浏览 • 1回复 待解决
文字动画效果如何实现
1659浏览 • 0回复 待解决
文字如何实现跑马灯效果?
90浏览 • 1回复 待解决
Canvas制作图表如何实现滑动惯性?
224浏览 • 1回复 待解决
鸿蒙提供的画中功能要怎么实现
617浏览 • 1回复 待解决
文字空行高度与字体高度不一致
1857浏览 • 1回复 待解决
HarmonyOS 如何设置自定义字体
296浏览 • 1回复 待解决
如何实现背景跟随文字大小改变
323浏览 • 1回复 待解决
如何实现RSA的公钥PK加密一段文字
329浏览 • 1回复 待解决
如何操作canvas重新绘制
639浏览 • 1回复 待解决
如何自定义字体替换系统字体
115浏览 • 1回复 待解决