先来看看错的
@Entry
@Component
struct an {@State a : number = 0;@State ang : number = 0;build() {Row(){Text('^_^').fontSize(90).position({x : 0,y : this.a}).rotate({angle : this.ang,centerX : '50%',centerY : '50%'}).onClick(() => {this.a += 100;}).animation({duration : 500})}.height('100%').width('100%')}
}
我添加了动画,可是效果呢?
很显然没有任何动画效果
首先排除电脑本身的问题(其实很有可能,作者的电脑配置很低)
那到底是哪里出错了呢?
在我的反复尝试下,我发现只要给Text加上宽和高就行了,注意是都要加,一个都不能少
再来看看对的
@Entry
@Component
struct an {@State a : number = 0;@State ang : number = 0;build() {Row(){Text('^_^').height(100).width(200).fontSize(90).position({x : 0,y : this.a}).rotate({angle : this.ang,centerX : '50%',centerY : '50%'}).onClick(() => {this.a += 100;}).animation({duration : 500})}.height('100%').width('100%')}
}
看看效果如何
哈哈,成功出现了
还有就是要注意外面套一个容器,具体原因不是很清楚,但是可能是这个动画需要这个东西在一个容器里面进行吧,并且需要获取它的固定大小,如果不定义的话会随时发生变化,不能控制?不是很懂,欢迎指正