画布上绘制图片如何实现？

private img:ImageBitmap = new ImageBitmap(“common/images/icon.jpg”)
1.

@Entry  
@Component  
struct Test5 {  
  private settings: RenderingContextSettings = new RenderingContextSettings(true);  
  private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);  
  
  async drawImage() {  
    const context = getContext(this);  
    const resourceMgr: resourceManager.ResourceManager = context.resourceManager;  
    const fileData: Uint8Array = await resourceMgr.getMediaContent($r('app.media.milk'));  
    const buffer = fileData.buffer;  
    const imageSource: image.ImageSource = image.createImageSource(buffer);  
    const pixelMap: image.PixelMap = await imageSource.createPixelMap();  
  
    this.context.drawImage(pixelMap, 0, 0)  
  }  
  
  build() {  
    Column({ space: 5 }) {  
      Canvas(this.context)  
        .width(300)  
        .height(300)  
        .border({ width: 1, color: 'red' })  
        .onReady(() => {  
          this.drawImage();  
        })  
    }.width('100%').height('100%')  
  }  
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.