渐变

渐变

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
 1import { TaskModel } from '../viewmodel/TaskModel';
 2import { router } from '@kit.ArkUI'
 3import { ParamsType } from '../viewmodel/ParamsModel';
 4
 5@Entry
 6@Component
 7struct Page02_TaskDetail2 {
 8  @State message: string = 'Hello World';
 9  // 采用联合类型
10  @State taskDetail: TaskModel | null = null
11
12  // 挂载完成后获取数据
13  aboutToAppear(): void {
14    const params = router.getParams()
15    console.log(JSON.stringify(params))
16    // 断言告诉编辑器, 明确知道params对象数据类型
17    const detail = (params as ParamsType<TaskModel>).value
18    this.taskDetail = detail
19  }
20
21  @Styles
22  taskBoxStyle(){
23    .width('49%')
24    .height(80)
25    .linearGradient({
26      angle: 180, // 垂直方向0, 顺时针度数, 默认180绿色在上
27      colors: [
28        [Color.Red, 0.0], // 第1个颜色, 第2个颜色范围, 0.3纯红
29        [Color.Blue, 1.0]
30      ]
31    })
32    .borderRadius(10)
33    .padding(10)
34  }
35
36  build() {
37    Column() {
38      // 返回按钮
39      Row() {
40        Text('返回')
41          .width(50)
42          .height(40)
43          .borderRadius(10)
44          .textAlign(TextAlign.Center)
45          .onClick(() => {
46            router.back()
47          })
48
49        Text('任务详情')
50          .fontSize(20)
51          .fontWeight(FontWeight.Bold)
52      }
53      .width('100%')
54      .justifyContent(FlexAlign.SpaceBetween)
55
56      // 任务标题
57      Column({
58        space: 10
59      }) {
60        Text('任务标题')
61          .fontSize(20)
62          .fontWeight(FontWeight.Bold)
63          .fontColor($r('app.color.title_color'))
64      }
65
66      // 任务时间表
67      Row() {
68        Column() {
69          Text('开始时间')
70            .fontSize(20)
71            .fontColor("rgba(255,255,255,0.5)")
72            .fontWeight(FontWeight.Bold)
73          Text('09:00')
74            .fontSize(18)
75            .fontColor(Color.White)
76            .fontWeight(FontWeight.Bold)
77        }.taskBoxStyle()
78
79        Column() {
80          Text('结束时间')
81            .fontSize(20)
82            .fontColor("rgba(255,255,255,0.5)")
83            .fontWeight(FontWeight.Bold)
84          Text('09:00')
85            .fontSize(18)
86            .fontColor(Color.White)
87            .fontWeight(FontWeight.Bold)
88        }.taskBoxStyle()
89      }
90    }
91    .height('100%')
92    .width('100%')
93    .backgroundColor('#f1f3f5')
94    .padding(10)
95  }
96}

Copyright ©2010-2022 比特日记 All Rights Reserved.

Powered By 可尔物语

浙ICP备11005866号-12