HarmonyOS控件

Posted on | In

对齐

align(Alignment.Center)

设置容器元素绘制区域内的子元素的对齐方式。只在Stack、Button、Marquee、StepperItem、Text、TextArea、TextInput、FolderStack中生效，其中和文本相关的组件Marquee、Text、TextArea、TextInput的align结果参考===textAlign===。

alignRules

指定设置在相对容器中子组件的对齐规则，===仅当父容器为RelativeContainer时生效===。该方法水平方向上以start和end分别替代原方法的left和right，以便在RTL模式下能镜像显示，建议使用该方法指定设置在相对容器中子组件的对齐规则。

alignSelf(ItemAlign.Center)

  • Flex布局中子组件在父容器交叉轴的对齐格式。
  • Blank在父容器交叉轴上设置大小时不会撑满父容器交叉轴，交叉轴不设置大小时alignSelf默认值为ItemAlign.Stretch，会撑满容器交叉轴。
  • GridCol本身也可通过alignSelf(ItemAlign)设置自身对齐方式
  • Row/Column：alignSelf属性用于控制单个子元素在容器交叉轴上的对齐方式，其优先级高于alignItems属性，如果设置了alignSelf属性，则在单个子元素上会覆盖alignItems属性。

alignItem

设置GridRow中的GridCol垂直主轴方向对齐方式。GridCol本身也可通过alignSelf(ItemAlign)设置自身对齐方式。当上述两种对齐方式都设置时，以GridCol自身设置为准。

渐变

1
2
3
4
.linearGradient({  
  direction: GradientDirection.Bottom,  
  colors: [[0xFFCFC0, 0.0], [0xFFFFFF, 1]]  
})

Text

粗体：.fontWeight(FontWeight.Bold)
省略号：.textOverflow({overflow: TextOverflow.Ellipsis})

Image

objectFit–ImageFit: ^d51b9c
Contain 保持宽高比进行缩小或者放大，使得图片完全显示在显示边界内。
Cover 保持宽高比进行缩小或者放大，使得图片两边都大于或等于显示边界。
Auto 图像会根据其自身尺寸和组件的尺寸进行适当缩放，以在保持比例的同时填充视图。
Fill 不保持宽高比进行放大缩小，使得图片充满显示边界。
ScaleDown 保持宽高比显示，图片缩小或者保持不变。
None 保持原有尺寸显示。
TOP_START12+ 图像显示在Image组件的顶部起始端，保持原有尺寸显示。
TOP12+ 图像显示在Image组件的顶部横向居中，保持原有尺寸显示。
TOP_END12+ 图像显示在Image组件的顶部尾端，保持原有尺寸显示。
START12+ 图像显示在Image组件的起始端纵向居中，保持原有尺寸显示。
CENTER12+ 图像显示在Image组件的横向和纵向居中，保持原有尺寸显示。
END12+ 图像显示在Image组件的尾端纵向居中，保持原有尺寸显示。
BOTTOM_START12+ 图像显示在Image组件的底部起始端，保持原有尺寸显示。
BOTTOM12+ 图像显示在Image组件的底部横向居中，保持原有尺寸显示。
BOTTOM_END12+ 图像显示在Image组件的底部尾端，保持原有尺寸显示。

Buttom

Scroll