鸿蒙HarmonyOS/OpenHarmony应用开发-ArkTS画布组件（八）

不能说的秘密

shadowOffsetY
shadowOffsetY
代码：

1. // xxx.ets
   
2. @Entry
   
3. @Component
   
4. struct ShadowOffsetY {
   
5.   private settings: RenderingContextSettings = new RenderingContextSettings(true)
   
6.   private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
   
7.   build() {
   
8.     Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
   
9.       Canvas(this.context)
   
10.         .width('100%')
    
11.         .height('100%')
    
12.         .backgroundColor('#ffff00')
    
13.         .onReady(() =>{
    
14.           this.context.shadowBlur = 10
    
15.           this.context.shadowOffsetY = 20
    
16.           this.context.shadowColor = 'rgb(0,0,0)'
    
17.           this.context.fillStyle = 'rgb(255,0,0)'
    
18.           this.context.fillRect(30, 30, 100, 100)
    
19.       })
    
20.     }
    
21.     .width('100%')
    
22.     .height('100%')
    
23.   }
    
24. }
    
25. 
    

复制代码

效果：

效果

imageSmoothingEnabled
代码

1. // xxx.ets
   
2. @Entry
   
3. @Component
   
4. struct ImageSmoothingEnabled {
   
5.   private settings: RenderingContextSettings = new RenderingContextSettings(true)
   
6.   private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
   
7.   private img:ImageBitmap = new ImageBitmap("common/images/icon.jpg")
   
8.   
   
9.   build() {
   
10.     Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
    
11.       Canvas(this.context)
    
12.         .width('100%')
    
13.         .height('100%')
    
14.         .backgroundColor('#ffff00')
    
15.         .onReady(() =>{
    
16.           this.context.imageSmoothingEnabled = false
    
17.           this.context.drawImage( this.img,0,0,400,200)
    
18.       })
    
19.     }
    
20.     .width('100%')
    
21.     .height('100%')
    
22.   }
    
23. }
    
24. 
    

复制代码

效果