Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
OpenHarmony
Docs
提交
216f783d
D
Docs
项目概览
OpenHarmony
/
Docs
接近 2 年 前同步成功
通知
159
Star
292
Fork
28
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
D
Docs
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
未验证
提交
216f783d
编写于
10月 28, 2022
作者:
L
luoying_ace
提交者:
Gitee
10月 28, 2022
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
update zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md.
Signed-off-by:
N
luoying_ace
<
luoying19@huawei.com
>
上级
3eee8fa1
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
6 addition
and
5 deletion
+6
-5
zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md
...cation-dev/reference/arkui-ts/ts-motion-path-animation.md
+6
-5
未找到文件。
zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md
浏览文件 @
216f783d
...
@@ -3,6 +3,7 @@
...
@@ -3,6 +3,7 @@
设置组件进行位移动画时的运动路径。
设置组件进行位移动画时的运动路径。
> **说明:**
> **说明:**
>
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
...
@@ -10,7 +11,7 @@
...
@@ -10,7 +11,7 @@
| 名称 | 参数类型 | 默认值 | 描述 |
| 名称 | 参数类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| -------- | -------- | -------- | -------- |
| motionPath | {
<br/>
path:
string,
<br/>
from?:
number,
<br/>
to?:
number,
<br/>
rotatable?:
boolean
<br/>
}
<br/>
**说明:**
<br/>
path中支持
通过start和end进行起点和终点的替代,如:
<br/>
'Mstart.x
start.y
L50
50
Lend.x
end.y
Z'| {
<br/>
""
,
<br/>
0.0,
<br/>
1.0,
<br/>
false
<br/>
} | 设置组件的运动路径,入参说明如下:
<br/>
-
path:位移动画的运动路径,使用svg路径字符串。
<br/>
-
from:运动路径的起点,默认为0.0。
<br/>
-
to:运动路径的终点,默认为1.0。
<br/>
-
rotatable:是否跟随路径进行旋转。 |
| motionPath | {
<br/>
path:
string,
<br/>
from?:
number,
<br/>
to?:
number,
<br/>
rotatable?:
boolean
<br/>
}
<br/>
**说明:**
<br/>
path中支持
使用start和end进行起点和终点的替代,如:
<br/>
'Mstart.x
start.y
L50
50
Lend.x
end.y
Z'| {
<br/>
''
,
<br/>
0.0,
<br/>
1.0,
<br/>
false
<br/>
} | 设置组件的运动路径,入参说明如下:
<br/>
-
path:位移动画的运动路径,使用svg路径字符串。
<br/>
-
from:运动路径的起点,默认为0.0。
<br/>
-
to:运动路径的终点,默认为1.0。
<br/>
-
rotatable:是否跟随路径进行旋转。 |
## 示例
## 示例
...
@@ -25,13 +26,13 @@ struct MotionPathExample {
...
@@ -25,13 +26,13 @@ struct MotionPathExample {
build
()
{
build
()
{
Column
()
{
Column
()
{
Button
(
'
click me
'
)
Button
(
'
click me
'
)
// 执行动画:从起点
滑到(300,200),再到(300,500),再到终点。
// 执行动画:从起点
移动到(300,200),再到(300,500),再到终点
.
motionPath
({
path
:
'
Mstart.x start.y L300 200 L300 500 Lend.x end.y
'
,
from
:
0.0
,
to
:
1.0
,
rotatable
:
true
})
.
motionPath
({
path
:
'
Mstart.x start.y L300 200 L300 500 Lend.x end.y
'
,
from
:
0.0
,
to
:
1.0
,
rotatable
:
true
})
.
onClick
((
event
:
ClickEvent
)
=>
{
.
onClick
(()
=>
{
animateTo
({
duration
:
4000
,
curve
:
Curve
.
Linear
},
()
=>
{
animateTo
({
duration
:
4000
,
curve
:
Curve
.
Linear
},
()
=>
{
this
.
toggle
=
!
this
.
toggle
;
this
.
toggle
=
!
this
.
toggle
// 通过this.toggle变化组件的位置
})
})
})
.
backgroundColor
(
0x317aff
)
})
}.
width
(
'
100%
'
).
height
(
'
100%
'
).
alignItems
(
this
.
toggle
?
HorizontalAlign
.
Start
:
HorizontalAlign
.
Center
)
}.
width
(
'
100%
'
).
height
(
'
100%
'
).
alignItems
(
this
.
toggle
?
HorizontalAlign
.
Start
:
HorizontalAlign
.
Center
)
}
}
}
}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录