@Entry
@Component
struct Shouye {
@State message: string = 'Hello'
@State toggle: boolean = true
onPageShow (): void {
animateTo ( {
duration: 3000,
iterations: -1,
curve:Curve.Linear
}, () => {
this.toggle = !this.toggle
} )
}
build () {
Row () {
Column () {
Text ( this.message )
.fontSize ( 50 )
.fontWeight ( FontWeight.Bold )
.motionPath({ path: 'Mstart.x start.y L300 1000 L300 500 L300 800 L300 1000 Lend.x end.y', from: 0.0, to: 1.0, rotatable: true })
}
.width('100%').height('100%').alignItems(this.toggle ? HorizontalAlign.Start : HorizontalAlign.Center)
}
.height ( '100%' )
}
}参考
名称 |
参数 |
描述 |
|---|---|---|
motionPath |
{ path: string, from?: number, to?: number, rotatable?: boolean } |
设置组件的运动路径。 - path：位移动画的运动路径，使用svg路径字符串。path中支持使用start和end进行起点和终点的替代，如：'Mstart.x start.y L50 50 Lend.x end.y Z'，更多说明请参考。 - from：运动路径的起点。 取值范围：[0, 1] - to：运动路径的终点。 取值范围：[0, 1] - rotatable：是否跟随路径进行旋转。 |
HorizontalAlign
名称 |
描述 |
|---|---|
Start |
按照语言方向起始端对齐。 |
Center |
居中对齐，默认对齐方式。 |
End |
按照语言方向末端对齐。 |
学习交流
点击下方名片，拉您
