From ed8a9201a4b9cfb882a13f4906c6fce7b150b985 Mon Sep 17 00:00:00 2001 From: yaoyuchi Date: Fri, 28 Jan 2022 11:44:12 +0800 Subject: [PATCH] edit canvas doc Signed-off-by: yaoyuchi --- .../arkui-ts/ts-canvasrenderingcontext2d.md | 141 ++++++++---------- .../arkui-ts/ts-components-canvas-canvas.md | 2 +- .../ts-components-canvas-canvasgradient.md | 9 +- .../ts-components-canvas-imagebitmap.md | 2 +- .../arkui-ts/ts-components-canvas-path2d.md | 24 +-- .../ts-offscreencanvasrenderingcontext2d.md | 124 ++++++++------- 6 files changed, 143 insertions(+), 159 deletions(-) diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md b/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md index 16c26fd807..c6efba1fd7 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md @@ -7,7 +7,7 @@ ## 接口 -CanvasRenderingContext2D\(setting: RenderingContextSetting\) +CanvasRenderingContext2D\(setting: RenderingContextSettings\) - 参数 @@ -40,9 +40,9 @@ CanvasRenderingContext2D\(setting: RenderingContextSetting\) ### RenderingContextSettings -RenderingContextSettings\(antialias?: bool, alpha?: bool\) +RenderingContextSettings\(antialias?: bool) -用来配置CanvasRenderingContext2D对象的参数,包括是否开启抗锯齿和是否包含一个alpha通道。 +用来配置CanvasRenderingContext2D对象的参数,包括是否开启抗锯齿。 - 参数 @@ -69,17 +69,6 @@ RenderingContextSettings\(antialias?: bool, alpha?: bool\)

表明canvas是否开启抗锯齿。

-

alpha

- -

bool

- -

- -

false

- -

表明canvas包含是否包含一个alpha通道。

- - @@ -282,7 +271,7 @@ RenderingContextSettings\(antialias?: bool, alpha?: bool\) @Entry @Component struct FillStyleExample { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -310,7 +299,7 @@ struct FillStyleExample { @Entry @Component struct LineWidthExample { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -338,7 +327,7 @@ struct LineWidthExample { @Entry @Component struct StrokeStyleExample { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -367,7 +356,7 @@ struct StrokeStyleExample { @Entry @Component struct LineCapExample { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -399,7 +388,7 @@ struct LineCapExample { @Entry @Component struct LineJoinExample { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -432,7 +421,7 @@ struct LineJoinExample { @Entry @Component struct MiterLimit { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -465,7 +454,7 @@ struct MiterLimit { @Entry @Component struct Font { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -492,8 +481,8 @@ struct Font { ``` @Entry @Component -struct TextAlign { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) +struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -536,7 +525,7 @@ struct TextAlign { @Entry @Component struct TextBaseline { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -579,7 +568,7 @@ struct TextBaseline { @Entry @Component struct GlobalAlpha { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -610,7 +599,7 @@ struct GlobalAlpha { @Entry @Component struct LineDashOffset { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -703,7 +692,7 @@ struct LineDashOffset { @Entry @Component struct GlobalCompositeOperation { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -739,7 +728,7 @@ struct GlobalCompositeOperation { @Entry @Component struct ShadowBlur { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true); + private settings: RenderingContextSettings = new RenderingContextSettings(true); private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings); build() { @@ -769,7 +758,7 @@ struct ShadowBlur { @Entry @Component struct ShadowColor { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -799,7 +788,7 @@ struct ShadowColor { @Entry @Component struct ShadowOffsetX { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -830,7 +819,7 @@ struct ShadowOffsetX { @Entry @Component struct ShadowOffsetY { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -860,7 +849,7 @@ struct ShadowOffsetY { @Entry @Component struct ImageSmoothingEnabled { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private img:ImageBitmap = new ImageBitmap("common/images/icon.jpg") @@ -959,7 +948,7 @@ fillRect\(x: number, y: number, w: number, h: number\): void @Entry @Component struct FillRect { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -1055,7 +1044,7 @@ strokeRect\(x: number, y: number, w: number, h: number\): void @Entry @Component struct StrokeRect { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1150,7 +1139,7 @@ clearRect\(x: number, y: number, w: number, h: number\): void @Entry @Component struct ClearRect { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1236,7 +1225,7 @@ fillText\(text: string, x: number, y: number\): void @Entry @Component struct FillText { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1321,7 +1310,7 @@ strokeText\(text: string, x: number, y: number\): void @Entry @Component struct StrokeText { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1421,7 +1410,7 @@ measureText\(text: string\): TextMetrics @Entry @Component struct MeasureText { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1484,8 +1473,8 @@ stroke\(path?: Path2D\): void ``` @Entry @Component - struct Stroke { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -1522,7 +1511,7 @@ beginPath\(\): void @Entry @Component struct BeginPath { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -1601,7 +1590,7 @@ moveTo\(x: number, y: number\): void @Entry @Component struct MoveTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -1678,7 +1667,7 @@ lineTo\(x: number, y: number\): void @Entry @Component struct LineTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -1715,7 +1704,7 @@ closePath\(\): void @Entry @Component struct ClosePath { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -1793,7 +1782,7 @@ createPattern\(image: ImageBitmap, repetition: string\): void @Entry @Component struct CreatePattern { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private img:ImageBitmap = new ImageBitmap("common/images/icon.jpg") @@ -1914,7 +1903,7 @@ bezierCurveTo\(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number @Entry @Component struct BezierCurveTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -2013,7 +2002,7 @@ quadraticCurveTo\(cpx: number, cpy: number, x: number, y: number\): void @Entry @Component struct QuadraticCurveTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true); + private settings: RenderingContextSettings = new RenderingContextSettings(true); private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings); build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -2133,7 +2122,7 @@ arc\(x: number, y: number, radius: number, startAngle: number, endAngle: number, @Entry @Component struct Arc { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -2242,7 +2231,7 @@ arcTo\(x1: number, y1: number, x2: number, y2: number, radius: number\): void @Entry @Component struct ArcTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -2383,8 +2372,8 @@ ellipse\(x: number, y: number, radiusX: number, radiusY: number, rotation: numbe ``` @Entry @Component - struct Ellipse { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -2485,8 +2474,8 @@ rect\(x: number, y: number, width: number, height: number\): void ``` @Entry @Component - struct Rect { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -2521,7 +2510,7 @@ fill\(\): void @Entry @Component struct Fill { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -2556,7 +2545,7 @@ clip\(\): void @Entry @Component struct Clip { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -2627,7 +2616,7 @@ rotate\(rotate: number\): void @Entry @Component struct Rotate { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -2702,7 +2691,7 @@ scale\(x: number, y: number\): void @Entry @Component struct Scale { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -2826,7 +2815,7 @@ transform方法对应一个变换矩阵,想对一个图形进行变化的时 @Entry @Component struct Transform { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -2950,7 +2939,7 @@ setTransfrom方法使用的参数和transform\(\)方法相同,但setTransform\ @Entry @Component struct SetTransform { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -3027,7 +3016,7 @@ translate\(x: number, y: number\): void @Entry @Component struct Translate { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -3184,7 +3173,7 @@ drawImage\(image: ImageBitmap, sx: number, sy: number, sWidth: number, sHeight: @Entry @Component struct ImageExample { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true); + private settings: RenderingContextSettings = new RenderingContextSettings(true); private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings); private img:ImageBitmap = new ImageBitmap("common/images/example.jpg"); build() { @@ -3461,7 +3450,7 @@ putImageData\(imageData: Object, dx: number, dy: number, dirtyX?: number, dirtyY @Entry @Component struct PutImageData { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -3501,8 +3490,8 @@ restore\(\): void ``` @Entry @Component - struct Restore { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -3512,7 +3501,7 @@ restore\(\): void .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.controller.restore() + this.context.restore() }) } .width('100%') @@ -3533,8 +3522,8 @@ save\(\): void ``` @Entry @Component - struct Restore { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { @@ -3627,9 +3616,8 @@ createLinearGradient\(x0: number, y0: number, x1: number, y1: number\): void @Entry @Component struct CreateLinearGradient { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private gra:CanvasGradient = new CanvasGradient() build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -3639,9 +3627,9 @@ createLinearGradient\(x0: number, y0: number, x1: number, y1: number\): void .backgroundColor('#ffff00') .onReady(() =>{ var grad = this.context.createLinearGradient(50,0, 300,100) - this.gra.addColorStop(0.0, 'red') - this.gra.addColorStop(0.5, 'white') - this.gra.addColorStop(1.0, 'green') + grad.addColorStop(0.0, 'red') + grad.addColorStop(0.5, 'white') + grad.addColorStop(1.0, 'green') this.context.fillStyle = grad this.context.fillRect(0, 0, 500, 500) }) @@ -3750,9 +3738,8 @@ createRadialGradient\(x0: number, y0: number, r0: number, x1: number, y1: number @Entry @Component struct CreateRadialGradient { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private gra:CanvasGradient = new CanvasGradient() build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -3762,9 +3749,9 @@ createRadialGradient\(x0: number, y0: number, r0: number, x1: number, y1: number .backgroundColor('#ffff00') .onReady(() =>{ var grad = this.context.createRadialGradient(200,200,50, 200,200,200) - this.gra.addColorStop(0.0, 'red') - this.gra.addColorStop(0.5, 'white') - this.gra.addColorStop(1.0, 'green') + grad.addColorStop(0.0, 'red') + grad.addColorStop(0.5, 'white') + grad.addColorStop(1.0, 'green') this.context.fillStyle = grad this.context.fillRect(0, 0, 500, 500) }) diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md index 5133d246a5..890dddfd3f 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md @@ -78,7 +78,7 @@ Canvas\(context: CanvasRenderingContext2D\) @Entry @Component struct CanvasExample { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) build() { diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvasgradient.md b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvasgradient.md index 30324ac239..ece4af28de 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvasgradient.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvasgradient.md @@ -56,9 +56,8 @@ addColorStop\(offset: number, color: string\): void @Entry @Component struct Page45 { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private gra:CanvasGradient = new CanvasGradient() build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -68,9 +67,9 @@ addColorStop\(offset: number, color: string\): void .backgroundColor('#ffff00') .onReady(() =>{ var grad = this.context.createLinearGradient(50,0, 300,100) - this.gra.addColorStop(0.0, 'red') - this.gra.addColorStop(0.5, 'white') - this.gra.addColorStop(1.0, 'green') + grad.addColorStop(0.0, 'red') + grad.addColorStop(0.5, 'white') + grad.addColorStop(1.0, 'green') this.context.fillStyle = grad this.context.fillRect(0, 0, 500, 500) }) diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagebitmap.md b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagebitmap.md index d4a3609367..fcf6834efc 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagebitmap.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagebitmap.md @@ -83,7 +83,7 @@ ImageBitmap\(src: string\) @Entry @Component struct DrawImageExample { - private settings:RenderingContextSettings = new RenderingContextSettings(true,true) + private settings:RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private img:ImageBitmap = new ImageBitmap("common/images/example.jpg") diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-path2d.md b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-path2d.md index e4193e5a51..ae6665dd8b 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-path2d.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-path2d.md @@ -45,7 +45,7 @@ addPath\(path: Object\): void @Entry @Component struct AddPath { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private path2Da: Path2D = new Path2D("M250 150 L150 350 L350 350 Z") @@ -83,7 +83,7 @@ closePath\(\): void @Entry @Component struct ClosePath { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private path2Db: Path2D = new Path2D() @@ -161,7 +161,7 @@ moveTo\(x: number, y: number\): void @Entry @Component struct MoveTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private path2Db: Path2D = new Path2D() @@ -239,7 +239,7 @@ lineTo\(x: number, y: number\): void @Entry @Component struct LineTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private path2Db: Path2D = new Path2D() @@ -363,7 +363,7 @@ bezierCurveTo\(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number @Entry @Component struct BezierCurveTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private path2Db: Path2D = new Path2D() @@ -460,7 +460,7 @@ quadraticCurveTo\(cpx: number, cpy: number, x: number ,y: number\): void @Entry @Component struct QuadraticCurveTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private path2Db: Path2D = new Path2D() @@ -580,7 +580,7 @@ arc\(x: number, y: number, radius: number, startAngle: number, endAngle: number, @Entry @Component struct Arc { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private path2Db: Path2D = new Path2D() @@ -687,7 +687,7 @@ arcTo\(x1: number, y1: number, x2: number, y2: number, radius: number\): void @Entry @Component struct ArcTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private path2Db: Path2D = new Path2D() @@ -827,8 +827,8 @@ ellipse\(x: number, y: number, radiusX: number, radiusY: number, rotation: numbe ``` @Entry @Component - struct Ellipse { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private path2Db: Path2D = new Path2D() @@ -924,8 +924,8 @@ rect\(x: number, y: number, width: number, height: number\): void ``` @Entry @Component - struct Rect { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private path2Db: Path2D = new Path2D() diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md b/zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md index b2815c7ef5..5e7ef1059b 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md @@ -258,7 +258,7 @@ OffscreenCanvasRenderingContext2D\(width: number, height: number, setting: Rende @Entry @Component struct FillStyleExample { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -289,7 +289,7 @@ struct FillStyleExample { @Entry @Component struct LineWidthExample { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -320,7 +320,7 @@ struct LineWidthExample { @Entry @Component struct StrokeStyleExample { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -352,7 +352,7 @@ struct StrokeStyleExample { @Entry @Component struct LineCapExample { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -387,7 +387,7 @@ struct LineCapExample { @Entry @Component struct LineJoinExample { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -423,7 +423,7 @@ struct LineJoinExample { @Entry @Component struct MiterLimit { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -459,7 +459,7 @@ struct MiterLimit { @Entry @Component struct Font { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -489,8 +489,8 @@ struct Font { ``` @Entry @Component -struct TextAlign { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) +struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -536,7 +536,7 @@ struct TextAlign { @Entry @Component struct TextBaseline { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -582,7 +582,7 @@ struct TextBaseline { @Entry @Component struct GlobalAlpha { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -616,7 +616,7 @@ struct GlobalAlpha { @Entry @Component struct LineDashOffset { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -712,7 +712,7 @@ struct LineDashOffset { @Entry @Component struct GlobalCompositeOperation { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -751,7 +751,7 @@ struct GlobalCompositeOperation { @Entry @Component struct ShadowBlur { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -784,7 +784,7 @@ struct ShadowBlur { @Entry @Component struct ShadowColor { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -818,7 +818,7 @@ struct ShadowColor { @Entry @Component struct ShadowOffsetX { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -852,7 +852,7 @@ struct ShadowOffsetX { @Entry @Component struct ShadowOffsetY { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -886,7 +886,7 @@ struct ShadowOffsetY { @Entry @Component struct ImageSmoothingEnabled { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private img:ImageBitmap = new ImageBitmap("common/images/icon.jpg") private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -987,7 +987,7 @@ fillRect\(x: number, y: number, w: number, h: number\): void @Entry @Component struct FillRect { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -1086,7 +1086,7 @@ strokeRect\(x: number, y: number, w: number, h: number\): void @Entry @Component struct StrokeRect { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -1184,7 +1184,7 @@ clearRect\(x: number, y: number, w: number, h: number\): void @Entry @Component struct ClearRect { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -1273,7 +1273,7 @@ fillText\(text: string, x: number, y: number\): void @Entry @Component struct FillText { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -1361,7 +1361,7 @@ strokeText\(text: string, x: number, y: number\): void @Entry @Component struct StrokeText { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -1463,7 +1463,7 @@ measureText\(text: string\): TextMetrics @Entry @Component struct MeasureText { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -1529,10 +1529,10 @@ stroke\(path?: Path2D\): void ``` @Entry @Component - struct Stroke { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenRenderingContext(600, 600, this.settings) + private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { Canvas(this.context) @@ -1569,7 +1569,7 @@ beginPath\(\): void @Entry @Component struct BeginPath { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -1650,7 +1650,7 @@ moveTo\(x: number, y: number\): void @Entry @Component struct MoveTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -1729,7 +1729,7 @@ lineTo\(x: number, y: number\): void @Entry @Component struct LineTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -1768,7 +1768,7 @@ closePath\(\): void @Entry @Component struct ClosePath { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -1848,7 +1848,7 @@ createPattern\(image: ImageBitmap, repetition: string\): CanvasPattern @Entry @Component struct CreatePattern { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private img:ImageBitmap = new ImageBitmap("common/images/icon.jpg") private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -1971,7 +1971,7 @@ bezierCurveTo\(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number @Entry @Component struct BezierCurveTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -2072,7 +2072,7 @@ quadraticCurveTo\(cpx: number, cpy: number, x: number, y: number\): void @Entry @Component struct QuadraticCurveTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -2194,7 +2194,7 @@ arc\(x: number, y: number, radius: number, startAngle: number, endAngle: number, @Entry @Component struct Arc { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -2305,7 +2305,7 @@ arcTo\(x1: number, y1: number, x2: number, y2: number, radius: number\): void @Entry @Component struct ArcTo { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -2448,8 +2448,8 @@ ellipse\(x: number, y: number, radiusX: number, radiusY: number, rotation: numbe ``` @Entry @Component - struct Ellipse { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -2548,8 +2548,8 @@ rect\(x: number, y: number, width: number, height: number\): void ``` @Entry @Component - struct Rect { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -2586,7 +2586,7 @@ fill\(\): void @Entry @Component struct Fill { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -2623,7 +2623,7 @@ clip\(\): void @Entry @Component struct Clip { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -2692,7 +2692,7 @@ rotate\(rotate: number\): void @Entry @Component struct Rotate { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -2769,7 +2769,7 @@ scale\(x: number, y: number\): void @Entry @Component struct Scale { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -2895,7 +2895,7 @@ transform方法对应一个变换矩阵,想对一个图形进行变化的时 @Entry @Component struct Transform { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -3021,7 +3021,7 @@ setTransfrom方法使用的参数和transform\(\)方法相同,但setTransform\ @Entry @Component struct SetTransform { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -3100,7 +3100,7 @@ translate\(x: number, y: number\): void @Entry @Component struct Translate { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -3259,7 +3259,7 @@ drawImage\(image: ImageBitmap, sx: number, sy: number, sWidth: number, sHeight: @Entry @Component struct Index { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private img:ImageBitmap = new ImageBitmap("common/images/icon.jpg") private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) @@ -3539,7 +3539,7 @@ putImageData\(imageData: Object, dx: number, dy: number, dirtyX?: number, dirtyY @Entry @Component struct PutImageData { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -3581,8 +3581,8 @@ restore\(\): void ``` @Entry @Component - struct Restore { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -3615,8 +3615,8 @@ save\(\): void ``` @Entry @Component - struct Restore { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + struct CanvasExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { @@ -3711,9 +3711,8 @@ createLinearGradient\(x0: number, y0: number, x1: number, y1: number\): void @Entry @Component struct CreateLinearGradient { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private gra:CanvasGradient = new CanvasGradient() private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -3723,9 +3722,9 @@ createLinearGradient\(x0: number, y0: number, x1: number, y1: number\): void .backgroundColor('#ffff00') .onReady(() =>{ var grad = this.offContext.createLinearGradient(50,0, 300,100) - this.gra.addColorStop(0.0, 'red') - this.gra.addColorStop(0.5, 'white') - this.gra.addColorStop(1.0, 'green') + grad.addColorStop(0.0, 'red') + grad.addColorStop(0.5, 'white') + grad.addColorStop(1.0, 'green') this.offContext.fillStyle = grad this.offContext.fillRect(0, 0, 500, 500) var image = this.offContext.transferToImageBitmap() @@ -3836,9 +3835,8 @@ createRadialGradient\(x0: number, y0: number, r0: number, x1: number, y1: number @Entry @Component struct CreateRadialGradient { - private settings: RenderingContextSettings = new RenderingContextSettings(true,true) + private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private gra:CanvasGradient = new CanvasGradient() private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -3848,9 +3846,9 @@ createRadialGradient\(x0: number, y0: number, r0: number, x1: number, y1: number .backgroundColor('#ffff00') .onReady(() =>{ var grad = this.offContext.createRadialGradient(200,200,50, 200,200,200) - this.gra.addColorStop(0.0, 'red') - this.gra.addColorStop(0.5, 'white') - this.gra.addColorStop(1.0, 'green') + grad.addColorStop(0.0, 'red') + grad.addColorStop(0.5, 'white') + grad.addColorStop(1.0, 'green') this.offContext.fillStyle = grad this.offContext.fillRect(0, 0, 500, 500) var image = this.offContext.transferToImageBitmap() -- GitLab