详解Java、JS、TS组件常用属性 原创 精华

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

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

Text('您好 世界')
    .height(100)
    .width(300)
//或
Text('您好 世界')
    .size({
        width: 300,
        height: 100
    })
1.
2.
3.
4.
5.
6.
7.
8.
9.

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

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

*.padding({
	left: 20,
	top: 20
})
1.
2.
3.
4.

ohos:left_margin="20fp"
1.

margin-left: 20fp;
1.

*.margin({
	left: 20
})
1.
2.
3.

ohos:background_element="#675982"
1.

background-color: #675982;
1.

*.backgroundColor('#675982')
1.

//*_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);
1.
2.
3.
4.
5.
6.
7.
8.

//*_layout.xml
ohos:background_element="$graphic:background_ability_normal_properties"
// graphic/background_ability_normal_properties.xml
<stroke
	ohos:width="5fp"
	ohos:color="red"/>
1.
2.
3.
4.
5.
6.

border: 1px solid red;
1.

*.border({
	width: 1,
	color: 'red',
	style: BorderStyle.Solid
})
//或
*.borderStyle(BorderStyle.Solid)
*.borderWidth(1)
*.borderColor('red')
1.
2.
3.
4.
5.
6.
7.
8.
9.