1# 安全控件通用属性 2 3 4安全控件的基础属性，用于设置安全控件通用的属性。 5 6 7> **说明：** 8> 9> 该组件从API Version 10开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。 10 11 12## 属性 13 14| 名称 | 参数类型 | 必填 | 描述 | 15| -------- | -------- | -------- | -------- | 16| iconSize | [Dimension](ts-types.md#dimension10) | 否 | 设置安全控件上图标的尺寸。<br/>默认值：16vp | 17| layoutDirection | [SecurityComponentLayoutDirection](#securitycomponentlayoutdirection枚举说明) | 否 | 设置安全控件上图标和文字分布的方向。<br/>默认值：SecurityComponentLayoutDirection.HORIZONTAL | 18| position | [Position](ts-types.md#position8) | 否 | 设置绝对定位，设置安全控件的左上角相对于父容器左上角的偏移位置。<br/>默认值：<br/>{<br/>x: 0,<br/>y: 0<br/>} | 19| markAnchor | [Position](ts-types.md#position8) | 否 | 设置安全控件在位置定位时的锚点，以控件左上角作为基准点进行偏移。通常配合position和offset属性使用，单独使用时，效果类似offset<br/>默认值：<br/>{<br/>x: 0,<br/>y: 0<br/>} | 20| offset | [Position](ts-types.md#position8) | 否 | 设置安全控件相对于自身布局位置的坐标偏移。设置此属性不会影响父容器的布局，仅在绘制过程中调整位置。<br/>默认值：<br/>{<br/>x: 0,<br/>y: 0<br/>} | 21| fontSize | [Dimension](ts-types.md#dimension10) | 否 | 设置安全控件上文字的尺寸。<br/>默认值：16fp | 22| fontStyle | [FontStyle](ts-appendix-enums.md#fontstyle) | 否 | 设置安全控件上文字的样式。<br/>默认值：FontStyle.Normal | 23| fontWeight | number \| [FontWeight](ts-appendix-enums.md#fontweight) \| string | 否 | 设置安全控件上文字粗细。<br/>默认值：FontWeight.Medium | 24| fontFamily | string \| [Resource](ts-types.md#resource) | 否 | 设置安全控件上文字的字体。<br/>默认字体：'HarmonyOS Sans' | 25| fontColor | [ResourceColor](ts-types.md#resourcecolor) | 否 | 设置安全控件上文字的颜色。<br/>默认值：\#ffffffff | 26| iconColor | [ResourceColor](ts-types.md#resourcecolor) | 否 | 设置安全控件上图标的颜色。<br/>默认值：\#ffffffff | 27| backgroundColor | [ResourceColor](ts-types.md#resourcecolor) | 否 | 设置安全控件的背景颜色。<br/>默认值：\#007dff | 28| borderStyle | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 设置安全控件的边框的样式。<br/>默认不设置边框样式 | 29| borderWidth | [Dimension](ts-types.md#dimension10) | 否 | 设置安全控件的边框的宽度。<br/>默认不设置边框宽度 | 30| borderColor | [ResourceColor](ts-types.md#resourcecolor) | 否 | 设置安全控件的边框的颜色。<br/>默认不设置边框颜色 | 31| borderRadius | [Dimension](ts-types.md#dimension10) | 否 | 设置安全控件的边框圆角半径。| 32| padding | [Padding](ts-types.md#padding) \| [Dimension](ts-types.md#dimension10) | 否 | 设置安全控件的内边距。<br/>默认值：上下12vp, 左右24vp | 33| textIconSpace | [Dimension](ts-types.md#dimension10) | 否 | 设置安全控件中图标和文字的间距。<br/>默认值：4vp | 34| width<sup>11+</sup> | [Length](ts-types.md#length) | 否 | 设置安全控件自身的宽度，缺省时将根据元素内容自适配宽度。若设置宽度小于当前属性组合下允许的最小宽度时，宽度不会缩减到设置值，此时宽度会大于设置宽度，以保证安全控件显示的完整性。 | 35| height<sup>11+</sup> | [Length](ts-types.md#length) | 否 | 设置安全控件自身的高度，缺省时将根据元素内容自适配高度。若设置高度小于当前属性组合下允许的最小高度时，高度不会缩减到设置值，此时高度会大于设置高度，以保证安全控件显示的完整性。 | 36| size<sup>11+</sup> | [SizeOptions](ts-types.md#sizeoptions) | 否 | 设置高宽尺寸，缺省时将根据元素内容自适配高宽尺寸。若设置尺寸小于当前属性组合下允许的最小尺寸时，尺寸不会缩减到设置值，此时尺寸会大于设置尺寸，以保证安全控件显示的完整性| 37| constraintSize<sup>11+</sup> | [ConstraintSizeOptions](ts-types.md#constraintsizeoptions) | 否 | 设置约束尺寸，组件布局时，进行尺寸范围限制。constraintSize的优先级高于Width和Height。取值结果参考[constraintSize取值对width/height影响](ts-universal-attributes-size.md)。<br> 同width/height一样，控件尺寸无法小于当前属性组合下的最小值，以保证安全控件显示的完整性。<br>默认值：<br>{<br/>minWidth: 0,<br/>maxWidth: Infinity,<br/>minHeight: 0,<br/>maxHeight: Infinity<br/>} | 38 39 40## SecurityComponentLayoutDirection枚举说明 41 42| 名称 | 枚举值 | 描述 | 43| -------- | -------- | -------- | 44| HORIZONTAL | 0 | 安全控件上图标和文字分布的方向为水平排列。 | 45| VERTICAL | 1 | 安全控件上图标和文字分布的方向为垂直排列。 | 46 47 48## 示例 49 50```ts 51// xxx.ets 52@Entry 53@Component 54struct Index { 55 build() { 56 Row() { 57 Column({space:5}) { 58 // 生成一个保存按钮，并设置它的SecurityComponent属性 59 SaveButton() 60 .fontSize(35) 61 .fontColor(Color.White) 62 .iconSize(30) 63 .layoutDirection(SecurityComponentLayoutDirection.HORIZONTAL) 64 .borderWidth(1) 65 .borderStyle(BorderStyle.Dashed) 66 .borderColor(Color.Blue) 67 .borderRadius(20) 68 .fontWeight(100) 69 .iconColor(Color.White) 70 .padding({left:50, top:50, bottom:50, right:50}) 71 .textIconSpace(20) 72 .backgroundColor(0x3282f6) 73 SaveButton().size({width:200, height:100}) 74 SaveButton().constraintSize({maxWidth:60}) 75 }.width('100%') 76 }.height('100%') 77 } 78} 79``` 80 81 82
