会员登录 - 用户注册 - 设为首页 - 加入收藏 - 网站地图 详解Java、JS、TS组件常用属性!

详解Java、JS、TS组件常用属性

时间:2025-11-04 21:08:12 来源:益强数据堂 作者:IT科技 阅读:127次

想了解更多内容,详解请访问:

和华为官方合作共建的组件鸿蒙技术社区

https://harmonyos.51cto.com

宽高(width height)

例:设置width为300fp,亿华云计算height为100fp

Java XML

ohos:width="300fp" ohos:height="100fp" 

JS

<text style="width: 300fp; height: 100fp">您好 世界</text> //或 <text class="title">您好 世界</text> //在*.css中设置 .title {     width: 300fp;     height: 100fp; } 

 TS

Text(您好 世界)     .height(100)     .width(300) //或 Text(您好 世界)     .size({         width: 300,常用         height: 100     }) 

内边距(padding)

例:设置左内边距为20fp, 上内边距为20fp

Java Xml

ohos:left_padding="20fp" ohos:top_padding="20fp" 

JS

padding-left: 20fp; padding-top: 20fp; 

 TS

*.padding({     left: 20,     top: 20 }) 

外边距(margin)

例:设置左外边距为20fp

Java XML

ohos:left_margin="20fp" 

 JS

margin-left: 20fp; 

 TS

*.margin({     left: 20 }) 

背景颜色(background*)

Java XML

ohos:background_element="#675982" 

 JS

background-color: #675982; 

 TS

*.backgroundColor(#675982) 

边框(border*)

Java & Java XML

//*_layout.xml ohos:id="$+id:normal_border" // *AbilitySlice.java Text text = findComponentById(ResourceTable.Id_normal_border); ShapeElement element =  new ShapeElement(); element.setRgbColor(new RgbColor(9, 133, 100)); element.setStroke(20, new RgbColor(255, 0, 0)); text.setBackground(element);  //*_layout.xml ohos:background_element="$graphic:background_ability_normal_properties" // graphic/background_ability_normal_properties.xml <stroke     ohos:width="5fp"     ohos:color="red"/> 

JS

border: 1px solid red; 

 -TS

*.border({     width: 1,     color: red,     style: BorderStyle.Solid }) //或 *.borderStyle(BorderStyle.Solid) *.borderWidth(1) *.borderColor(red) 

想了解更多内容,请访问:

和华为官方合作共建的免费源码下载属性鸿蒙技术社区

https://harmonyos.51cto.com

(责任编辑:IT科技)

推荐内容
  • 尼康200.500镜头评测(探究尼康200.500镜头的特点和优势)
  • 如何构建一支“万物皆可分析”的数据科学团队
  • JS魔法堂:不完全国际化&本地化手册之理论篇
  • 使用Lombok来精简你的项目代码
  • 电脑如何安装千兆端口(从购买到安装,快速提升网络速度)
  • 我们为什么要尝试前后端分离