Demo.ets 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. @Entry
  2. @Component
  3. struct Demo {
  4. @State message: string = 'Hello World'
  5. @State location: number = 0.0
  6. @State leftlocation: number = -0.1
  7. @State rightlocation: number = 0.1
  8. // 配置渐变色起始点位周期性移动
  9. aboutToAppear(): void {
  10. setInterval(() => {
  11. this.location += 0.01
  12. this.leftlocation += 0.01
  13. this.rightlocation += 0.01
  14. if (this.location >= 1) {
  15. this.location = 0.0
  16. this.leftlocation = -0.1
  17. this.rightlocation = 0.1
  18. }
  19. }, 50)
  20. }
  21. build() {
  22. Column({ space: 5 }) {
  23. Row() {
  24. Text(this.message)
  25. .maxLines(1)
  26. .fontSize(40)
  27. .fontWeight(800)
  28. .fontColor(Color.White)
  29. .padding(10)
  30. .blendMode(BlendMode.DST_IN, BlendApplyType.OFFSCREEN) // 设置混合模式
  31. }
  32. .linearGradient({
  33. angle: 110,
  34. colors: [[Color.White, this.leftlocation], [Color.Orange, this.location],
  35. [Color.White, this.rightlocation]] // 设置渐变色起始点位
  36. })
  37. .blendMode(BlendMode.SRC_OVER, BlendApplyType.OFFSCREEN)
  38. }
  39. .width('100%')
  40. .backgroundColor(Color.Black)
  41. .justifyContent(FlexAlign.Center)
  42. }
  43. }