1# 安全控件通用属性
2
3
4安全控件的基础属性,用于设置安全控件通用的属性。
5
6
7> **说明:**
8>
9> 该组件从API Version 10开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
10
11
12## iconSize
13
14iconSize(value: Dimension): T
15
16设置安全控件上图标的尺寸。
17
18**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
19
20**系统能力:** SystemCapability.ArkUI.ArkUI.Full
21
22**参数:**
23
24| 参数名 | 类型 | 必填 | 说明                   |
25|------------|------|-------|---------|
26| value | [Dimension](ts-types.md#dimension10) | 是 |安全控件上图标的尺寸。<br/>默认值:16vp|
27
28**返回值:**
29
30| 类型 | 说明 |
31| -------- | -------- |
32| T | 返回安全控件的属性。 |
33
34## layoutDirection
35
36layoutDirection(value: SecurityComponentLayoutDirection): T
37
38设置安全控件上图标和文字分布的方向。
39
40**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
41
42**系统能力:** SystemCapability.ArkUI.ArkUI.Full
43
44**参数:**
45
46| 参数名 | 类型 | 必填 | 说明                   |
47|------------|------|-------|---------|
48| value | [SecurityComponentLayoutDirection](#securitycomponentlayoutdirection枚举说明) |是 | 安全控件上图标和文字分布的方向。<br/>默认值:SecurityComponentLayoutDirection.HORIZONTAL|
49
50**返回值:**
51
52| 类型 | 说明 |
53| -------- | -------- |
54| T | 返回安全控件的属性。 |
55
56## position
57
58position(value: Position): T
59
60设置绝对定位,设置安全控件的左上角相对于父容器左上角的偏移位置。
61
62**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
63
64**系统能力:** SystemCapability.ArkUI.ArkUI.Full
65
66**参数:**
67
68| 参数名 | 类型 | 必填 | 说明                   |
69|------------|------|-------|---------|
70| value | [Position](ts-types.md#position) |是 |安全控件的左上角相对于父容器左上角的偏移位置。<br/>默认值:<br/>{<br/>x: 0,<br/>y: 0<br/>}|
71
72**返回值:**
73
74| 类型 | 说明 |
75| -------- | -------- |
76| T | 返回安全控件的属性。 |
77
78## markAnchor
79
80markAnchor(value: Position): T
81
82设置安全控件在位置定位时的锚点,以控件左上角作为基准点进行偏移。
83
84**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
85
86**系统能力:** SystemCapability.ArkUI.ArkUI.Full
87
88**参数:**
89
90| 参数名 | 类型                   | 必填 | 说明                   |
91|------------|------|-------|---------|
92| value | [Position](ts-types.md#position) |是 |安全控件在位置定位时的锚点,以控件左上角作为基准点进行偏移。通常配合position和offset属性使用,单独使用时,效果类似offset。<br/>默认值:<br/>{<br/>x: 0,<br/>y: 0<br/>}|
93
94**返回值:**
95
96| 类型 | 说明 |
97| -------- | -------- |
98| T | 返回安全控件的属性。 |
99
100## offset
101
102offset(value: Position | Edges | LocalizedEdges): T
103
104设置安全控件相对于自身布局位置的坐标偏移。
105
106**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
107
108**系统能力:** SystemCapability.ArkUI.ArkUI.Full
109
110**参数:**
111
112| 参数名 | 类型                   | 必填 | 说明                   |
113|------------|------|-------|---------|
114| value | [Position](ts-types.md#position) \| [Edges<sup>12+</sup>](ts-types.md#edges12) \| [LocalizedEdges<sup>12+</sup>](ts-types.md#localizededges12) |是 |安全控件相对于自身布局位置的坐标偏移。设置此属性不会影响父容器的布局,仅在绘制过程中调整位置。<br/>默认值:<br/>{<br/>x: 0,<br/>y: 0<br/>}|
115
116**返回值:**
117
118| 类型 | 说明 |
119| -------- | -------- |
120| T | 返回安全控件的属性。 |
121
122## fontSize
123
124fontSize(value: Dimension): T
125
126设置安全控件上文字的尺寸。
127
128**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
129
130**系统能力:** SystemCapability.ArkUI.ArkUI.Full
131
132**参数:**
133
134| 参数名 | 类型                   | 必填 | 说明                   |
135|------------|------|-------|---------|
136| value | [Dimension](ts-types.md#dimension10) |是 |安全控件上文字的尺寸。<br/>默认值:16fp|
137
138**返回值:**
139
140| 类型 | 说明 |
141| -------- | -------- |
142| T | 返回安全控件的属性。 |
143
144## fontStyle
145
146fontStyle(value: FontStyle): T
147
148设置安全控件上文字的样式。
149
150**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
151
152**系统能力:** SystemCapability.ArkUI.ArkUI.Full
153
154**参数:**
155
156| 参数名 | 类型                   | 必填 | 说明                   |
157|------------|------|-------|---------|
158| value | [FontStyle](ts-appendix-enums.md#fontstyle) |是 |安全控件上文字的样式。<br/>默认值:FontStyle.Normal|
159
160**返回值:**
161
162| 类型 | 说明 |
163| -------- | -------- |
164| T | 返回安全控件的属性。 |
165
166## fontWeight
167
168fontWeight(value: number | FontWeight | string): T
169
170设置安全控件上文字粗细。
171
172**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
173
174**系统能力:** SystemCapability.ArkUI.ArkUI.Full
175
176**参数:**
177
178| 参数名 | 类型                   | 必填 | 说明                   |
179|------------|------|-------|---------|
180| value | number \| [FontWeight](ts-appendix-enums.md#fontweight) \| string |是 |安全控件上文字粗细。<br/>默认值:FontWeight.Medium|
181
182**返回值:**
183
184| 类型 | 说明 |
185| -------- | -------- |
186| T | 返回安全控件的属性。 |
187
188## fontFamily
189
190fontFamily(value: string | Resource): T
191
192设置安全控件上文字的字体。
193
194**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
195
196**系统能力:** SystemCapability.ArkUI.ArkUI.Full
197
198**参数:**
199
200| 参数名 | 类型                   | 必填 | 说明                   |
201|------------|------|-------|---------|
202| value | string \| [Resource](ts-types.md#resource) |是 |安全控件上文字的字体。<br/>默认字体:'HarmonyOS Sans'|
203
204**返回值:**
205
206| 类型 | 说明 |
207| -------- | -------- |
208| T | 返回安全控件的属性。 |
209
210## fontColor
211
212fontColor(value: ResourceColor): T
213
214设置安全控件上文字的颜色。
215
216**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
217
218**系统能力:** SystemCapability.ArkUI.ArkUI.Full
219
220**参数:**
221
222| 参数名 | 类型                   | 必填 | 说明                   |
223|------------|------|-------|---------|
224| value | [ResourceColor](ts-types.md#resourcecolor) |是 |安全控件上文字的颜色。<br/>默认值:$r('sys.color.font_on_primary')|
225
226**返回值:**
227
228| 类型 | 说明 |
229| -------- | -------- |
230| T | 返回安全控件的属性。 |
231
232## iconColor
233
234iconColor(value: ResourceColor): T
235
236设置安全控件上图标的颜色。
237
238**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
239
240**系统能力:** SystemCapability.ArkUI.ArkUI.Full
241
242**参数:**
243
244| 参数名 | 类型                   | 必填 | 说明                   |
245|------------|------|-------|---------|
246| value | [ResourceColor](ts-types.md#resourcecolor) |是 |安全控件上图标的颜色。<br/>默认值:$r('sys.color.icon_on_primary')|
247
248**返回值:**
249
250| 类型 | 说明 |
251| -------- | -------- |
252| T | 返回安全控件的属性。 |
253
254## backgroundColor
255
256backgroundColor(value: ResourceColor): T
257
258设置安全控件的背景颜色。
259
260**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
261
262**系统能力:** SystemCapability.ArkUI.ArkUI.Full
263
264**参数:**
265
266| 参数名 | 类型                   | 必填 | 说明                   |
267|------------|------|-------|---------|
268| value | [ResourceColor](ts-types.md#resourcecolor) |是 |安全控件的背景颜色。<br/>默认值:$r('sys.color.icon_emphasize')<br/>安全控件按钮背景色高八位的α值低于0x1a(例如0x1800ff00)时,安全控件按钮背景色高八位的α值会被系统强制调整为0xff。|
269
270**返回值:**
271
272| 类型 | 说明 |
273| -------- | -------- |
274| T | 返回安全控件的属性。 |
275
276## borderStyle
277
278borderStyle(value: BorderStyle): T
279
280设置安全控件的边框的样式。
281
282**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
283
284**系统能力:** SystemCapability.ArkUI.ArkUI.Full
285
286**参数:**
287
288| 参数名 | 类型                   | 必填 | 说明                   |
289|------------|------|-------|---------|
290| value | [BorderStyle](ts-appendix-enums.md#borderstyle) |是 |安全控件的边框的样式。<br/>默认不设置边框样式|
291
292**返回值:**
293
294| 类型 | 说明 |
295| -------- | -------- |
296| T | 返回安全控件的属性。 |
297
298## borderWidth
299
300borderWidth(value: Dimension): T
301
302设置安全控件的边框的宽度。
303
304**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
305
306**系统能力:** SystemCapability.ArkUI.ArkUI.Full
307
308**参数:**
309
310| 参数名 | 类型                   | 必填 | 说明                   |
311|------------|------|-------|---------|
312| value | [Dimension](ts-types.md#dimension10) |是 |安全控件的边框的宽度。<br/>默认不设置边框宽度|
313
314**返回值:**
315
316| 类型 | 说明 |
317| -------- | -------- |
318| T | 返回安全控件的属性。 |
319
320## borderColor
321
322borderColor(value: ResourceColor): T
323
324设置安全控件的边框的颜色。
325
326**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
327
328**系统能力:** SystemCapability.ArkUI.ArkUI.Full
329
330**参数:**
331
332| 参数名 | 类型                   | 必填 | 说明                   |
333|------------|------|-------|---------|
334| value | [ResourceColor](ts-types.md#resourcecolor) |是 |安全控件的边框的颜色。<br/>默认不设置边框颜色|
335
336**返回值:**
337
338| 类型 | 说明 |
339| -------- | -------- |
340| T | 返回安全控件的属性。 |
341
342## borderRadius
343
344borderRadius(value: Dimension): T
345
346设置安全控件的边框圆角半径。
347
348**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
349
350**系统能力:** SystemCapability.ArkUI.ArkUI.Full
351
352**参数:**
353
354| 参数名 | 类型                   | 必填 | 说明                   |
355|------------|------|-------|---------|
356| value |  [Dimension](ts-types.md#dimension10) |是 |安全控件的边框圆角半径。|
357
358**返回值:**
359
360| 类型 | 说明 |
361| -------- | -------- |
362| T | 返回安全控件的属性。 |
363
364## padding
365
366padding(value: Padding | Dimension): T
367
368设置安全控件的内边距。
369
370**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
371
372**系统能力:** SystemCapability.ArkUI.ArkUI.Full
373
374**参数:**
375
376| 参数名 | 类型                   | 必填 | 说明                   |
377|------------|------|-------|---------|
378| value | [Padding](ts-types.md#padding) \| [Dimension](ts-types.md#dimension10) |是 |安全控件的内边距。<br/>默认值:上下8vp, 左右16vp|
379
380**返回值:**
381
382| 类型 | 说明 |
383| -------- | -------- |
384| T | 返回安全控件的属性。 |
385
386## textIconSpace
387
388textIconSpace(value: Dimension): T
389
390设置安全控件中图标和文字的间距。
391
392**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
393
394**系统能力:** SystemCapability.ArkUI.ArkUI.Full
395
396**参数:**
397
398| 参数名 | 类型                   | 必填 | 说明                   |
399|------------|------|-------|---------|
400| value | [Dimension](ts-types.md#dimension10) |是 |安全控件中图标和文字的间距。<br/>默认值:4vp|
401
402**返回值:**
403
404| 类型 | 说明 |
405| -------- | -------- |
406| T | 返回安全控件的属性。 |
407
408## width<sup>11+</sup>
409
410width(value: Length): T
411
412设置安全控件自身的宽度,缺省时将根据元素内容自适配宽度。
413
414**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。
415
416**系统能力:** SystemCapability.ArkUI.ArkUI.Full
417
418**参数:**
419
420| 参数名 | 类型                   | 必填 | 说明                   |
421|------------|------|-------|---------|
422|value | [Length](ts-types.md#length) |是 |安全控件自身的宽度,缺省时将根据元素内容自适配宽度。若设置宽度小于当前属性组合下允许的最小宽度时,宽度会调整为设置值,此时按钮文本信息会自动换行,以保证安全控件显示的完整性。|
423
424**返回值:**
425
426| 类型 | 说明 |
427| -------- | -------- |
428| T | 返回安全控件的属性。 |
429
430## height<sup>11+</sup>
431
432height(value: Length): T
433
434设置安全控件自身的高度,缺省时将根据元素内容自适配高度。
435
436**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。
437
438**系统能力:** SystemCapability.ArkUI.ArkUI.Full
439
440**参数:**
441
442| 参数名 | 类型                   | 必填 | 说明                   |
443|------------|------|-------|---------|
444| value | [Length](ts-types.md#length) |是|安全控件自身的高度,缺省时将根据元素内容自适配高度。若设置高度小于当前属性组合下允许的最小高度时,高度不会缩减到设置值,此时高度会大于设置高度,以保证安全控件显示的完整性。|
445
446**返回值:**
447
448| 类型 | 说明 |
449| -------- | -------- |
450| T | 返回安全控件的属性。 |
451
452## size<sup>11+</sup>
453
454size(value: SizeOptions): T
455
456设置高宽尺寸,缺省时将根据元素内容自适配高宽尺寸。
457
458**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。
459
460**系统能力:** SystemCapability.ArkUI.ArkUI.Full
461
462**参数:**
463
464| 参数名 | 类型                   | 必填 | 说明                   |
465|------------|------|-------|---------|
466| value | [SizeOptions](ts-types.md#sizeoptions) |是 |高宽尺寸,缺省时将根据元素内容自适配高宽尺寸。若设置尺寸小于当前属性组合下允许的最小尺寸时,高度不会缩减到设置值,宽度会调整到设置值,此时按钮文本信息会自动换行,以保证安全控件显示的完整性。|
467
468**返回值:**
469
470| 类型 | 说明 |
471| -------- | -------- |
472| T | 返回安全控件的属性。 |
473
474## constraintSize<sup>11+</sup>
475
476constraintSize(value: ConstraintSizeOptions): T
477
478设置约束尺寸,组件布局时,进行尺寸范围限制。
479
480**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。
481
482**系统能力:** SystemCapability.ArkUI.ArkUI.Full
483
484**参数:**
485
486| 参数名 | 类型                   | 必填 | 说明                   |
487|------------|------|-------|---------|
488| value | [ConstraintSizeOptions](ts-types.md#constraintsizeoptions) |是 |约束尺寸,组件布局时,进行尺寸范围限制。constraintSize的优先级高于Width和Height。取值结果参考[constraintSize取值对width/height影响](ts-universal-attributes-size.md)。<br>同width/height一样,若设置尺寸小于当前属性组合下允许的最小尺寸时, 高度不会缩减到设置值,宽度会调整到设置值,此时按钮文本信息会自动换行,以保证安全控件显示的完整性。<br>默认值:<br>{<br/>minWidth:&nbsp;0,<br/>maxWidth:&nbsp;Infinity,<br/>minHeight:&nbsp;0,<br/>maxHeight:&nbsp;Infinity<br/>}|
489
490**返回值:**
491
492| 类型 | 说明 |
493| -------- | -------- |
494| T | 返回安全控件的属性。 |
495
496
497## SecurityComponentLayoutDirection枚举说明
498
499**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
500
501**系统能力:** SystemCapability.ArkUI.ArkUI.Full
502
503| 名称 | 值 | 说明 |
504| -------- | -------- | -------- |
505| HORIZONTAL | 0 | 安全控件上图标和文字分布的方向为水平排列。 |
506| VERTICAL | 1 | 安全控件上图标和文字分布的方向为垂直排列。 |
507
508
509## 示例
510
511> **说明:**
512> 为避免控件样式不合法导致授权失败,请开发者先了解安全控件样式的[约束与限制](../../../security/AccessToken/security-component-overview.md#约束与限制)。
513
514```ts
515// xxx.ets
516@Entry
517@Component
518struct Index {
519  build() {
520    Row() {
521      Column({space:5}) {
522        // 生成一个保存按钮,并设置它的SecurityComponent属性
523        SaveButton()
524          .fontSize(35)
525          .fontColor(Color.White)
526          .iconSize(30)
527          .layoutDirection(SecurityComponentLayoutDirection.HORIZONTAL)
528          .borderWidth(1)
529          .borderStyle(BorderStyle.Dashed)
530          .borderColor(Color.Blue)
531          .borderRadius(20)
532          .fontWeight(100)
533          .iconColor(Color.White)
534          .padding({left:50, top:50, bottom:50, right:50})
535          .textIconSpace(20)
536          .backgroundColor(0x3282f6)
537        SaveButton().size({width:200, height:100})
538        SaveButton().constraintSize({maxWidth:60})
539      }.width('100%')
540    }.height('100%')
541  }
542}
543```
544
545![zh-cn_image_0000001643038221](figures/zh-cn_image_0000001643038221.png)
546