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

开发 前端
typescript 要把他当成两门编程语言看待,type 和 javascript。type是一门纯函数式编程语言负责类型的运算,javascript是一门常见的多范式动态类型编程语言负责值的运算,总体上来说 type 部分要比 javascript 部分难多了。

[[436365]]

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

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

https://harmonyos.51cto.com

宽高(width height)

例:设置width为300fp,height为100fp

Java XML

  1. ohos:width="300fp" 
  2. ohos:height="100fp" 

JS

  1. <text style="width: 300fp; height: 100fp">您好 世界</text> 
  2. //或 
  3. <text class="title">您好 世界</text> 
  4. //在*.css中设置 
  5. .title { 
  6.     width: 300fp; 
  7.     height: 100fp; 

 TS

  1. Text('您好 世界'
  2.     .height(100) 
  3.     .width(300) 
  4. //或 
  5. Text('您好 世界'
  6.     .size({ 
  7.         width: 300, 
  8.         height: 100 
  9.     }) 
详解Java、JS、TS组件常用属性-鸿蒙HarmonyOS技术社区

内边距(padding)

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

Java Xml

  1. ohos:left_padding="20fp" 
  2. ohos:top_padding="20fp" 

JS

  1. padding-left: 20fp; 
  2. padding-top: 20fp; 

 TS

  1. *.padding({ 
  2.     left: 20, 
  3.     top: 20 
  4. }) 
详解Java、JS、TS组件常用属性-鸿蒙HarmonyOS技术社区

外边距(margin)

例:设置左外边距为20fp

Java XML

  1. ohos:left_margin="20fp" 

 JS

  1. margin-left: 20fp; 

 TS

  1. *.margin({ 
  2.     left: 20 
  3. }) 
详解Java、JS、TS组件常用属性-鸿蒙HarmonyOS技术社区

背景颜色(background*)

Java XML

  1. ohos:background_element="#675982" 

 JS

  1. background-color: #675982; 

 TS

  1. *.backgroundColor('#675982'
详解Java、JS、TS组件常用属性-鸿蒙HarmonyOS技术社区

边框(border*)

Java & Java XML

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

JS

  1. border: 1px solid red; 

 -TS

  1. *.border({ 
  2.     width: 1, 
  3.     color: 'red'
  4.     style: BorderStyle.Solid 
  5. }) 
  6. //或 
  7. *.borderStyle(BorderStyle.Solid) 
  8. *.borderWidth(1) 
  9. *.borderColor('red'
详解Java、JS、TS组件常用属性-鸿蒙HarmonyOS技术社区

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

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

https://harmonyos.51cto.com

 

责任编辑:jianghua 来源: 鸿蒙社区
相关推荐

2010-10-19 14:48:09

Java String

2009-12-25 15:20:59

ADO CONNECT

2015-03-03 15:59:25

Android开发属性

2010-11-16 15:23:28

Oracle游标

2010-08-24 13:55:38

DIVstyle

2016-10-28 21:55:28

Javascript属性特性属性描述符

2015-03-03 09:19:12

UIScrollVie

2021-08-17 11:14:49

VoidJSTS

2010-08-13 13:14:09

Flex图表

2022-07-27 08:40:06

父子组件VUE3

2010-05-27 15:53:35

SVN属性设置

2010-09-03 12:46:28

CSSexpression

2011-05-31 09:36:46

Android 布局属性

2022-11-11 08:16:51

2010-08-23 15:33:47

CSSpadding

2010-08-23 08:45:08

CSSpadding内边距

2010-09-01 13:37:58

CSSclip属性

2009-07-10 12:30:12

Swing组件

2010-02-03 15:59:08

Android组件

2021-11-01 10:21:36

鸿蒙HarmonyOS应用
点赞
收藏

51CTO技术栈公众号