Flutter——Row组件(水平布局组件)
Row组件的常用属性
| 属性 | 说明 |
| mainAxisAlignment | 主轴的排序方式 |
| crossAxisAlignment | 次轴的排序方式 |
| children | 组件子元素 |

import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(
title: "RowWidget",
home: MyApp(),
));
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
width: 400,
height: 600,
color: Colors.black45,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly, // 主轴元素的排序方式(水平布局中,X轴是主轴)
crossAxisAlignment: CrossAxisAlignment.end, // 次轴元素的排序方式
children: <Widget>[
Container(
color: Colors.orange,
width: 80,
height: 80,
),
Container(
color: Colors.redAccent,
width: 80,
height: 80,
),
Container(
color: Colors.teal,
width: 80,
height: 80,
)
],
),
)
);
}
}
Flutter——Row组件(水平布局组件)的更多相关文章
- 【Flutter实战】六大布局组件及半圆菜单案例
老孟导读:Flutter中布局组件有水平 / 垂直布局组件( Row 和 Column ).叠加布局组件( Stack 和 IndexedStack ).流式布局组件( Wrap )和 自定义布局组件 ...
- Flutter常用布局组件
Flutter控件本身通常由许多小型.单用途的控件组成,结合起来产生强大的效果,例如,Container是一种常用的控件,由负责布局.绘画.定位和大小调整的几个控件组成,具体来说,Container是 ...
- 【Flutter学习】页面布局之基础布局组件
一,概述 Flutter中拥有30多种预定义的布局widget,常用的有Container.Padding.Center.Flex.Row.Colum.ListView.GridView.按照< ...
- Flutter——Expanded组件("可伸缩"组件)
Expanded组件可以结合Row和Column布局组件使用. Expanded组件的常用属性 属性 说明 flex 元素占整个父Row/Column的比例 child 子元素 import 'pac ...
- 【Flutter学习】页面布局之其它布局处理
一,概述 Flutter中拥有30多种预定义的布局widget,常用的有Container.Padding.Center.Flex.Row.Colum.ListView.GridView.按照< ...
- 【Flutter学习】页面布局之列表和表格处理
一,概述 Flutter中拥有30多种预定义的布局widget,常用的有Container.Padding.Center.Flex.Row.Colum.ListView.GridView.按照< ...
- 【Flutter学习】页面布局之宽高尺寸处理
一,概述 Flutter中拥有30多种预定义的布局widget,常用的有Container.Padding.Center.Flex.Row.Colum.ListView.GridView.按照< ...
- 技术胖Flutter第三季-18布局CardWidget 卡片布局组件
技术胖Flutter第三季-18布局CardWidget 卡片布局组件 博客地址: https://jspang.com/post/flutter3.html#toc-420 最外面是Card布局,里 ...
- 【BootStrap】 布局组件 I
BootStrap布局组件 I 除了在原生的HTML基础上进行了外观和类别上的改进,BS还包装了很多组件进库中,设计网页时我们可以方便地调用这些组件.下面来简略地介绍一下各种各样的组件 ■ 字体图标 ...
随机推荐
- JAVA 基础编程练习题48 【程序 48 加密】
48 [程序 48 加密] 题目:某个公司采用公用电话传递数据,数据是四位的整数,在传递过程中是加密的,加密 规则如下:每位数字都加上 5,然后用和除以 10 的余数代替该数字,再将第一位和第四位交 ...
- delphi7 clientdataset 详解
delphi Midas SQLServer的自增字段的处理1.新增时,表中有自增字段,但是不希望用Refresh,直接ApplyUpdates直接看见自增字段的值在DataSetProvider.A ...
- 11-2 TCP/IP协议栈
TCP/IP协议栈 Transmission Control Protocol/Internet Protocol传输控制协议/因特网互联协议 TCP/IP是一个Protocol Stack,包括TC ...
- 《精通并发与Netty》学习笔记(13 - 解决TCP粘包拆包(一)概念及实例演示)
一.粘包/拆包概念 TCP是一个“流”协议,所谓流,就是没有界限的一长串二进制数据.TCP作为传输层协议并不不了解上层业务数据的具体含义,它会根据TCP缓冲区的实际情况进行数据包的划分,所以在业务上认 ...
- 产品之我见(1)-女性APP
我曾下载过几款女性APP,下载的初衷是想要记录.同时预估下一次生理周期开始的时间. 在查找网上测评推荐及个人下载试用了四五款后,我当时留下美柚.大姨吗.Clue这三款. 美柚 ...
- c++学习笔记_5
前言:本笔记所对应的课程为中国大学mooc中北京大学的程序设计与算法(三)C++面向对象程序设计,主要供自己复习使用,且本笔记建立在会使用c和java的基础上,只针对与c和java的不同来写 继承 继 ...
- JS中删除数组中的元素方法
删除指定下标数组元素 Array.prototype.del=function(index){ if(isNaN(index)||index>=this.length){ return fals ...
- linux用户管理添加用户的默认配置文件useradd详解
/etc/default/useradd 文件 cat /etc/default/useradd 常用命令: useradd 添加用户 userdel 删除用户 passwd 改密码 use ...
- 在vue项目中,将juery设置为全局变量
1.首先执行:npm install jQuery --save-dev,在package.json里加入jQuery. 2.修改build下的webpack.base.conf.js 方法一: 首 ...
- virtualbox 扩容存储
本文讲解一种方式: 第一步: 我们需要将virtual box 设置成全局的环境变量 第二步: 找到要修改的xxx.vdi文件,通过命令来修改 下面操作步骤 1.设置virtual box 的环境变量 ...