鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之RowSplit容器组件

简介: 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之RowSplit容器组件

鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之RowSplit容器组件

一、操作环境

操作系统:  Windows 10 专业版、IDE:DevEco Studio 3.1、SDK:HarmonyOS 3.1+

image.gif 编辑

二、RowSplit容器组件

将子组件横向布局,并在每个子组件之间插入一根纵向的分割线。

子组件

可以包含子组件。

接口

RowSplit()

属性

名称

参数类型

描述

resizeable

boolean

分割线是否可拖拽,默认为false。

NOTE

RowSplit的分割线最小能拖动到刚好包含子组件。

在真机中查看拖动效果,预览器中不支持拖动。

不支持clip、margin通用属性。

三、示例

代码

// xxx.ets
@Entry
@Component
struct RowSplitExample {
  build() {
    Column() {
      Text('The second line can be dragged').fontSize(9).fontColor(0xCCCCCC).width('90%')
      RowSplit() {
        Text('1').width('10%').height(100).backgroundColor(0xF5DEB3).textAlign(TextAlign.Center)
        Text('2').width('10%').height(100).backgroundColor(0xD2B48C).textAlign(TextAlign.Center)
        Text('3').width('10%').height(100).backgroundColor(0xF5DEB3).textAlign(TextAlign.Center)
        Text('4').width('10%').height(100).backgroundColor(0xD2B48C).textAlign(TextAlign.Center)
        Text('5').width('10%').height(100).backgroundColor(0xF5DEB3).textAlign(TextAlign.Center)
      }
      .resizeable(true) // 可拖动
      .width('90%').height(100)
    }.width('100%').margin({ top: 5 })
  }
}

image.gif

图例

image.gif 编辑

你有时间常去我家看看我在这里谢谢你啦...

我家地址:亚丁号

最后送大家一首诗:

山高路远坑深,

大军纵横驰奔,

谁敢横刀立马?

惟有点赞加关注大军。

目录
打赏
0
0
0
0
187
分享
相关文章
harmonyOS基础- 快速弄懂HarmonyOS ArkTs基础组件、布局容器(前端视角篇)
本文由黑臂麒麟(6年前端经验)撰写,介绍ArkTS开发中的常用基础组件与布局组件。基础组件包括Text、Image、Button等,支持样式设置如字体颜色、大小和加粗等,并可通过Resource资源引用统一管理样式。布局组件涵盖Column、Row、List、Grid和Tabs等,支持灵活的主轴与交叉轴对齐方式、分割线设置及滚动事件监听。同时,Tabs组件可实现自定义样式与页签切换功能。内容结合代码示例,适合初学者快速上手ArkTS开发。参考华为开发者联盟官网基础课程。
31 17
harmonyOS基础- 快速弄懂HarmonyOS ArkTs基础组件、布局容器(前端视角篇)
【02】优雅草星云物联网AI智控系统从0开发鸿蒙端适配-deveco studio-登录页面LoginView.ets完成-并且详细解释关于arkui关于 CommonConst, commonColor, InputDataModel-优雅草卓伊凡
【02】优雅草星云物联网AI智控系统从0开发鸿蒙端适配-deveco studio-登录页面LoginView.ets完成-并且详细解释关于arkui关于 CommonConst, commonColor, InputDataModel-优雅草卓伊凡
31 14
【02】优雅草星云物联网AI智控系统从0开发鸿蒙端适配-deveco studio-登录页面LoginView.ets完成-并且详细解释关于arkui关于 CommonConst, commonColor, InputDataModel-优雅草卓伊凡
|
3天前
|
HarmonyOS NEXT - ArkUI: Button组件
Button是用于响应用户点击操作的按钮组件,支持胶囊型、圆形和普通三种样式。可通过`type`属性设置样式(默认为胶囊型),并使用`stateEffect`控制按压态效果(默认开启)。Button可包含子组件,实现复杂功能按钮;支持自定义文本样式、背景色及边框弧度等样式。示例代码展示了不同类型按钮的创建、子组件嵌套及点击事件处理方法。
51 18
HarmonyOS NEXT - ArkUI: TextInput组件
TextInput组件是用于输入单行文本的核心组件,广泛应用于登录账号、密码输入及消息发送等场景。支持通过`placeholder`设置提示文字、`text`初始化文本内容以及`controller`控制输入行为。提供多种输入类型(如普通、密码、邮箱、数字)通过`.type()`方法设置,并可通过`.onChange()`监听文本变化。 示例代码展示了基本用法,包括账号、密码和手机号的输入框实现。此外,组件支持字符计数功能,通过`.maxLength()`限制最大字符数、`.showCounter()`显示计数器,并可自定义阈值和高亮边框效果,满足复杂输入场景需求。
51 15
|
3天前
HarmonyOS NEXT - ArkUI: Image组件
Image组件用于渲染和展示图片,丰富界面视觉效果。支持png、jpg、bmp、svg、gif和heif等多种格式,数据源包括本地资源、Resource资源、网络资源、媒体库(file://路径)及PixelMap像素图。使用时需根据资源类型配置路径或权限(如网络图片需声明ohos.permission.INTERNET)。此外,Image组件支持矢量图填充颜色设置(fillColor)和多种缩放模式(objectFit),如Contain、Cover等。示例代码展示了本地、资源、网络图片的加载与样式调整方法。
56 14
容器技术实践:在Ubuntu上使用Docker安装MySQL的步骤。
通过以上的操作,你已经步入了Docker和MySQL的世界,享受了容器技术给你带来的便利。这个旅程中你可能会遇到各种挑战,但是只要你沿着我们划定的路线行进,你就一定可以达到目的地。这就是Ubuntu、Docker和MySQL的灵魂所在,它们为你开辟了一条通往新探索的道路,带你亲身感受到了技术的力量。欢迎在Ubuntu的广阔大海中探索,用Docker技术引领你的航行,随时准备感受新技术带来的震撼和乐趣。
35 16
zabbix7.0.9安装-以宝塔安装形式-非docker容器安装方法-系统采用AlmaLinux9系统-最佳匹配操作系统提供稳定运行环境-安装教程完整版本-优雅草卓伊凡
zabbix7.0.9安装-以宝塔安装形式-非docker容器安装方法-系统采用AlmaLinux9系统-最佳匹配操作系统提供稳定运行环境-安装教程完整版本-优雅草卓伊凡
93 30
自学软硬件第755 docker容器虚拟化技术youtube视频下载工具
docker容器虚拟化技术有什么用?怎么使用?TubeTube 项目使用youtube视频下载工具
课时5:阿里云容器服务:最原生的集成Docker和云服务
阿里云容器服务以服务化形式构建容器基础设施,大幅提升开发效率,简化应用部署流程。通过Docker容器和DevOps工具(如Jenkins),实现自动化部署与迭代,优化企业内部复杂部署问题。该服务支持GPU调度、混合云架构无缝迁移,并与阿里云产品体系无缝集成,提供安全防护、网络负载均衡等多重功能支持。凭借微服务架构,帮助企业突破业务瓶颈,提高资源利用率,轻松应对海量流量。
课时5:阿里云容器服务:最原生的集成Docker和云服务