提交 fdfca7ac 编写于 作者: Y yamila89

cherry Pick

Signed-off-by: Nyamila89 <tianyu55@h-partners.com>
上级 4dfece87
...@@ -87,7 +87,7 @@ off(type: 'change', callback?: Callback&lt;MediaQueryResult&gt;): void ...@@ -87,7 +87,7 @@ off(type: 'change', callback?: Callback&lt;MediaQueryResult&gt;): void
| callback | Callback&lt;MediaQueryResult&gt; | 否 | 需要去注册的回调,如果参数缺省则去注册该句柄下所有的回调。 | | callback | Callback&lt;MediaQueryResult&gt; | 否 | 需要去注册的回调,如果参数缺省则去注册该句柄下所有的回调。 |
**示例:** **示例:**
```js ```ts
import mediaquery from '@ohos.mediaquery' import mediaquery from '@ohos.mediaquery'
let listener = mediaquery.matchMediaSync('(orientation: landscape)'); //监听横屏事件 let listener = mediaquery.matchMediaSync('(orientation: landscape)'); //监听横屏事件
...@@ -116,11 +116,9 @@ off(type: 'change', callback?: Callback&lt;MediaQueryResult&gt;): void ...@@ -116,11 +116,9 @@ off(type: 'change', callback?: Callback&lt;MediaQueryResult&gt;): void
### 示例 ### 示例
```js ```ts
import mediaquery from '@ohos.mediaquery' import mediaquery from '@ohos.mediaquery'
let portraitFunc = null
@Entry @Entry
@Component @Component
struct MediaQueryExample { struct MediaQueryExample {
...@@ -139,7 +137,7 @@ struct MediaQueryExample { ...@@ -139,7 +137,7 @@ struct MediaQueryExample {
} }
aboutToAppear() { aboutToAppear() {
portraitFunc = this.onPortrait.bind(this) //bind current js instance let portraitFunc = this.onPortrait.bind(this) //bind current js instance
this.listener.on('change', portraitFunc) this.listener.on('change', portraitFunc)
} }
......
...@@ -17,7 +17,10 @@ import lottie from '@ohos/lottieETS' ...@@ -17,7 +17,10 @@ import lottie from '@ohos/lottieETS'
``` ```
> **说明:** > **说明:**
> 在Terminal窗口使用 `npm install @ohos/lottieETS` 命令下载Lottie,下载之前需要配置权限。 >
> 在Terminal窗口使用 `npm install @ohos/lottieETS` 命令下载Lottie。
>
> 安装ohos npm 三方包时,需要先执行`npm config set @ohos:registry=https://repo.harmonyos.com/npm/`设置仓库地址。
## lottie.loadAnimation ## lottie.loadAnimation
......
...@@ -25,8 +25,8 @@ ...@@ -25,8 +25,8 @@
- RouteType枚举说明 - RouteType枚举说明
| 名称 | 描述 | | 名称 | 描述 |
| -------- | -------- | | -------- | -------- |
| Pop | 重定向指定页面 | | Pop | 重定向指定页面。PageA跳转到PageB时,PageA为Exit+Push,PageB为Enter+Push。 |
| Push | 跳转到下一页面。 | | Push | 跳转到下一页面。PageB返回至PageA时,PageA为Enter+Pop,PageB为Exit+Pop。 |
## 属性 ## 属性
...@@ -63,22 +63,19 @@ PageTransitionEnter和PageTransitionExit组件支持的事件: ...@@ -63,22 +63,19 @@ PageTransitionEnter和PageTransitionExit组件支持的事件:
自定义方式1:配置了当前页面的入场动画为淡入,退场动画为缩小。 自定义方式1:配置了当前页面的入场动画为淡入,退场动画为缩小。
``` ```ts
// index.ets // index.ets
@Entry @Entry
@Component @Component
struct PageTransitionExample1 { struct PageTransitionExample1 {
@State scale1: number = 1 @State scale1: number = 1
@State opacity1: number = 1 @State opacity1: number = 1
@State active: boolean = false
build() { build() {
Column() { Column() {
Navigator({ target: 'pages/page1', type: NavigationType.Push }) { Navigator({ target: 'pages/page1', type: NavigationType.Push }) {
Image($r('app.media.bg1')).width("100%").height("100%") Image($r('app.media.bg1')).width("100%").height("100%")
} }
.onClick(() => {
this.active = true
})
}.scale({ x: this.scale1 }).opacity(this.opacity1) }.scale({ x: this.scale1 }).opacity(this.opacity1)
} }
// 自定义方式1:完全自定义转场过程的效果 // 自定义方式1:完全自定义转场过程的效果
...@@ -97,14 +94,14 @@ struct PageTransitionExample1 { ...@@ -97,14 +94,14 @@ struct PageTransitionExample1 {
} }
``` ```
``` ```ts
// page1.ets // page1.ets
@Entry @Entry
@Component @Component
struct AExample { struct AExample {
@State scale2: number = 1 @State scale2: number = 1
@State opacity2: number = 1 @State opacity2: number = 1
@State active: boolean = false
build() { build() {
Column() { Column() {
Navigator({ target: 'pages/index' ,type: NavigationType.Push}) { Navigator({ target: 'pages/index' ,type: NavigationType.Push}) {
...@@ -132,23 +129,19 @@ struct AExample { ...@@ -132,23 +129,19 @@ struct AExample {
自定义方式2:配置了当前页面的入场动画为从左侧滑入,退场为缩小加透明度变化。 自定义方式2:配置了当前页面的入场动画为从左侧滑入,退场为缩小加透明度变化。
``` ```ts
// index.ets // index.ets
@Entry @Entry
@Component @Component
struct PageTransitionExample { struct PageTransitionExample {
@State scale1: number = 1 @State scale1: number = 1
@State opacity1: number = 1 @State opacity1: number = 1
@State active: boolean = false
build() { build() {
Column() { Column() {
Navigator({ target: 'pages/page1', type: NavigationType.Push }) { Navigator({ target: 'pages/page1', type: NavigationType.Push }) {
Image($r('app.media.bg1')).width("100%").height("100%") Image($r('app.media.bg1')).width("100%").height("100%")
} }
.onClick(() => {
this.active = true
})
}.scale({ x: this.scale1 }).opacity(this.opacity1) }.scale({ x: this.scale1 }).opacity(this.opacity1)
} }
...@@ -163,23 +156,19 @@ struct PageTransitionExample { ...@@ -163,23 +156,19 @@ struct PageTransitionExample {
} }
``` ```
``` ```ts
// page1.ets // page1.ets
@Entry @Entry
@Component @Component
struct PageTransitionExample1 { struct PageTransitionExample1 {
@State scale2: number = 1 @State scale2: number = 1
@State opacity2: number = 1 @State opacity2: number = 1
@State active: boolean = false
build() { build() {
Column() { Column() {
Navigator({ target: 'pages/index', type: NavigationType.Push }) { Navigator({ target: 'pages/index', type: NavigationType.Push }) {
Image($r('app.media.bg2')).width ("100%").height("100%") Image($r('app.media.bg2')).width ("100%").height("100%")
} }
.onClick(() => {
this.active = true
})
}.scale({ x: this.scale2 }).opacity(this.opacity2) }.scale({ x: this.scale2 }).opacity(this.opacity2)
} }
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册