鸿蒙开发案列004 Column、Row容器组件组件

已于 2024-02-12 20:33:16 修改
阅读量930 收藏 11
点赞数 8
分类专栏： 鸿蒙开发 文章标签： 鸿蒙 华为
于 2024-02-08 12:24:36 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42215417/article/details/136076578
版权
本文详细介绍了Column和Row组件的基本概念，包括它们作为容器组件的相似性，如何设置组件间的间距，以及对齐方式的对比。作者强调了持续学习的重要性，并鼓励读者关注和收藏。
摘要由CSDN通过智能技术生成

一.理解Column、Row组件

1.1简单理解：（都是容器组件，属性方法有很多类似的地方）

  • Column容器内部组件纵向排列
  • Row 容器内部组件横向排列

Column、Row组件 布局对比
在这里插入图片描述

1.2 参数：space 设置组件内部组件之间间距（可选参数，没有设置，偶然默认为0）

在这里插入图片描述

1.3 对齐方式

Column 与Row 基本相同

  • Column图解

在这里插入图片描述

  • Row图解
    在这里插入图片描述
持续学习更新，学成挣大钱。太忙，可能会迟到，但不会缺席！

欢迎每个小伙伴关注收藏，会全部回关，永远不会取消！

阿衰写代码
关注
  • 8
    点赞
  • 踩
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Row和Column
weixin_38107457的博客
05-18 816
Row和Column是多子控件的容器类控件，Row控件水平布局，Column控件垂直布局。 在Row和Column中有一个非常重要的概念：MainAxisAlignment（主轴）和CrossAxisAlignment（交叉轴），简单来说，MainAxisAlignment（主轴）就是与当前控件方向一致的轴，而CrossAxisAlignment（交叉轴）就是与当前控件方向垂直的轴，比如Row的主轴是水平方向，交叉轴是垂直方向，而Column的主轴是垂直方向，交叉轴是水平方向。 主轴对齐方式 Row控
HarmonyOS应用开发实战-容器组件.docx
06-03
### HarmonyOS应用开发实战——容器组件详解 #### 一、引言 随着HarmonyOS生态的不断壮大，越来越多的应用开发者开始关注并投入到基于HarmonyOS的应用开发中。本文将详细介绍HarmonyOS应用开发中的一个重要组成...
容器组件：Column ，Row（HarmonyOS学习第四课【4.1】）
qq_58213084的博客
05-12 546
参数类型： FlexAlign 描述： 用于设置子组件在垂直方向上的对齐方式。从API版本9开始，这个参数支持在ArkTS卡片中使用。这些参数用于布局控制，让你可以指定子组件在容器中的对齐方式，以便更好地控制界面布局。参数类型： FlexAlign 描述： 用于设置子组件在水平方向上的对齐方式。这些参数用于布局控制，让你可以指定子组件在容器中的对齐方式，以便更好地控制界面布局。该组件从 APIVersion 7开始支持，从API version 9开始，该接口支持在ArkTS,卡片中使用。
HarmonyOS Next开发学习手册——线性布局 (Row/Column)
最新发布
maniuT的博客
06-27 826
线性布局（LinearLayout）是开发中最常用的布局，通过线性容器 Row 和 Column 构建。线性布局是其他布局的基础，其子元素在线性方向上（水平方向和垂直方向）依次排列。线性布局的排列方向由所选容器组件决定，Column容器内子元素按照垂直方向排列，Row容器内子元素按照水平方向排列。根据不同的排列方向，开发者可选择使用Row或Column容器创建线性布局。图1Column容器内子元素排列示意图图2Row容器内子元素排列示意图。
鸿蒙开发组件之Row、Column
Lu_Ca的博客
12-09 1028
其中，Row是横向排列，可以理解为1行，然后，Column是作为竖向排列，可以理解为1列。开发的过程中主要是对主轴的控制比较多，所以一般设置的属性是justifyContent。Row与Column布局时有两个重要的概念，主轴与交叉轴，可以通过设置主轴与交叉轴的排列方式来改变子控件的排列方向以及间隔等。通过设置Row与Column的justifyContent属性，控制子控件的排列方式。内边距可以理解一个Row中控件距离该Row的上下左右的距离。外边距可以理解一个Row距离其他Row的上下左右的距离。
Flutter笔记 Column和Row
weixin_30266885的博客
02-27 266
MainAxisSize：　　控制自己的布局方式 　　MainAxisSize.min　　默认值，Column和Row自适应children； 　　MainAxisSize.max　　Column填充父控件竖屏，Row填充父控件横屏；需要搭配MainAxisAlignment使用才有效果； MainAxisAlignment：　　控制子集的对齐方式，Column上...
HarmonyOS--ArkUI组件--容器组件Column和Row
github_39096247的博客
09-08 2976
容器组件Column和Row
ROW（行）与COLUMN（列）
热门推荐
staraincsdn的博客
07-15 2万+
数列数，COLUMNS（A:B）=2，即A到B一共两列。
HarmonyOS应用开发-marquee组件使用
04-18
### HarmonyOS应用开发-marquee组件使用 在HarmonyOS的应用开发过程中，为了实现文本滚动的效果，我们可以使用`marquee`组件。此组件可以方便地帮助开发者实现动态展示文本的需求，适用于广告滚动、通知滚动等场景...
HarmonyOS应用开发-ETSsrcoll滑动组件.docx
06-05
### HarmonyOS应用开发-ETSsrcoll滑动组件详解 #### 一、概述 在HarmonyOS的应用开发过程中，为了提供更丰富的用户交互体验，开发者往往需要利用到各种UI组件来构建应用程序界面。其中，`ETSsrcoll`滑动组件作为一...
FlutterGridView组件以及动态GridView、Paddiing Row Column Expanded组件详解
06-03
`Row`和`Column`组件是Flutter中最基本的布局容器，它们分别沿水平和垂直方向排列子Widget。这两个组件是灵活的，可以设置主轴对齐方式、交叉轴对齐方式以及是否允许子Widget扩展填充剩余空间等属性。这对于创建复杂...
HarmonyOS应用开发实战-媒体组件video.docx
06-03
### HarmonyOS应用开发实战——媒体组件Video详解 #### 一、引言 随着HarmonyOS生态的不断壮大和发展，开发者们对于构建高质量的应用程序有着越来越高的需求。HarmonyOS提供了丰富的UI组件，其中媒体组件（Media ...
Flutter学习第三课-布局组件 Row和Column
chen1234219的博客
03-24 1509
线性布局 所谓线性布局，即指沿水平或垂直方向排布子组件。Flutter中通过Row和Column来实现线性布局。 Row 水平布局，Column 垂直布局 Row 和 Column 组件是不可以滚动的，所以在 Row 和Column 组件中不会放置过多子组件，如果你需- 要滚动应该使用 ListView。 如果只有一个子组件的话，应该考虑使用使用 Align 或者 Container 组件来定位...
Row 和 Column 组件
一个程序员的成长之路。。。
09-26 748
一、Row 组件 参数说明 mainAxisAlignment: 主轴的排序方式 crossAxisAlignment: 次轴的排序方式 children: 组件子元素 二、Column 组件 参数说明 mainAxisAlignment: 主轴的排序方式 crossAxisAlignment: 次轴的排序方式 children: 组件子元素 ...
【flutter】Row和Column组件
devnn的专栏
05-02 4434
Row和Column是flutter中最基础的容器组件，Row用来水平放置子组件，Column用来垂直放置子组件。它们都可以设置子组件的对齐方式。重点需要了解它们有哪些对齐方式，以及如何对齐的。 布局特点 Row在水平方向会尽可能大，大到会撑满parent；在垂直方向会尽可能小，小到能包裹住children。children在水平默认居左，垂直方向上默认居中。 Column在垂直方向上会尽可能大，...
HarmonyOS鸿蒙学习基础篇 - Column/Row 组件
2303_76218115的博客
02-14 3947
Row和Column组件是线性布局容器，用于按照垂直或水平方向排列子组件。Row表示沿水平方向布局的容器，而Column表示沿垂直方向布局的容器。这些容器具有许多属性和方法，可以方便地管理子组件的位置、大小、间距和对齐方式。例如，可以设置容器内部的子组件之间的间距（space属性），以及子组件在主轴（水平或垂直方向）和交叉轴上的对齐方式。
线性布局（Row/Column）
01-12 1619
线性布局（LinearLayout）是开发中最常用的布局，通过线性容器Row和Column构建。线性布局是其他布局的基础，其子元素在线性方向上（水平方向和垂直方向）依次排列。线性布局的排列方向由所选容器组件决定，Column容器内子元素按照垂直方向排列，Row容器内子元素按照水平方向排列。根据不同的排列方向，开发者可选择使用Row或Column容器创建线性布局。图1Column容器内子元素排列示意图图2Row容器内子元素排列示意图。
【flutter】column和row组件
qq_56132766的博客
04-12 200
flutter colunm和row
看完必过，HarmonyOS应用开发者高级认证易错题整理
NVG_Haru的博客
01-22 1万+
看完必过，HarmonyOS应用开发者基础认证易错题整理
Column&Row组件的使用
一起学鸿蒙呀~~
01-01 1442
线性布局容器表示按照垂直方向或者水平方向排列子组件的容器，ArkTS提供了Column和Row容器来实现线性布局。Column表示沿垂直方向布局的容器。Row表示沿水平方向布局的容器。了解布局容器的主轴和交叉轴，主要是为了让大家更好地理解子组件在主轴和交叉轴的排列方式。接下来，我们将详细讲解Column和Row容器的两个属性justifyContent和alignItems。属性名称描述设置子组件在主轴方向上的对齐格式。alignItems设置子组件在交叉轴方向上的对齐格式。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值