@tarojs/plugin-platform-harmony-ets 4.0.0-beta.0 → 4.0.0-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (65) hide show
  1. package/dist/apis/device/memory.ts +10 -3
  2. package/dist/apis/media/video/VideoContext.ts +56 -7
  3. package/dist/apis/media/video/index.ts +3 -2
  4. package/dist/components-harmony-ets/button.ets +57 -27
  5. package/dist/components-harmony-ets/checkbox.ets +237 -72
  6. package/dist/components-harmony-ets/form.ets +143 -27
  7. package/dist/components-harmony-ets/icon.ets +53 -19
  8. package/dist/components-harmony-ets/image.ets +53 -19
  9. package/dist/components-harmony-ets/input.ets +57 -18
  10. package/dist/components-harmony-ets/label.ets +155 -33
  11. package/dist/components-harmony-ets/picker.ets +155 -41
  12. package/dist/components-harmony-ets/radio.ets +240 -75
  13. package/dist/components-harmony-ets/richText.ets +52 -18
  14. package/dist/components-harmony-ets/scrollView.ets +103 -45
  15. package/dist/components-harmony-ets/slider.ets +57 -18
  16. package/dist/components-harmony-ets/swiper.ets +52 -18
  17. package/dist/components-harmony-ets/switch.ets +92 -41
  18. package/dist/components-harmony-ets/text.ets +60 -23
  19. package/dist/components-harmony-ets/textArea.ets +58 -19
  20. package/dist/components-harmony-ets/utils/DynamicCenter.ts +2 -11
  21. package/dist/components-harmony-ets/utils/flexManager.ets +44 -7
  22. package/dist/components-harmony-ets/utils/helper.ets +1 -1
  23. package/dist/components-harmony-ets/utils/styles.ets +57 -20
  24. package/dist/components-harmony-ets/video.ets +52 -18
  25. package/dist/components-harmony-ets/view.ets +111 -46
  26. package/dist/components-harmony-ets/webView.ets +113 -0
  27. package/dist/index.js +101 -4
  28. package/dist/index.js.map +1 -1
  29. package/dist/runtime-ets/dom/cssStyleDeclaration.ts +30 -6
  30. package/dist/runtime-ets/dom/element/element.ts +1 -0
  31. package/dist/runtime-ets/dom/element/form.ts +11 -2
  32. package/dist/runtime-ets/dom/element/index.ts +4 -1
  33. package/dist/runtime-ets/dom/element/normal.ts +1 -0
  34. package/dist/runtime-ets/dom/element/webView.ts +61 -0
  35. package/dist/runtime-ets/dom/node.ts +29 -16
  36. package/dist/runtime-ets/dom/stylesheet/covertWeb2Hm.ts +624 -0
  37. package/dist/runtime-ets/dom/stylesheet/index.ts +216 -354
  38. package/dist/runtime-ets/dom/stylesheet/type.ts +46 -11
  39. package/dist/runtime-ets/dom/stylesheet/util.ts +58 -6
  40. package/dist/runtime-ets/interface/event.ts +2 -1
  41. package/dist/runtime-ets/utils/index.ts +6 -1
  42. package/dist/runtime-ets/utils/info.ts +3 -1
  43. package/dist/runtime-framework/react/app.ts +12 -22
  44. package/dist/runtime-framework/react/index.ts +1 -0
  45. package/dist/runtime-framework/react/native-page.ts +344 -0
  46. package/dist/runtime-framework/react/page.ts +2 -2
  47. package/dist/runtime-utils.js +56 -15
  48. package/dist/runtime-utils.js.map +1 -1
  49. package/dist/runtime.js +56 -15
  50. package/dist/runtime.js.map +1 -1
  51. package/package.json +10 -9
  52. package/static/media/cancel.svg +1 -0
  53. package/static/media/circle.svg +1 -0
  54. package/static/media/clear.svg +1 -0
  55. package/static/media/download.svg +1 -0
  56. package/static/media/info.svg +1 -0
  57. package/static/media/info_circle.svg +1 -0
  58. package/static/media/search.svg +1 -0
  59. package/static/media/success.svg +1 -0
  60. package/static/media/success_no_circle.svg +1 -0
  61. package/static/media/taro_arrow_left.svg +1 -0
  62. package/static/media/taro_home.svg +1 -0
  63. package/static/media/waiting.svg +1 -0
  64. package/static/media/warn.svg +1 -0
  65. package/types/runtime.d.ts +2 -0
@@ -1,4 +1,11 @@
1
- import { temporarilyNotSupport } from '../utils'
1
+ import { hooks } from '@tarojs/runtime'
2
2
 
3
- export const onMemoryWarning = temporarilyNotSupport('onMemoryWarning')
4
- export const offMemoryWarning = temporarilyNotSupport('offMemoryWarning')
3
+ export const onMemoryWarning = (listener) => {
4
+ hooks.tap('getMemoryLevel', (res) => {
5
+ listener(res)
6
+ })
7
+ }
8
+
9
+ export const offMemoryWarning = (listener) => {
10
+ hooks.off('getMemoryLevel', listener)
11
+ }
@@ -1,19 +1,68 @@
1
+ // @ts-nocheck
2
+ import { document } from '@tarojs/runtime'
3
+
1
4
  import { temporarilyNotSupport } from '../../utils'
2
5
 
6
+ import type { TaroVideoElement } from '@tarojs/runtime'
3
7
  import type Taro from '@tarojs/taro/types'
4
8
 
5
9
  export class VideoContext implements Taro.VideoContext {
10
+ id: string
11
+
12
+ video: TaroVideoElement
13
+
14
+ controller: VideoController
15
+
16
+ constructor (id: string) {
17
+ this.id = id
18
+ this.video = document.getElementById(id)
19
+
20
+ if (this.video) {
21
+ this.controller = this.video.controller
22
+ }
23
+ }
24
+
25
+ play () {
26
+ if (!this.controller) return
27
+
28
+ this.controller.play()
29
+ }
30
+
31
+ pause () {
32
+ if (!this.controller) return
33
+
34
+ this.controller.pause()
35
+ }
36
+
37
+ stop () {
38
+ if (!this.controller) return
39
+
40
+ this.controller.stop()
41
+ }
42
+
43
+ seek (position: number) {
44
+ if (!this.controller) return
45
+
46
+ this.controller.setCurrentTime(position)
47
+ }
48
+
49
+ requestFullScreen () {
50
+ if (!this.controller) return
51
+
52
+ this.controller.requestFullscreen(true)
53
+ }
54
+
55
+ exitFullScreen () {
56
+ if (!this.controller) return
57
+
58
+ this.controller.exitFullscreen()
59
+ }
60
+
61
+ requestBackgroundPlayback = temporarilyNotSupport('VideoContext.requestBackgroundPlayback')
6
62
  exitBackgroundPlayback = temporarilyNotSupport('VideoContext.exitBackgroundPlayback')
7
- exitFullScreen = temporarilyNotSupport('VideoContext.exitFullScreen')
8
63
  exitPictureInPicture = temporarilyNotSupport('VideoContext.exitPictureInPicture')
9
64
  hideStatusBar = temporarilyNotSupport('VideoContext.hideStatusBar')
10
- pause = temporarilyNotSupport('VideoContext.pause')
11
- play = temporarilyNotSupport('VideoContext.play')
12
65
  playbackRate = temporarilyNotSupport('VideoContext.playbackRate')
13
- requestBackgroundPlayback = temporarilyNotSupport('VideoContext.requestBackgroundPlayback')
14
- requestFullScreen = temporarilyNotSupport('VideoContext.requestFullScreen')
15
- seek = temporarilyNotSupport('VideoContext.seek')
16
66
  sendDanmu = temporarilyNotSupport('VideoContext.sendDanmu')
17
67
  showStatusBar = temporarilyNotSupport('VideoContext.showStatusBar')
18
- stop = temporarilyNotSupport('VideoContext.stop')
19
68
  }
@@ -26,6 +26,7 @@ import mediaLibrary from '@ohos.multimedia.mediaLibrary'
26
26
  import { callAsyncFail, callAsyncSuccess, temporarilyNotSupport, validateParams } from '../../utils'
27
27
  import { VideoContext } from './VideoContext'
28
28
 
29
+ import type { TaroAny } from '@tarojs/runtime'
29
30
  import type Taro from '@tarojs/taro/types'
30
31
 
31
32
  interface IChooseVideoOptionOHOS {
@@ -43,8 +44,8 @@ const saveVideoToPhotosAlbumSchema = {
43
44
  filePath: 'String'
44
45
  }
45
46
 
46
- export const createVideoContext: typeof Taro.createVideoContext = () => {
47
- return new VideoContext()
47
+ export const createVideoContext: typeof Taro.createVideoContext = (id: string, _: TaroAny) => {
48
+ return new VideoContext(id)
48
49
  }
49
50
 
50
51
  // TODO: 1.返回属性补全
@@ -10,30 +10,45 @@ import type { TaroAny, TaroEvent, TaroButtonElement, TaroStyleType } from '@taro
10
10
  function attrs (style: TaroStyleType) {
11
11
  .id(style.id)
12
12
  .key(style.id)
13
- .width(style.width)
14
- .height(style.height)
15
- .padding({
16
- top: style.padding?.top,
17
- left: style.padding?.left || 10,
18
- right: style.padding?.right || 10,
19
- bottom: style.padding?.bottom,
20
- })
21
- .margin(style.margin)
22
13
  .flexGrow(style.flexGrow)
23
14
  .flexShrink(style.flexShrink)
24
15
  .flexBasis(style.flexBasis)
25
16
  .alignSelf(style.alignSelf)
26
- .backgroundImage(style.backgroundImage, style.backgroundRepeat)
27
- .backgroundImageSize(style.backgroundImageSize)
28
- .backgroundImagePosition(style.backgroundImagePosition)
29
- .rotate(style.rotate)
30
- .scale(style.scale)
31
- .translate(style.translate)
32
- .transform(style.transform)
33
- .borderStyle(style.borderStyle)
34
- .linearGradient(style.linearGradient)
17
+ .padding({
18
+ top: style.paddingTop,
19
+ right: style.paddingRight || 10,
20
+ bottom: style.paddingBottom,
21
+ left: style.paddingLeft || 10
22
+ })
23
+ .margin({
24
+ top: style.marginTop,
25
+ right: style.marginRight,
26
+ bottom: style.marginBottom,
27
+ left: style.marginLeft
28
+ })
29
+ .width(style.width)
30
+ .height(style.height)
31
+ .constraintSize({
32
+ minWidth: style.minWidth,
33
+ maxWidth: style.maxWidth,
34
+ minHeight: style.minHeight,
35
+ maxHeight: style.maxHeight
36
+ })
37
+ .backgroundImage(style.backgroundImage?.src, style.backgroundRepeat)
38
+ .backgroundImageSize(style.backgroundSize)
39
+ .backgroundImagePosition(style.backgroundPosition)
40
+ .borderStyle({
41
+ top: style.borderTopStyle,
42
+ right: style.borderRightStyle,
43
+ bottom: style.borderBottomStyle,
44
+ left: style.borderLeftStyle
45
+ })
35
46
  .zIndex(style.zIndex)
36
- .clip(style.clip)
47
+ .linearGradient(style.linearGradient)
48
+ .clip(style.overflow)
49
+ .rotate({ centerX: style.transformOrigin?.x, centerY: style.transformOrigin?.y, angle: 0 })
50
+ .scale({ centerX: style.transformOrigin?.x, centerY: style.transformOrigin?.y })
51
+ .transform(style.transform)
37
52
  }
38
53
 
39
54
  @Extend(Button)
@@ -71,9 +86,24 @@ function getThemeAttributes (node: TaroButtonElement): TaroStyleType {
71
86
  const type: string = _attrs.type || 'default'
72
87
 
73
88
  return {
74
- borderColor: hmStyle.borderColor || getButtonColor(node, BUTTON_THEME_COLOR.get(type).background),
75
- borderWidth: hmStyle.borderWidth || 1,
76
- borderRadius: hmStyle.borderRadius || convertNumber2VP(10),
89
+ borderColor: {
90
+ top: hmStyle.borderTopColor || getButtonColor(node, BUTTON_THEME_COLOR.get(type).background),
91
+ right: hmStyle.borderRightColor || getButtonColor(node, BUTTON_THEME_COLOR.get(type).background),
92
+ bottom: hmStyle.borderBottomColor || getButtonColor(node, BUTTON_THEME_COLOR.get(type).background),
93
+ left: hmStyle.borderLeftColor || getButtonColor(node, BUTTON_THEME_COLOR.get(type).background)
94
+ },
95
+ borderWidth: {
96
+ top: hmStyle.borderTopWidth || 1,
97
+ right: hmStyle.borderRightWidth || 1,
98
+ bottom: hmStyle.borderBottomWidth || 1,
99
+ left: hmStyle.borderLeftWidth || 1
100
+ },
101
+ borderRadius: {
102
+ topLeft: hmStyle.borderTopLeftRadius || convertNumber2VP(10),
103
+ topRight: hmStyle.borderTopRightRadius || convertNumber2VP(10),
104
+ bottomLeft: hmStyle.borderBottomLeftRadius || convertNumber2VP(10),
105
+ bottomRight: hmStyle.borderBottomRightRadius || convertNumber2VP(10)
106
+ },
77
107
  opacity: isDisabled ? 0.4 : hmStyle.opacity,
78
108
  backgroundColor: isPlain ? Color.Transparent : (hmStyle.backgroundColor || BUTTON_THEME_COLOR.get(type).background),
79
109
  color: hmStyle.color || getButtonColor(node, BUTTON_THEME_COLOR.get(type).text),
@@ -123,14 +153,14 @@ export default function TaroButton (node: TaroButtonElement) {
123
153
  .themeStyles(getThemeAttributes(node))
124
154
  .attrs(getNormalAttributes(node))
125
155
  .constraintSize({
126
- minWidth: node.hmStyle?.constraintSize?.minWidth || getButtonMinWidth(node),
127
- minHeight: node.hmStyle?.constraintSize?.minHeight || getButtonMinHeight(node),
128
- maxWidth: node.hmStyle?.constraintSize?.maxWidth,
129
- maxHeight: node.hmStyle?.constraintSize?.maxHeight,
156
+ minWidth: node.hmStyle?.minWidth || getButtonMinWidth(node),
157
+ minHeight: node.hmStyle?.minHeight || getButtonMinHeight(node),
158
+ maxWidth: node.hmStyle?.maxWidth,
159
+ maxHeight: node.hmStyle?.maxHeight,
130
160
  })
131
161
  .type(ButtonType.Normal)
132
162
  .onClick((e: ClickEvent) => {
133
- if (['submit', 'reset'].includes(node._attrs.formType)) {
163
+ if (node._attrs.formType && ['submit', 'reset'].includes(node._attrs.formType)) {
134
164
  const eventName = node._attrs.formType + '-btn'
135
165
  const event: TaroEvent = createTaroEvent(eventName, {}, node)
136
166
  eventHandler(event, eventName, node)
@@ -18,31 +18,65 @@ interface CheckboxAttrs {
18
18
  function checkboxStyle (style: TaroStyleType) {
19
19
  .id(style.id)
20
20
  .key(style.id)
21
- .padding(style.padding)
22
- .margin(style.margin)
23
- .width(style.width)
24
- .height(style.height)
25
- .constraintSize(style.constraintSize)
26
21
  .flexGrow(style.flexGrow)
27
22
  .flexShrink(style.flexShrink)
28
23
  .flexBasis(style.flexBasis)
29
24
  .alignSelf(style.alignSelf)
25
+ .padding({
26
+ top: style.paddingTop,
27
+ right: style.paddingRight,
28
+ bottom: style.paddingBottom,
29
+ left: style.paddingLeft
30
+ })
31
+ .margin({
32
+ top: style.marginTop,
33
+ right: style.marginRight,
34
+ bottom: style.marginBottom,
35
+ left: style.marginLeft
36
+ })
37
+ .width(style.width)
38
+ .height(style.height)
39
+ .constraintSize({
40
+ minWidth: style.minWidth,
41
+ maxWidth: style.maxWidth,
42
+ minHeight: style.minHeight,
43
+ maxHeight: style.maxHeight
44
+ })
30
45
  .backgroundColor(style.backgroundColor)
31
- .backgroundImage(style.backgroundImage, style.backgroundRepeat)
32
- .backgroundImageSize(style.backgroundImageSize)
33
- .backgroundImagePosition(style.backgroundImagePosition)
34
- .rotate(style.rotate)
35
- .scale(style.scale)
36
- .translate(style.translate)
37
- .transform(style.transform)
38
- .borderStyle(style.borderStyle)
39
- .borderWidth(style.borderWidth)
40
- .borderColor(style.borderColor)
41
- .borderRadius(style.borderRadius)
42
- .linearGradient(style.linearGradient)
46
+ .backgroundImage(style.backgroundImage?.src, style.backgroundRepeat)
47
+ .backgroundImageSize(style.backgroundSize)
48
+ .backgroundImagePosition(style.backgroundPosition)
49
+ .borderStyle({
50
+ top: style.borderTopStyle,
51
+ right: style.borderRightStyle,
52
+ bottom: style.borderBottomStyle,
53
+ left: style.borderLeftStyle
54
+ })
55
+ .borderWidth({
56
+ top: style.borderTopWidth,
57
+ right: style.borderRightWidth,
58
+ bottom: style.borderBottomWidth,
59
+ left: style.borderLeftWidth
60
+ })
61
+ .borderColor({
62
+ top: style.borderTopColor,
63
+ right: style.borderRightColor,
64
+ bottom: style.borderBottomColor,
65
+ left: style.borderLeftColor
66
+ })
67
+ .borderRadius({
68
+ topLeft: style.borderTopLeftRadius,
69
+ topRight: style.borderTopRightRadius,
70
+ bottomLeft: style.borderBottomLeftRadius,
71
+ bottomRight: style.borderBottomRightRadius
72
+ })
43
73
  .zIndex(style.zIndex)
44
74
  .opacity(style.opacity)
45
- .clip(style.clip)
75
+ .linearGradient(style.linearGradient)
76
+ .clip(style.overflow)
77
+ .rotate({ centerX: style.transformOrigin?.x, centerY: style.transformOrigin?.y, angle: 0 })
78
+ .scale({ centerX: style.transformOrigin?.x, centerY: style.transformOrigin?.y })
79
+ .transform(style.transform)
46
80
  }
47
81
 
48
82
  @Extend(Checkbox)
@@ -63,73 +97,191 @@ function getOptions (node: TaroCheckboxElement): CheckboxOptions {
63
97
  }
64
98
  }
65
99
 
66
- @Builder
67
- export function TaroCheckbox(node: TaroCheckboxElement) {
68
- Stack() {
69
- Row() {
70
- Checkbox(getOptions(node))
71
- .checkboxStyle(getNormalAttributes(node))
72
- .checkboxAttr(getAttributes(node))
73
- .opacity(!!node._attrs.disabled ? 0.4 : 1)
74
- .select(node.checked)
75
- .onChange((value: boolean) => {
76
- if (!!node?._attrs.disabled) {
77
- node.updateComponent()
78
- } else {
79
- node.updateCheckedValue(value)
80
-
81
- if (value) {
82
- const event: TaroEvent = createTaroEvent('change', { detail: { value: node?._attrs.value } }, node)
83
- eventHandler(event, 'change', node)
100
+ @Component
101
+ export struct TaroCheckbox {
102
+ node: TaroCheckboxElement | null = null
103
+
104
+ aboutToAppear () {
105
+ if (this.node && !this.node._isInit) {
106
+ this.node._isInit = true
107
+ this.node._reset = this.node.checked || false
108
+ }
109
+ }
110
+
111
+ build () {
112
+ if (this.node) {
113
+ Stack() {
114
+ Row() {
115
+ Checkbox(getOptions(this.node))
116
+ .checkboxStyle(getNormalAttributes(this.node))
117
+ .checkboxAttr(getAttributes(this.node))
118
+ .opacity(!!this.node._attrs.disabled ? 0.4 : 1)
119
+ .select(this.node.checked)
120
+ .onChange((value: boolean) => {
121
+ if (this.node) {
122
+ if (!!this.node?._attrs.disabled) {
123
+ this.node.updateComponent()
124
+ } else {
125
+ this.node.updateCheckedValue(value)
126
+
127
+ if (value) {
128
+ const event: TaroEvent = createTaroEvent('change', { detail: { value: this.node?._attrs.value } }, this.node)
129
+ eventHandler(event, 'change', this.node)
130
+ }
131
+ }
132
+ }
133
+ })
134
+ .onClick(shouldBindEvent((e: ClickEvent) => eventHandler(e, 'click', this.node), this.node, ['click']))
135
+ .onAreaChange(getComponentEventCallback(this.node, AREA_CHANGE_EVENT_NAME, (res: TaroAny) => {
136
+ if (this.node) {
137
+ this.node._nodeInfo.areaInfo = res[1]
138
+ }
139
+ }))
140
+ .onVisibleAreaChange(getNodeThresholds(this.node) || [0.0, 1.0], getComponentEventCallback(this.node, VISIBLE_CHANGE_EVENT_NAME))
141
+ Text(this.node.textContent)
142
+ .textAlign(TextAlign.Center)
143
+ .opacity(!!this.node._attrs.disabled ? 0.4 : 1)
144
+ }
145
+ .onClick(() => {
146
+ if (this.node) {
147
+ if (!this.node?._attrs.disabled) {
148
+ this.node.checked = !this.node.checked
84
149
  }
85
150
  }
86
151
  })
87
- .onClick(shouldBindEvent((e: ClickEvent) => eventHandler(e, 'click', node), node, ['click']))
88
- .onAreaChange(getComponentEventCallback(node, AREA_CHANGE_EVENT_NAME, (res: TaroAny) => {
89
- node._nodeInfo.areaInfo = res[1]
90
- }))
91
- .onVisibleAreaChange(getNodeThresholds(node) || [0.0, 1.0], getComponentEventCallback(node, VISIBLE_CHANGE_EVENT_NAME))
92
- Text(node.textContent)
93
- .textAlign(TextAlign.Center)
94
- .opacity(!!node._attrs.disabled ? 0.4 : 1)
95
- }
96
- .onClick(() => {
97
- if (!node?._attrs.disabled) {
98
- node.checked = !node.checked
99
152
  }
100
- })
153
+ }
101
154
  }
102
155
  }
103
156
 
104
- @Extend(Flex)
105
- function checkboxGroupAttrs (style: TaroStyleType) {
157
+ @Extend(Column)
158
+ function checkboxGroupColumnAttrs (style: TaroStyleType) {
106
159
  .id(style.id)
107
160
  .key(style.id)
108
- .padding(style.padding)
109
- .margin(style.margin)
161
+ .flexGrow(style.flexGrow)
162
+ .flexShrink(style.flexShrink)
163
+ .flexBasis(style.flexBasis)
164
+ .alignSelf(style.alignSelf)
165
+ .padding({
166
+ top: style.paddingTop,
167
+ right: style.paddingRight,
168
+ bottom: style.paddingBottom,
169
+ left: style.paddingLeft
170
+ })
171
+ .margin({
172
+ top: style.marginTop,
173
+ right: style.marginRight,
174
+ bottom: style.marginBottom,
175
+ left: style.marginLeft
176
+ })
110
177
  .width(style.width)
111
178
  .height(style.height)
112
- .constraintSize(style.constraintSize)
179
+ .constraintSize({
180
+ minWidth: style.minWidth,
181
+ maxWidth: style.maxWidth,
182
+ minHeight: style.minHeight,
183
+ maxHeight: style.maxHeight
184
+ })
185
+ .backgroundColor(style.backgroundColor)
186
+ .backgroundImage(style.backgroundImage?.src, style.backgroundRepeat)
187
+ .backgroundImageSize(style.backgroundSize)
188
+ .backgroundImagePosition(style.backgroundPosition)
189
+ .borderStyle({
190
+ top: style.borderTopStyle,
191
+ right: style.borderRightStyle,
192
+ bottom: style.borderBottomStyle,
193
+ left: style.borderLeftStyle
194
+ })
195
+ .borderWidth({
196
+ top: style.borderTopWidth,
197
+ right: style.borderRightWidth,
198
+ bottom: style.borderBottomWidth,
199
+ left: style.borderLeftWidth
200
+ })
201
+ .borderColor({
202
+ top: style.borderTopColor,
203
+ right: style.borderRightColor,
204
+ bottom: style.borderBottomColor,
205
+ left: style.borderLeftColor
206
+ })
207
+ .borderRadius({
208
+ topLeft: style.borderTopLeftRadius,
209
+ topRight: style.borderTopRightRadius,
210
+ bottomLeft: style.borderBottomLeftRadius,
211
+ bottomRight: style.borderBottomRightRadius
212
+ })
213
+ .zIndex(style.zIndex)
214
+ .opacity(style.opacity)
215
+ .linearGradient(style.linearGradient)
216
+ .clip(style.overflow)
217
+ .rotate({ centerX: style.transformOrigin?.x, centerY: style.transformOrigin?.y, angle: 0 })
218
+ .scale({ centerX: style.transformOrigin?.x, centerY: style.transformOrigin?.y })
219
+ .transform(style.transform)
220
+ }
221
+
222
+ @Extend(Row)
223
+ function checkboxGroupRowAttrs (style: TaroStyleType) {
224
+ .id(style.id)
225
+ .key(style.id)
113
226
  .flexGrow(style.flexGrow)
114
227
  .flexShrink(style.flexShrink)
115
228
  .flexBasis(style.flexBasis)
116
229
  .alignSelf(style.alignSelf)
230
+ .padding({
231
+ top: style.paddingTop,
232
+ right: style.paddingRight,
233
+ bottom: style.paddingBottom,
234
+ left: style.paddingLeft
235
+ })
236
+ .margin({
237
+ top: style.marginTop,
238
+ right: style.marginRight,
239
+ bottom: style.marginBottom,
240
+ left: style.marginLeft
241
+ })
242
+ .width(style.width)
243
+ .height(style.height)
244
+ .constraintSize({
245
+ minWidth: style.minWidth,
246
+ maxWidth: style.maxWidth,
247
+ minHeight: style.minHeight,
248
+ maxHeight: style.maxHeight
249
+ })
117
250
  .backgroundColor(style.backgroundColor)
118
- .backgroundImage(style.backgroundImage, style.backgroundRepeat)
119
- .backgroundImageSize(style.backgroundImageSize)
120
- .backgroundImagePosition(style.backgroundImagePosition)
121
- .rotate(style.rotate)
122
- .scale(style.scale)
123
- .translate(style.translate)
124
- .transform(style.transform)
125
- .borderStyle(style.borderStyle)
126
- .borderWidth(style.borderWidth)
127
- .borderColor(style.borderColor)
128
- .borderRadius(style.borderRadius)
129
- .linearGradient(style.linearGradient)
251
+ .backgroundImage(style.backgroundImage?.src, style.backgroundRepeat)
252
+ .backgroundImageSize(style.backgroundSize)
253
+ .backgroundImagePosition(style.backgroundPosition)
254
+ .borderStyle({
255
+ top: style.borderTopStyle,
256
+ right: style.borderRightStyle,
257
+ bottom: style.borderBottomStyle,
258
+ left: style.borderLeftStyle
259
+ })
260
+ .borderWidth({
261
+ top: style.borderTopWidth,
262
+ right: style.borderRightWidth,
263
+ bottom: style.borderBottomWidth,
264
+ left: style.borderLeftWidth
265
+ })
266
+ .borderColor({
267
+ top: style.borderTopColor,
268
+ right: style.borderRightColor,
269
+ bottom: style.borderBottomColor,
270
+ left: style.borderLeftColor
271
+ })
272
+ .borderRadius({
273
+ topLeft: style.borderTopLeftRadius,
274
+ topRight: style.borderTopRightRadius,
275
+ bottomLeft: style.borderBottomLeftRadius,
276
+ bottomRight: style.borderBottomRightRadius
277
+ })
130
278
  .zIndex(style.zIndex)
131
279
  .opacity(style.opacity)
132
- .clip(style.clip)
280
+ .linearGradient(style.linearGradient)
281
+ .clip(style.overflow)
282
+ .rotate({ centerX: style.transformOrigin?.x, centerY: style.transformOrigin?.y, angle: 0 })
283
+ .scale({ centerX: style.transformOrigin?.x, centerY: style.transformOrigin?.y })
284
+ .transform(style.transform)
133
285
  }
134
286
 
135
287
  interface ChangeEventDetail { value: string[] }
@@ -163,12 +315,25 @@ export struct TaroCheckboxGroup {
163
315
 
164
316
  build() {
165
317
  if (this.node) {
166
- Flex(FlexManager.flexOptions(this.node)) {
167
- createLazyChildren(this.node)
318
+ if (FlexManager.isFlexNode(this.node) && FlexManager.flexOptions(this.node).direction !== FlexDirection.Column) {
319
+ Row() {
320
+ createLazyChildren(this.node)
321
+ }
322
+ .checkboxGroupRowAttrs(getNormalAttributes(this.node))
323
+ .defaultEvent()
324
+ .visibleChangeEvent()
325
+ .alignItems(FlexManager.flexOptions(this.node).alignItems as VerticalAlign)
326
+ .justifyContent(FlexManager.flexOptions(this.node).justifyContent)
327
+ } else {
328
+ Column() {
329
+ createLazyChildren(this.node)
330
+ }
331
+ .checkboxGroupColumnAttrs(getNormalAttributes(this.node))
332
+ .defaultEvent()
333
+ .visibleChangeEvent()
334
+ .alignItems(FlexManager.flexOptions(this.node).alignItems as HorizontalAlign)
335
+ .justifyContent(FlexManager.flexOptions(this.node).justifyContent)
168
336
  }
169
- .checkboxGroupAttrs(getNormalAttributes(this.node))
170
- .defaultEvent()
171
- .visibleChangeEvent()
172
337
  }
173
338
  }
174
339
  }