/**
|
* @Description : 启动页面
|
*/
|
@Entry
|
@Component
|
struct StartUpPage {
|
@State logoY: number = -200
|
@State columnY: number = 200
|
@State isShow: boolean = false
|
aboutToAppear(): void {
|
|
}
|
build() {
|
Column(){
|
Image($r('app.media.logo'))
|
.width(100)
|
.height(100)
|
//设置logo图片的Y轴位置
|
.translate({y: this.logoY})
|
//属性动画
|
.animation({
|
//动画时长
|
duration: 3000,
|
//播放速度
|
tempo: 1,
|
//循环次数 -1无限循环
|
iterations: 1,
|
curve: Curve.EaseInOut,
|
//播放模式：
|
playMode: PlayMode.Normal,
|
//延时播放
|
delay: 500
|
})
|
|
Blank()
|
Column({ space: 10 }) {
|
Text('学聘同行').newExtend(30, 700)
|
Text('以学习蓄力，以应聘通关').newExtend(20, 400)
|
.textCase(TextCase.UpperCase)
|
Blank()
|
}
|
.shadow({
|
radius: 8,
|
color: '#efefef',
|
offsetX: 0,
|
offsetY: -10
|
})
|
.StartColumn()
|
.translate({ y: this.columnY })
|
.animation({
|
duration: 3000,
|
delay: 500,
|
curve: Curve.EaseInOut,
|
iterations: 1
|
})
|
.onAppear(() => {
|
//执行动画操作
|
this.logoY = 200
|
this.columnY = 0
|
//设置倒计时
|
let intervalId = setInterval(() => {
|
//页面跳转
|
this.getUIContext().getRouter().replaceUrl({
|
url:'pages/login/LoginPage'
|
})
|
//销毁计时器
|
clearInterval(intervalId)
|
},4000)
|
})
|
}
|
.width('100%')
|
.height('100%')
|
.backgroundImage($r('app.media.start_page_bg'))
|
.backgroundImageSize({width: '100%',height:'100%'})
|
}
|
}
|
|
@Extend(Column)
|
function StartColumn() {
|
.width('100%')
|
.height(180)
|
.alignItems(HorizontalAlign.Start)
|
.borderRadius({ topLeft: 20, topRight: 20 })
|
.backgroundColor(Color.White)
|
.padding(20)
|
}
|
|
@Extend(Text)
|
function newExtend(mSize: number,mWeight: FontWeight) {
|
.fontSize(mSize)
|
.fontWeight(mWeight)
|
}
|
