提交 0784b81a 编写于 作者: G gmy

update docs

Signed-off-by: Ngmy <guanmingyue@h-partners.com>
上级 0fe53cc6
......@@ -40,11 +40,7 @@ matchMedia(condition: string): MediaQueryList
**示例:**
```
export default {
matchMedia() {
var mMediaQueryList = mediaquery.matchMedia('(max-width: 466)');
},
}
var mMediaQueryList = mediaquery.matchMedia('(max-width: 466)');
```
## MediaQueryEvent
......@@ -102,6 +98,11 @@ addListener(callback: (event: MediaQueryEvent) => void): void
**示例:**
```
function maxWidthMatch(e){
if(e.matches){
// do something
}
}
mMediaQueryList.addListener(maxWidthMatch);
```
......@@ -123,6 +124,11 @@ removeListener(callback: (event: MediaQueryEvent) => void): void
**示例:**
```
function maxWidthMatch(e){
if(e.matches){
// do something
}
}
mMediaQueryList.removeListener(maxWidthMatch);
```
......
......@@ -23,7 +23,7 @@ Text(content?: string)
- 参数
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- |
| content | string | 否 | '' | 文本内容,包含子组件Span时不生效,显示Span内容。 |
| content | string | 否 | '' | 文本内容。包含子组件Span时不生效,显示Span内容,并且此时text组件的样式不生效。 |
## 属性
......
......@@ -258,7 +258,7 @@ struct MiterLimit {
// xxx.ets
@Entry
@Component
struct Font {
struct Fonts {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
......
......@@ -46,13 +46,13 @@ struct GestureGroupExample {
@State count: number = 0
@State offsetX: number = 0
@State offsetY: number = 0
@State borderStyle: BorderStyle = BorderStyle.Solid
@State borderStyles: BorderStyle = BorderStyle.Solid
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.SpaceBetween }) {
Text('sequence gesture\n' + 'LongPress onAction:' + this.count + '\nPanGesture offset:\nX: ' + this.offsetX + '\n' + 'Y: ' + this.offsetY)
}.translate({ x: this.offsetX, y: this.offsetY, z: 5 })
.height(100).width(200).padding(10).margin(80).border({ width: 1, style: this.borderStyle })
.height(100).width(200).padding(10).margin(80).border({ width: 1, style: this.borderStyles })
.gesture(
GestureGroup(GestureMode.Sequence,
LongPressGesture({ repeat: true })
......@@ -65,7 +65,7 @@ struct GestureGroupExample {
}),
PanGesture({})
.onActionStart(() => {
this.borderStyle = BorderStyle.Dashed
this.borderStyles = BorderStyle.Dashed
console.log('pan start')
})
.onActionUpdate((event: GestureEvent) => {
......
......@@ -266,7 +266,7 @@ struct MiterLimit {
// xxx.ets
@Entry
@Component
struct Font {
struct Fonts {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings)
......@@ -1920,12 +1920,12 @@ getPixelMap(sx: number, sy: number, sw: number, sh: number): PixelMap
以当前canvas指定区域内的像素创建[PixelMap](../apis/js-apis-image.md#pixelmap7)对象。
- 参数
| 参数 | 类型 | 必填 | 默认值 | 描述 |
| 参数 | 类型 | 必填 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- | -------- |
| sx | number | 是 | 0 | 需要输出的区域的左上角x坐标。 |
| sy | number | 是 | 0 | 需要输出的区域的左上角y坐标。 |
| sw | number | 是 | 0 | 需要输出的区域的宽度。 |
| sh | number | 是 | 0 | 需要输出的区域的高度。 |
| sx | number | 是 | 0 | 需要输出的区域的左上角x坐标。 |
| sy | number | 是 | 0 | 需要输出的区域的左上角y坐标。 |
| sw | number | 是 | 0 | 需要输出的区域的宽度。 |
| sh | number | 是 | 0 | 需要输出的区域的高度。 |
### getImageData
......
......@@ -68,8 +68,8 @@ PageTransitionEnter和PageTransitionExit组件支持的事件:
@Entry
@Component
struct PageTransitionExample1 {
@State scale: number = 1
@State opacity: number = 1
@State scale1: number = 1
@State opacity1: number = 1
@State active: boolean = false
build() {
Column() {
......@@ -79,19 +79,19 @@ struct PageTransitionExample1 {
.onClick(() => {
this.active = true
})
}.scale({ x: this.scale }).opacity(this.opacity)
}.scale({ x: this.scale1 }).opacity(this.opacity1)
}
// 自定义方式1:完全自定义转场过程的效果
pageTransition() {
PageTransitionEnter({ duration: 1200, curve: Curve.Linear })
.onEnter((type: RouteType, progress: number) => {
this.scale = 1
this.opacity = progress
this.scale1 = 1
this.opacity1 = progress
}) // 进场过程中会逐帧触发onEnter回调,入参为动效的归一化进度(0% -- 100%)
PageTransitionExit({ duration: 1500, curve: Curve.Ease })
.onExit((type: RouteType, progress: number) => {
this.scale = 1 - progress
this.opacity = 1
this.scale1 = 1 - progress
this.opacity1 = 1
}) // 退场过程中会逐帧触发onExit回调,入参为动效的归一化进度(0% -- 100%)
}
}
......@@ -102,27 +102,27 @@ struct PageTransitionExample1 {
@Entry
@Component
struct AExample {
@State scale: number = 1
@State opacity: number = 1
@State scale2: number = 1
@State opacity2: number = 1
@State active: boolean = false
build() {
Column() {
Navigator({ target: 'pages/index' ,type: NavigationType.Push}) {
Image($r('app.media.bg2')).width("100%").height("100%")
}
}.height("100%").width("100%").scale({ x: this.scale }).opacity(this.opacity)
}.height("100%").width("100%").scale({ x: this.scale2 }).opacity(this.opacity2)
}
// 自定义方式1:完全自定义转场过程的效果
pageTransition() {
PageTransitionEnter({ duration: 1200, curve: Curve.Linear })
.onEnter((type: RouteType, progress: number) => {
this.scale = 1
this.opacity = progress
this.scale2 = 1
this.opacity2 = progress
}) // 进场过程中会逐帧触发onEnter回调,入参为动效的归一化进度(0% -- 100%)
PageTransitionExit({ duration: 1500, curve: Curve.Ease })
.onExit((type: RouteType, progress: number) => {
this.scale = 1 - progress
this.opacity = 1
this.scale2 = 1 - progress
this.opacity2 = 1
}) // 退场过程中会逐帧触发onExit回调,入参为动效的归一化进度(0% -- 100%)
}
}
......@@ -137,8 +137,8 @@ struct AExample {
@Entry
@Component
struct PageTransitionExample {
@State scale: number = 1
@State opacity: number = 1
@State scale1: number = 1
@State opacity1: number = 1
@State active: boolean = false
build() {
......@@ -149,7 +149,7 @@ struct PageTransitionExample {
.onClick(() => {
this.active = true
})
}.scale({ x: this.scale }).opacity(this.opacity)
}.scale({ x: this.scale1 }).opacity(this.opacity1)
}
// 自定义方式2:使用系统提供的多种默认效果(平移、缩放、透明度等)
......@@ -168,8 +168,8 @@ struct PageTransitionExample {
@Entry
@Component
struct PageTransitionExample1 {
@State scale: number = 1
@State opacity: number = 1
@State scale2: number = 1
@State opacity2: number = 1
@State active: boolean = false
build() {
......@@ -180,7 +180,7 @@ struct PageTransitionExample1 {
.onClick(() => {
this.active = true
})
}.scale({ x: this.scale }).opacity(this.opacity)
}.scale({ x: this.scale2 }).opacity(this.opacity2)
}
// 自定义方式2:使用系统提供的多种默认效果(平移、缩放、透明度等)
......
......@@ -26,7 +26,7 @@
@Component
struct AreaExample {
@State value: string = 'Text'
@State size: string = ''
@State size1: string = ''
build() {
Column() {
......@@ -37,7 +37,7 @@ struct AreaExample {
})
.onAreaChange((oldValue: Area, newValue: Area) => {
console.info(`Ace: on area change, oldValue is ${JSON.stringify(oldValue)} value is ${JSON.stringify(newValue)}`)
this.size = JSON.stringify(newValue)
this.size1 = JSON.stringify(newValue)
})
Text('new area is: \n' + this.size).margin({ right: 30, left: 30 })
}
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册