默认值:1 | | direction | PanDirection | 否 | 设置滑动方向,此枚举值支持逻辑与(&)和逻辑或(\|)运算。
默认值:All | -| distance | number | 否 | 最小滑动识别距离,单位为vp。
默认值:5.0
**说明:**
> tab滑动与该拖动手势事件同时存在时,可将distance值设为1,使拖动更灵敏,避免造成事件错乱。 | +| distance | number | 否 | 最小滑动识别距离,单位为vp。
默认值:5.0
**说明:**
> [Tabs组件](ts-container-tabs.md)滑动与该拖动手势事件同时存在时,可将distance值设为1,使拖动更灵敏,避免造成事件错乱。 | **接口** 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 b9efef870d9d5be85079e46c3f4b9c9624652212..d93f1e3aff2614ef0662a3ac91cf528835f750e3 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md @@ -306,9 +306,7 @@ struct CanvasExample { this.context.moveTo(140, 10) this.context.lineTo(140, 160) this.context.stroke() - this.context.font = '18px sans-serif' - this.context.textAlign = 'start' this.context.fillText('textAlign=start', 140, 60) this.context.textAlign = 'end' @@ -351,9 +349,7 @@ struct TextBaseline { this.context.moveTo(0, 120) this.context.lineTo(400, 120) this.context.stroke() - this.context.font = '20px sans-serif' - this.context.textBaseline = 'top' this.context.fillText('Top', 10, 120) this.context.textBaseline = 'bottom' 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 191b9ffab8e744a75626d610f1ade17d89d61025..165735247a627b14db1e3f5b33575d59beb61038 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 @@ -17,40 +17,41 @@ addColorStop(offset: number, color: string): void **参数:** - | 参数 | 类型 | 必填 | 默认值 | 描述 | - | ------ | ------ | ---- | --------- | ---------------------------- | - | offset | number | 是 | 0 | 设置渐变点距离起点的位置占总体长度的比例,范围为0到1。 | - | color | string | 是 | '#ffffff' | 设置渐变的颜色。 | +| 参数 | 类型 | 必填 | 默认值 | 描述 | +| ------ | ------ | ---- | --------- | ---------------------------- | +| offset | number | 是 | 0 | 设置渐变点距离起点的位置占总体长度的比例,范围为0到1。 | +| color | string | 是 | '#ffffff' | 设置渐变的颜色。 | **示例:** ```ts - // xxx.ets - @Entry - @Component - struct Page45 { - private settings: RenderingContextSettings = new RenderingContextSettings(true) - private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - - build() { - Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { - Canvas(this.context) - .width('100%') - .height('100%') - .backgroundColor('#ffff00') - .onReady(() =>{ - var grad = this.context.createLinearGradient(50,0, 300,100) - 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) - }) - } - .width('100%') - .height('100%') - }} +// xxx.ets +@Entry +@Component +struct Page45 { + private settings: RenderingContextSettings = new RenderingContextSettings(true) + private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) + + build() { + Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { + Canvas(this.context) + .width('100%') + .height('100%') + .backgroundColor('#ffff00') + .onReady(() => { + var grad = this.context.createLinearGradient(50, 0, 300, 100) + 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) + }) + } + .width('100%') + .height('100%') + } +} ``` ![zh-cn_image_0000001194032516](figures/zh-cn_image_0000001194032516.png) diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-scroll.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-scroll.md index 305facc51a69b54fe0fe82e8e5b37d1f55a9abe4..4afb957f54b269836a33bbebba12473ce1811ba0 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-container-scroll.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-scroll.md @@ -245,8 +245,11 @@ struct NestedScroll { Text("Scroll Area") .width("100%").height("40%").backgroundColor(0X330000FF) .fontSize(16).textAlign(TextAlign.Center) + .onClick(() => { + this.scroller.scrollToIndex(5) + }) - List({ space: 20 }) { + List({ space: 20, scroller: this.scroller }) { ForEach(this.arr, (item) => { ListItem() { Text("ListItem" + item) @@ -255,7 +258,9 @@ struct NestedScroll { }.width("100%").height(100) }, item => item) } - .width("100%").height("50%").edgeEffect(EdgeEffect.None) + .width("100%") + .height("50%") + .edgeEffect(EdgeEffect.None) .onReachStart(() => { this.listPosition = 0 }) diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-component.md b/zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-component.md index 1f97c15861aa8fb6b9e0627760346dd2a5262e58..6e397391f91cbc5681d9be59b70b1c91f2b4ae10 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-component.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-component.md @@ -21,8 +21,8 @@ | type | [TransitionType](ts-appendix-enums.md#transitiontype) | 否 | 默认包括组件新增和删除。
默认值:TransitionType.All
**说明:**
不指定Type时说明插入删除使用同一种效果。 | | opacity | number | 否 | 设置组件转场时的透明度效果,为插入时起点和删除时终点的值。
默认值:1 | | translate | {
x? : number,
y? : number,
z? : number
} | 否 | 设置组件转场时的平移效果,为插入时起点和删除时终点的值。
-x:横向的平移距离。
-y:纵向的平移距离。
-z:竖向的平移距离。 | -| scale | {
x? : number,
y? : number,
z? : number,
centerX? : number,
centerY? : number
} | 否 | 设置组件转场时的缩放效果,为插入时起点和删除时终点的值。
-x:横向放大倍数(或缩小比例)。
-y:纵向放大倍数(或缩小比例)。
-z:竖向放大倍数(或缩小比例)。
- centerX、centerY缩放中心点。
- 中心点为0时,默认的是组件的左上角。
| -| rotate | {
x?: number,
y?: number,
z?: number,
angle?: Angle,
centerX?: Length,
centerY?: Length
} | 否 | 设置组件转场时的旋转效果,为插入时起点和删除时终点的值。
-x:横向的旋转向量。
-y:纵向的旋转向量。
-z:竖向的旋转向量。
- centerX,centerY指旋转中心点。
- 中心点为(0,0)时,默认的是组件的左上角。 | +| scale | {
x? : number,
y? : number,
z? : number,
centerX? : number \| string,
centerY? : number \| string
} | 否 | 设置组件转场时的缩放效果,为插入时起点和删除时终点的值。
-x:横向放大倍数(或缩小比例)。
-y:纵向放大倍数(或缩小比例)。
-z:竖向放大倍数(或缩小比例)。
- centerX、centerY指缩放中心点,centerX和centerY默认值是"50%"。
- 中心点为0时,默认的是组件的左上角。
| +| rotate | {
x?: number,
y?: number,
z?: number,
angle?: number \| string,
centerX?: number \| string,
centerY?: number \| string
} | 否 | 设置组件转场时的旋转效果,为插入时起点和删除时终点的值。
-x:横向的旋转向量。
-y:纵向的旋转向量。
-z:竖向的旋转向量。
- centerX,centerY指旋转中心点,centerX和centerY默认值是"50%"。
- 中心点为(0,0)时,默认的是组件的左上角。 | ## 示例 diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border-image.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border-image.md index 268745a58a2edbff9dd22bd06d6ca3558eb84fd5..bc7115c31ae1c215eb12669c0b8ccc875cbdd78e 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border-image.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border-image.md @@ -85,7 +85,7 @@ struct Index { build() { Row() { Column() { - Text('This is gradient color.').textAlign(TextAlign.Center) + Text('This is gradient color.').textAlign(TextAlign.Center).width(68) .borderImage({ source: { angle: 90,