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还包装了很多组件进库中,设计网页时我们可以方便地调用这些组件.下面来简略地介绍一下各种各样的组件 ■ 字体图标 ...
随机推荐
- iOS- UITextView禁止Emoji表情
UITextView代理方法:判断 -(void)textViewDidEndEditing:(UITextView *)textView{ if ([self stringContai ...
- linux双机热备份
使用HeartBeat实现高可用HA的配置过程详解 一.写在前面 HA即(high available)高可用,又被叫做双机热备,用于关键性业务.简单理解就是,有2台机器 A 和 B,正常是 A 提供 ...
- Packages window(包窗口)
使用Unity Package Manager(在Unity的顶层菜单中:Window > Package Manager)查看可以安装或已安装在Project中的软件包.此外,您可以使用此窗口 ...
- 【amad】cookiecutter -- 一个命令行工具,使用项目模版来构建项目
动机 简介 个人评分 动机 一般的框架都有脚手架工具,但是并不会让所有人满意. 简介 cookiecutter1是一个Python实现的命令行工具,可以通过项目模版来构建项目. 它的特性包括: 跨平台 ...
- 玩转ELK之三件套安装配置详解
ELK是啥子??? ELK 是elastic公司提供的一套完整的日志收集以及展示的解决方案,是三个产品的首字母缩写,分别是ElasticSearch.Logstash 和 Kibana. 特点: 收集 ...
- Mac PyCharm2019激活方法
此教程支持最新2019.2版本Pycharm及其他软件 此教程实时更新,请放心使用:如果有新版本出现猪哥都会第一时间尝试激活: pycharm官网下载地址:http://www.jetbrains.c ...
- d3学习之路
d3学习历程: 轻量化编译器:HbuiderXHbuiderX使用教程 理解HTMl js CSS 三者关系 学习html js css :1)w3school 2)moo ...
- 【编程开发】非对称加密过程详解(基于RSA非对称加密算法实现)
1.非对称加密过程: 假如现实世界中存在A和B进行通讯,为了实现在非安全的通讯通道上实现信息的保密性.完整性.可用性(即信息安全的三个性质),A和B约定使用非对称加密通道进行通讯,具体 ...
- 不同Json工具对空串和NULL的序列号处理:net.sf.json 和 fastjson
目录 1.测试代码 2.测试结果: 3.总结: 4.注:Maven中引入net.sf.json的方式 net.sf.json 和 fastjson 对于空串和NULL的处理: 1.测试代码 packa ...
- 34.TCP非阻塞连接及套接字异常处理丶端口扫描脚本
TCP非阻塞及套接字异常处理: TCP阻塞套接字异常捕获: 套接字创建失败,8000 socket.error 客户端连接错误: ConnectionRefusedError socket.gaier ...