Skip to content

D
Docs

Tonvia / Docs
与 Fork 源项目一致

Fork自 OpenHarmony / Docs

通知 1
Star 0
Fork 0
D
Docs

体验新版 GitCode，发现更多精彩内容 >>

未验证 提交 07ad39ec 编写于 作者: O openharmony_ci 提交者： Gitee
浏览文件
操作

!11547 修改routeType枚举值描述 

Merge pull request !11547 from 田雨/master
上级 bbc278c1 3bad8efb
显示空白变更内容
内联 并排
Showing with 207 addition and 117 deletion
zh-cn/application-dev/reference/arkui-js/js-components-basic-select.md
浏览文件 @ 07ad39ec
......@@ -49,15 +49,9 @@
```html
<!-- xxx.hml -->
<div class="container">
<select @change="changeFruit">
<option value="bananaValue">
Banana
</option>
<option value="appleValue" selected="true">
Apple
</option>
<option value="pearValue">
Pear
<select @change="onChange">
<option for="{{ array }}" value="{{ $item.value }}">
{{ $item.name }}
</option>
</select>
</div>
......@@ -69,16 +63,51 @@
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
```
```js
// ×××.js
// xxx.js
export default {
changeFruit(e){
console.log("newValue:" + e.newValue)
data: {
array: [
{
"value": "下拉选项0", "name": "选项0"
},
{
"value": "下拉选项1", "name": "选项1"
},
{
"value": "下拉选项2", "name": "选项2"
},
{
"value": "下拉选项3", "name": "选项3"
},
]
},
getData() {
let other = [
{
"value": "下拉选项a", "name": "选项a"
},
{
"value": "下拉选项b", "name": "选项b"
},
{
"value": "下拉选项c", "name": "选项c"
},
{
"value": "下拉选项d", "name": "选项d"
},
]
return other
},
onChange() {
this.array = this.getData()
}
}
```
![zh-cn_image_0000001152588538](figures/zh-cn_image_0000001152588538.png)
\ No newline at end of file
![zh-cn_image_0000001152588538](figures/zh-cn_image_0000001152588538.gif)
\ No newline at end of file
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md
浏览文件 @ 07ad39ec
......@@ -349,3 +349,57 @@ struct ImageExample3 {
```
![zh-cn_image_0000001205972610](figures/zh-cn_image_0000001205972610.gif)
### 渲染沙箱路径图片
```ts
import fileio from '@ohos.fileio'
import context from '@ohos.application.context'
@Entry
@Component
struct LoadImageExample {
@State resourcesPath: string = ''
@State sandboxPath: string = ''
context: context.AbilityContext
aboutToAppear() {
this.context = getContext(this) as context.AbilityContext
}
build() {
Column() {
Button('读取沙箱图片')
.margin({ bottom: 10, top: 10 })
.onClick(() => {
this.sandboxPath = this.context.getApplicationContext().filesDir + '/icon.png'
console.log(`读取沙箱图片=========>${this.sandboxPath}`)
let fd = fileio.openSync(this.sandboxPath, 0o100, 0o666)
console.log(`create file========>${fd}`)
let srcPath = this.context.bundleCodeDir + '/entry/resources/base/media/icon.png'
console.log('mySrcpath' + srcPath)
fileio.copyFileSync(srcPath, this.sandboxPath) // 复制图片到沙箱路径
this.sandboxPath = 'file://' + this.context.getApplicationContext().filesDir + '/icon.png'
})
Button('读取资源图片')
.margin({ bottom: 10 })
.onClick(() => {
this.resourcesPath = 'file://' + this.context.bundleCodeDir + '/entry/resources/base/media/icon.png'
})
Text(`资源图片路径:${this.resourcesPath}`)
.fontSize(20)
.margin({ bottom: 10 })
Image(this.resourcesPath)
.width(100)
.height(100)
Text(`沙箱图片路径:${this.sandboxPath}`)
.fontSize(20)
.margin({ bottom: 10 })
Image(this.sandboxPath)
.width(100)
.height(100)
}
.width('100%').height('100%')
}
}
```
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-richtext.md
浏览文件 @ 07ad39ec
......@@ -39,6 +39,7 @@ RichText(content:string)
| \<p>\</p> | 定义段落。 | \<p>这是一个段落\</p> |
| \<br/> | 插入一个简单的换行符。 | \<p>这是一个段落\<br/>这是换行段落\</p> |
| \<hr/> | 定义HTML页面中的主题变化（比如话题的转移），并显示为一条水平线。 | \<p>这个一个段落\</p>\<hr/>\<p>这是一个段落\</p> |
| \<image>\</image> | 用来定义图片。 | \<image src="file:///data/storage/el1/bundle/entry/resources/rawfile/icon.png">\</image> |
| \<div>\</div> | 常用于组合块级元素，以便通过CSS来对这些元素进行格式化。 | \<div style='color:#0000FF'>\<h3>这是一个在div元素中的标题。\</h3>\</div> |
| \<i>\</i> | 定义与文本中其余部分不同的部分，并把这部分文本呈现为斜体文本。 | \<i>这是一个斜体\</i> |
| \<u>\</u> | 定义与常规文本风格不同的文本，像拼写错误的单词或者汉语中的专有名词，应尽量避免使用\<u>为文本加下划线，用户会把它混淆为一个超链接。 | \<p>\<u>这是带有下划线的段落\</u>\</p> |
......
zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-lottie.md
浏览文件 @ 07ad39ec
......@@ -31,15 +31,15 @@ path: string, container: object, render: string, loop: boolean, autoplay: boolea
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| -------------- | --------------------------- | ---- | ---------------------------------------- |
| path | string | 是 | hap包内动画资源文件路径，仅支持json格式。示例：path:&nbsp;"common/lottie/data.json" |
| container | object | 是 | canvas绘图上下文，声明范式需提前声明CanvasRenderingContext2D。 |
| render | string | 是 | 渲染类型，仅支持“canvas”。 |
| loop | boolean&nbsp;\|&nbsp;number | 否 | 动画播放结束后，是否循环播放，默认值true。值类型为number，且大于等于1时为设置的重复播放的次数。 |
| autoplay | boolean | 否 | 是否自动播放动画，默认值true。 |
| name | string | 否 | 开发者自定义的动画名称，后续支持通过该名称引用控制动画，默认为空。 |
| initialSegment | [number,&nbsp;number] | 否 | 指定动画播放的起始帧号，指定动画播放的结束帧号。 |
| 参数 | 类型 | 必填 | 描述 |
| -------------- | --------------------------- | ---- | ---------------------------------------- |
| path | string | 是 | hap包内动画资源文件路径，仅支持json格式。示例：path:&nbsp;"common/lottie/data.json" |
| container | object | 是 | canvas绘图上下文，声明范式需提前声明CanvasRenderingContext2D。 |
| render | string | 是 | 渲染类型，仅支持“canvas”。 |
| loop | boolean&nbsp;\|&nbsp;number | 否 | 动画播放结束后，是否循环播放，默认值true。值类型为number，且大于等于1时为设置的重复播放的次数。 |
| autoplay | boolean | 否 | 是否自动播放动画，默认值true。 |
| name | string | 否 | 开发者自定义的动画名称，后续支持通过该名称引用控制动画，默认为空。 |
| initialSegment | [number,&nbsp;number] | 否 | 指定动画播放的起始帧号，指定动画播放的结束帧号。 |
## lottie.destroy
......@@ -50,9 +50,9 @@ destroy(name: string): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | ---------------------------------------- |
| name | string | 是 | 被指定的动画名，同loadAnimation接口参数name,&nbsp;缺省时销毁所有动画。 |
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | ---------------------------------------- |
| name | string | 是 | 被指定的动画名，同loadAnimation接口参数name,&nbsp;缺省时销毁所有动画。 |
**示例：**
```ts
......@@ -78,7 +78,7 @@ destroy(name: string): void
.width('30%')
.height('20%')
.backgroundColor('#0D9FFB')
.onAppear(() => {
.onReady(() => {
console.log('canvas onAppear');
this.animateItem = lottie.loadAnimation({
container: this.controller,
......@@ -131,9 +131,9 @@ play(name: string): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | ---------------------------------------- |
| name | string | 是 | 被指定的动画名,&nbsp;同loadAnimation接口参数name，缺省时播放所有动画。 |
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | ---------------------------------------- |
| name | string | 是 | 被指定的动画名,&nbsp;同loadAnimation接口参数name，缺省时播放所有动画。 |
**示例：**
......@@ -150,9 +150,9 @@ pause(name: string): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | ---------------------------------------- |
| name | string | 是 | 被指定的动画名，同loadAnimation接口入参name，缺省时暂停所有动画。 |
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | ---------------------------------------- |
| name | string | 是 | 被指定的动画名，同loadAnimation接口入参name，缺省时暂停所有动画。 |
**示例：**
......@@ -169,9 +169,9 @@ togglePause(name: string): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | ---------------------------------------- |
| name | string | 是 | 被指定的动画名，同loadAnimation接口参数name，缺省时停止所有动画。 |
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | ---------------------------------------- |
| name | string | 是 | 被指定的动画名，同loadAnimation接口参数name，缺省时停止所有动画。 |
**示例：**
......@@ -188,9 +188,9 @@ stop(name: string): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | ---------------------------------------- |
| name | string | 是 | 被指定的动画名，同loadAnimation接口参数name，缺省时停止所有动画。 |
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | ---------------------------------------- |
| name | string | 是 | 被指定的动画名，同loadAnimation接口参数name，缺省时停止所有动画。 |
**示例：**
......@@ -207,10 +207,10 @@ setSpeed(speed: number, name: string): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ----- | ------ | ---- | ---------------------------------------- |
| speed | number | 是 | 值为浮点类型,&nbsp;speed&gt;0正向播放,&nbsp;speed&lt;0反向播放,&nbsp;speed=0暂停播放,&nbsp;speed=1.0/-1.0正常速度播放。 |
| name | string | 是 | 被指定的动画，同loadAnimation接口参数name，缺省时停止所有动画。 |
| 参数 | 类型 | 必填 | 描述 |
| ----- | ------ | ---- | ---------------------------------------- |
| speed | number | 是 | 值为浮点类型,&nbsp;speed&gt;0正向播放,&nbsp;speed&lt;0反向播放,&nbsp;speed=0暂停播放,&nbsp;speed=1.0/-1.0正常速度播放。 |
| name | string | 是 | 被指定的动画，同loadAnimation接口参数name，缺省时停止所有动画。 |
**示例：**
......@@ -227,10 +227,10 @@ setDirection(direction: AnimationDirection, name: string): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| --------- | ------------------ | ---- | ---------------------------------------- |
| direction | AnimationDirection | 是 | 1为正向，-1为反向;&nbsp;当设置为反向时，从当前播放进度开始回播直到首帧，loop值为true时可无限倒放；speed&lt;0叠加时也是倒放。<br/>AnimationDirection：1&nbsp;\|&nbsp;-1 |
| name | string | 是 | 被指定的动画名，同loadAnimation接口参数name，缺省时设置所有动画方向。 |
| 参数 | 类型 | 必填 | 描述 |
| --------- | ------------------ | ---- | ---------------------------------------- |
| direction | AnimationDirection | 是 | 1为正向，-1为反向;&nbsp;当设置为反向时，从当前播放进度开始回播直到首帧，loop值为true时可无限倒放；speed&lt;0叠加时也是倒放。<br/>AnimationDirection：1&nbsp;\|&nbsp;-1 |
| name | string | 是 | 被指定的动画名，同loadAnimation接口参数name，缺省时设置所有动画方向。 |
**示例：**
......@@ -275,9 +275,9 @@ play(name?: string): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | --------------- |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | --------------- |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
**示例：**
......@@ -294,9 +294,9 @@ destroy(name?: string): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | --------------- |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | --------------- |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
**示例：**
......@@ -313,9 +313,9 @@ pause(name?: string): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | --------------- |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | --------------- |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
**示例：**
......@@ -332,9 +332,9 @@ togglePause(name?: string): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | --------------- |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | --------------- |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
**示例：**
......@@ -351,9 +351,9 @@ stop(name?: string): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | --------------- |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------ | ---- | --------------- |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
**示例：**
......@@ -370,9 +370,9 @@ setSpeed(speed: number): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ----- | ------ | ---- | ---------------------------------------- |
| speed | number | 是 | 值为浮点类型,&nbsp;speed&gt;0正向播放,&nbsp;speed&lt;0反向播放,&nbsp;speed=0暂停播放,&nbsp;speed=1.0&nbsp;\|&nbsp;-1.0正常速度播放。 |
| 参数 | 类型 | 必填 | 描述 |
| ----- | ------ | ---- | ---------------------------------------- |
| speed | number | 是 | 值为浮点类型,&nbsp;speed&gt;0正向播放,&nbsp;speed&lt;0反向播放,&nbsp;speed=0暂停播放,&nbsp;speed=1.0&nbsp;\|&nbsp;-1.0正常速度播放。 |
**示例：**
......@@ -389,9 +389,9 @@ setDirection(direction: AnimationDirection): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| --------- | ------------------ | ---- | ---------------------------------------- |
| direction | AnimationDirection | 是 | 1为正向，-1为反向;&nbsp;当设置为反向时，从当前播放进度开始回播直到首帧，loop值为true时可无限倒放；speed&lt;0叠加时也是倒放。<br/>AnimationDirection：1&nbsp;\|&nbsp;-1。 |
| 参数 | 类型 | 必填 | 描述 |
| --------- | ------------------ | ---- | ---------------------------------------- |
| direction | AnimationDirection | 是 | 1为正向，-1为反向;&nbsp;当设置为反向时，从当前播放进度开始回播直到首帧，loop值为true时可无限倒放；speed&lt;0叠加时也是倒放。<br/>AnimationDirection：1&nbsp;\|&nbsp;-1。 |
**示例：**
......@@ -408,11 +408,11 @@ goToAndStop(value: number, isFrame?: boolean): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ------- | ------- | ---- | ---------------------------------------- |
| value | number | 是 | 帧号(值大于等于0)或时间进度(ms)。 |
| isFrame | boolean | 否 | true:&nbsp;按指定帧控制，false:按指定时间控制，缺省默认false。 |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
| 参数 | 类型 | 必填 | 描述 |
| ------- | ------- | ---- | ---------------------------------------- |
| value | number | 是 | 帧号(值大于等于0)或时间进度(ms)。 |
| isFrame | boolean | 否 | true:&nbsp;按指定帧控制，false:按指定时间控制，缺省默认false。 |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
**示例：**
......@@ -432,11 +432,11 @@ goToAndPlay(value: number, isFrame: boolean, name?: string): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ------- | ------- | ---- | ---------------------------------------- |
| value | number | 是 | 帧号(值大于等于0)或时间进度(ms) |
| isFrame | boolean | 是 | true：按指定帧控制，&nbsp;false：按指定时间控制，缺省默认false。 |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
| 参数 | 类型 | 必填 | 描述 |
| ------- | ------- | ---- | ---------------------------------------- |
| value | number | 是 | 帧号(值大于等于0)或时间进度(ms) |
| isFrame | boolean | 是 | true：按指定帧控制，&nbsp;false：按指定时间控制，缺省默认false。 |
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
**示例：**
......@@ -456,10 +456,10 @@ playSegments(segments: AnimationSegment | AnimationSegment[], forceFlag: boolean
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| --------- | ---------------------------------------- | ---- | ---------------------------------------- |
| segments | AnimationSegment&nbsp;=&nbsp;[number,&nbsp;number]&nbsp;\|&nbsp;AnimationSegment[] | 是 | 片段或片段列表；<br/>如果片段列表全部播放完毕后，下轮循环播放仅播放最后一个片段 |
| forceFlag | boolean | 是 | true：即时生效播放，false：延迟到下轮循环播放再生效 |
| 参数 | 类型 | 必填 | 描述 |
| --------- | ---------------------------------------- | ---- | ---------------------------------------- |
| segments | AnimationSegment&nbsp;=&nbsp;[number,&nbsp;number]&nbsp;\|&nbsp;AnimationSegment[] | 是 | 片段或片段列表；<br/>如果片段列表全部播放完毕后，下轮循环播放仅播放最后一个片段 |
| forceFlag | boolean | 是 | true：即时生效播放，false：延迟到下轮循环播放再生效 |
**示例：**
......@@ -479,9 +479,9 @@ resetSegments(forceFlag: boolean): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| --------- | ------- | ---- | ------------------------------ |
| forceFlag | boolean | 是 | true：即时生效播放，false：延迟到下轮循环播放再生效 |
| 参数 | 类型 | 必填 | 描述 |
| --------- | ------- | ---- | ------------------------------ |
| forceFlag | boolean | 是 | true：即时生效播放，false：延迟到下轮循环播放再生效 |
**示例：**
......@@ -511,9 +511,9 @@ setSubframe(useSubFrame: boolean): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ------------ | ------- | ---- | ---------------------------------------- |
| useSubFrames | boolean | 是 | currentFrame属性默认显示浮点数，该接口参数将影响currentFrame属性的精度。<br/>true：属性currentFrame显示浮点。<br/>false：属性currentFrame去浮点数显示整数。 |
| 参数 | 类型 | 必填 | 描述 |
| ------------ | ------- | ---- | ---------------------------------------- |
| useSubFrames | boolean | 是 | currentFrame属性默认显示浮点数，该接口参数将影响currentFrame属性的精度。<br/>true：属性currentFrame显示浮点。<br/>false：属性currentFrame去浮点数显示整数。 |
**示例：**
......@@ -530,9 +530,9 @@ getDuration(inFrames?: boolean): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| -------- | ------- | ---- | ---------------------------------------- |
| inFrames | boolean | 否 | true：获取帧数，&nbsp;false：获取时间(单位ms)，缺省默认false。 |
| 参数 | 类型 | 必填 | 描述 |
| -------- | ------- | ---- | ---------------------------------------- |
| inFrames | boolean | 否 | true：获取帧数，&nbsp;false：获取时间(单位ms)，缺省默认false。 |
**示例：**
......@@ -549,10 +549,10 @@ addEventListener&lt;T = any&gt;(name: AnimationEventName, callback: AnimationEve
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| -------- | ------------------------------- | ---- | ---------------------------------------- |
| name | AnimationEventName | 是 | 指定动画事件类型，Lottie内置动画事件类型AnimationEventName：<br/>'enterFrame'、'loopComplete'、'complete'、'segmentStart'、'destroy'、'config_ready'、'data_ready'、'DOMLoaded'、'error'、'data_failed'、'loaded_images' |
| callback | AnimationEventCallback&lt;T&gt; | 是 | 用户自定义回调函数 |
| 参数 | 类型 | 必填 | 描述 |
| -------- | ------------------------------- | ---- | ---------------------------------------- |
| name | AnimationEventName | 是 | 指定动画事件类型，Lottie内置动画事件类型AnimationEventName：<br/>'enterFrame'、'loopComplete'、'complete'、'segmentStart'、'destroy'、'config_ready'、'data_ready'、'DOMLoaded'、'error'、'data_failed'、'loaded_images' |
| callback | AnimationEventCallback&lt;T&gt; | 是 | 用户自定义回调函数 |
**示例：**
......@@ -575,10 +575,10 @@ removeEventListener&lt;T = any&gt;(name: AnimationEventName, callback?: Animatio
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| -------- | ------------------------------- | ---- | ---------------------------------------- |
| name | AnimationEventName | 是 | 指定动画事件类型，Lottie内置动画事件类型AnimationEventName：<br/>'enterFrame'、'loopComplete'、'complete'、'segmentStart'、'destroy'、'config_ready'、'data_ready'、'DOMLoaded'、'error'、'data_failed'、'loaded_images' |
| callback | AnimationEventCallback&lt;T&gt; | 否 | 用户自定义回调函数；缺省为空时，删除此事件的所有回调函数。 |
| 参数 | 类型 | 必填 | 描述 |
| -------- | ------------------------------- | ---- | ---------------------------------------- |
| name | AnimationEventName | 是 | 指定动画事件类型，Lottie内置动画事件类型AnimationEventName：<br/>'enterFrame'、'loopComplete'、'complete'、'segmentStart'、'destroy'、'config_ready'、'data_ready'、'DOMLoaded'、'error'、'data_failed'、'loaded_images' |
| callback | AnimationEventCallback&lt;T&gt; | 否 | 用户自定义回调函数；缺省为空时，删除此事件的所有回调函数。 |
**示例：**
......@@ -595,10 +595,10 @@ triggerEvent&lt;T = any&gt;(name: AnimationEventName, args: T): void
**参数：**
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------------------ | ---- | --------- |
| name | AnimationEventName | 是 | 指定动画事件类型 |
| args | any | 是 | 用户自定义回调参数 |
| 参数 | 类型 | 必填 | 描述 |
| ---- | ------------------ | ---- | --------- |
| name | AnimationEventName | 是 | 指定动画事件类型 |
| args | any | 是 | 用户自定义回调参数 |
**示例：**
......
zh-cn/application-dev/reference/arkui-ts/ts-container-grid.md
浏览文件 @ 07ad39ec
......@@ -66,7 +66,7 @@ Grid只展示固定行列数的元素，其余元素不展示，且Grid不可滚
## GridDirection<sup>8+</sup>枚举说明
| 名称 | 描述 |
| ------ | -------------------------------------- |
| ------ | -------------------------------------- |
| Row | 主轴布局方向沿水平方向布局，即自左往右先填满一行，再去填下一行。 |
| Column | 主轴布局方向沿垂直方向布局，即自上往下先填满一列，再去填下一列。 |
| RowReverse | 主轴布局方向沿水平方向反向布局，即自右往左先填满一行，再去填下一行。 |
......@@ -100,6 +100,7 @@ Grid只展示固定行列数的元素，其余元素不展示，且Grid不可滚
@Component
struct GridExample {
@State Number: String[] = ['0', '1', '2', '3', '4']
scroller: Scroller = new Scroller()
build() {
Column({ space: 5 }) {
......@@ -126,7 +127,7 @@ struct GridExample {
.height(300)
Text('scroll').fontColor(0xCCCCCC).fontSize(9).width('90%')
Grid() {
Grid(this.scroller) {
ForEach(this.Number, (day: string) => {
ForEach(this.Number, (day: string) => {
GridItem() {
......@@ -149,6 +150,10 @@ struct GridExample {
.width('90%')
.backgroundColor(0xFAEEE0)
.height(300)
Button('next page')
.onClick(() => { // 点击后滑到下一页
this.scroller.scrollPage({ next: true })
})
}.width('100%').margin({ top: 5 })
}
}
......
zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md
浏览文件 @ 07ad39ec
......@@ -11,7 +11,7 @@
| 名称 | 参数类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| motionPath | {<br/>path:&nbsp;string,<br/>from?:&nbsp;number,<br/>to?:&nbsp;number,<br/>rotatable?:&nbsp;boolean<br/>}<br/>**说明：**<br/>path中支持使用start和end进行起点和终点的替代，如：<br/>'Mstart.x&nbsp;start.y&nbsp;L50&nbsp;50&nbsp;Lend.x&nbsp;end.y&nbsp;Z'| {<br/>'',<br/>0.0,<br/>1.0,<br/>false<br/>} | 设置组件的运动路径，入参说明如下：<br/>-&nbsp;path：位移动画的运动路径，使用svg路径字符串。<br/>-&nbsp;from：运动路径的起点，默认为0.0。<br/>-&nbsp;to：运动路径的终点，默认为1.0。<br/>-&nbsp;rotatable：是否跟随路径进行旋转。 |
| motionPath | {<br/>path:&nbsp;string,<br/>from?:&nbsp;number,<br/>to?:&nbsp;number,<br/>rotatable?:&nbsp;boolean<br/>}<br/>**说明：**<br/>path中支持使用start和end进行起点和终点的替代，如：<br/>'Mstart.x&nbsp;start.y&nbsp;L50&nbsp;50&nbsp;Lend.x&nbsp;end.y&nbsp;Z'，更多说明请参考[绘制路径](../../ui/ui-js-components-svg-path.md)。 | {<br/>'',<br/>0.0,<br/>1.0,<br/>false<br/>} | 设置组件的运动路径，入参说明如下：<br/>-&nbsp;path：位移动画的运动路径，使用svg路径字符串。<br/>-&nbsp;from：运动路径的起点，默认为0.0。<br/>-&nbsp;to：运动路径的终点，默认为1.0。<br/>-&nbsp;rotatable：是否跟随路径进行旋转。 |
## 示例
......
zh-cn/application-dev/reference/arkui-ts/ts-page-transition-animation.md
浏览文件 @ 07ad39ec
......@@ -5,20 +5,21 @@
> **说明：**
>
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
>
| 名称 | 参数 | 参数描述 |
| ------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ |
| PageTransitionEnter | {<br/>type: RouteType,<br/>duration: number,<br/>curve: [Curve](ts-appendix-enums.md#curve)&nbsp;\|&nbsp;string,<br>delay: number<br/>} | 设置当前页面的自定义入场动效。<br/>-&nbsp;type：不配置时表明pop为push时效果的逆播。<br/>-&nbsp;duration：动画的时长，单位为毫秒。<br/>-&nbsp;curve：动画曲线。string类型的取值支持"ease"、"ease-in"、"ease-out"、"ease-in-out"、"extreme-deceleration"、"fast-out-linear-in"、"fast-out-slow-in"、"friction"、"linear"、"linear-out-slow-in"、"rhythm"、"sharp"、"smooth"。<br/>&nbsp;默认值：Curve.Linear<br/>-&nbsp;delay：动画延迟时长，单位为毫秒，默认不延迟播放。 |
| PageTransitionExit | {<br/>type: RouteType,<br/>duration: number,<br/>curve: [Curve](ts-appendix-enums.md#curve)&nbsp;\|&nbsp;string,<br/>delay: number<br/>} | 设置当前页面的自定义退场动效。<br/>-&nbsp;type：不配置时表明pop为push时效果的逆播<br/>-&nbsp;duration：动画的时长，单位为毫秒。<br/>-&nbsp;curve：动画曲线，string类型取值与PageTransitionEnter相同。<br/>&nbsp;默认值：Curve.Linear<br/>-&nbsp;delay：动画延迟时长，单位为毫秒，默认不延迟播放。 |
| PageTransitionEnter | {<br/>type?: RouteType,<br/>duration?: number,<br/>curve?: [Curve](ts-appendix-enums.md#curve)&nbsp;\|&nbsp;string,<br>delay?: number<br/>} | 设置当前页面的自定义入场动效。<br/>-&nbsp;type：页面转场效果生效的路由类型。<br/>默认值：RouteType.None。<br/>**说明：**没有匹配时使用系统默认的页面转场效果(根据设备可能会有差异)，如需禁用系统默认页面转场效果，可以指定duration为0。<br/>-&nbsp;duration：动画的时长，单位为毫秒。<br/>-&nbsp;curve：动画曲线。string类型的取值支持"ease"、"ease-in"、"ease-out"、"ease-in-out"、"extreme-deceleration"、"fast-out-linear-in"、"fast-out-slow-in"、"friction"、"linear"、"linear-out-slow-in"、"rhythm"、"sharp"、"smooth"。<br/>默认值：Curve.Linear<br/>-&nbsp;delay：动画延迟时长，单位为毫秒，默认不延迟播放。 |
| PageTransitionExit | {<br/>type?: RouteType,<br/>duration?: number,<br/>curve?: [Curve](ts-appendix-enums.md#curve)&nbsp;\|&nbsp;string,<br/>delay?: number<br/>} | 设置当前页面的自定义退场动效。<br/>-&nbsp;type：页面转场效果生效的路由类型。<br/>默认值：RouteType.None。<br/>**说明：**没有匹配时使用系统默认的页面转场效果(根据设备可能会有差异)，如需禁用系统默认页面转场效果，可以指定duration为0。<br/>-&nbsp;duration：动画的时长，单位为毫秒。<br/>-&nbsp;curve：动画曲线，string类型取值与PageTransitionEnter相同。<br/>&nbsp;默认值：Curve.Linear<br/>-&nbsp;delay：动画延迟时长，单位为毫秒，默认不延迟播放。 |
## RouteType枚举说明
| 名称 | 描述 |
| ---- | ------------------------------------------------------------ |
| Pop | 重定向指定页面。PageA跳转到PageB时，PageA为Exit+Push，PageB为Enter+Push。 |
| Push | 跳转到下一页面。PageB返回至PageA时，PageA为Enter+Pop，PageB为Exit+Pop。 |
| None | 页面未重定向。 |
| Pop | 重定向指定页面。从PageB回退到之前的页面PageA。对于PageB，指定RouteType为None或者Pop的PageTransitionExit组件样式生效，对于PageA，指定RouteType为None或者Pop的PageTransitionEnter组件样式生效。 |
| Push | 跳转到下一页面。PageA跳转到下一个新的界面PageB。对于PageA，指定RouteType为None或者Push的PageTransitionExit组件样式生效，对于PageB，指定RouteType为None或者Push的PageTransitionEnter组件样式生效。 |
| None | 页面未重定向。如Push和Pop描述中RouteType为None的情形，即页面进场时PageTransitionEnter的转场效果生效；退场时PageTransitionExit的转场效果生效。 |
## 属性
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-focus.md
浏览文件 @ 07ad39ec
......@@ -11,7 +11,7 @@
| **名称** | **参数类型** | **描述** |
| -------------------- | -------- | ---------------------------------------- |
| focusable | boolean | 设置当前组件是否可以获焦。<br/>**说明：**<br/>存在默认交互逻辑的组件例如Button、TextInput等，默认即为可获焦，Text、Image等组件则默认状态为不可获焦。 |
| focusable | boolean | 设置当前组件是否可以获焦。<br/>**说明：**<br/>存在默认交互逻辑的组件例如Button、TextInput等，默认即为可获焦，Text、Image等组件则默认状态为不可获焦。不可获焦状态下，无法触发[焦点事件](ts-universal-focus-event.md)。 |
| tabIndex<sup>9+<sup> | number | 自定义组件tab键走焦能力，走焦顺序为：tabIndex大于0的组件依次递增走焦, tabIndex等于0的组件按组件树先后顺序走焦。<br />- tabIndex >= 0：表示元素是可聚焦的，并且可以通过tab键走焦来访问到该元素，tabIndex值越小，则优先获焦；反之，则后获焦。如果多个元素拥有相同的tabIndex，按照元素在当前组件树中的先后顺序获焦<br />- tabIndex < 0（通常是tabIndex = -1）：表示元素是可聚焦的，但是不能通过tab键走焦来访问到该元素。<br/>默认值：0 |
| defaultFocus<sup>9+<sup> | boolean | 设置当前组件是否为当前页面上的默认焦点，仅在初次创建的页面第一次进入时生效。<br/>默认值：false |
| groupDefaultFocus<sup>9+<sup> | boolean | 设置当前组件是否为当前组件所在容器获焦时的默认焦点，仅在初次创建容器节点第一次获焦时生效。<br/>默认值：false<br/>**说明：** 必须与tabIndex联合使用，当某个容器设置了tabIndex，且容器内某子组件设置了groupDefaultFocus，当该容器首次获焦时，会自动将焦点转移至该组件上。<br/> |
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或