Align的作用是为了设置子child的对齐方式,一般作为其他控件的一个参数。

构造函数

const Align({
Key key,
this.alignment = Alignment.center,
this.widthFactor,
this.heightFactor,
Widget child
})

相关属性如下:

  • alignment 设置对齐方向
  • widthFactor 如果非空,则将其宽度设置为子元素的宽度乘以该因子,可以大于或小于1.0,但必须是正数。
  • heightFactor 如果非空,则将其高度设置为子元素的高度乘以该因子,可以大于或小于1.0,但必须是正数。

代码demo

import 'package:flutter/material.dart';

void main() => runApp(
MaterialApp(
title: '图标按钮组件示例',
home: LayoutDemo(),
),
); class LayoutDemo extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('图标按钮组件示例'),
),
body: Align(
alignment: Alignment.centerLeft,
widthFactor: 2.0,
heightFactor: 2.0,
//添加图标按钮
child: IconButton(
//图标元素
icon: Icon(Icons.volume_up,size: 48.0,),
//按钮提示
tooltip: '按下操作',
//按下事件响应
onPressed:(){
print('按下操作');
},
),
),
);
}
}

Flutter 基础布局Widgets之Align的更多相关文章

  1. 【Flutter学习】页面布局之基础布局组件

    一,概述 Flutter中拥有30多种预定义的布局widget,常用的有Container.Padding.Center.Flex.Row.Colum.ListView.GridView.按照< ...

  2. Flutter基础系列之入门(一)

    1.Flutter是什么? 官方介绍:Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面. Flutter可以与现有的代码一起工作.在全世界,Flutter ...

  3. Flutter的布局方法

    重点是什么? Widgets 是用于构建UI的类. Widgets 用于布局和UI元素. 通过简单的widget来构建复杂的widget Flutter布局机制的核心就是widget.在Flutter ...

  4. flutter系列之:widgets,构成flutter的基石

    目录 简介 StatelessWidget和StatefulWidget StatelessWidget详解 StatefulWidget详解 总结 简介 flutter中所有的组件都是由widget ...

  5. 【html】【7】基础布局初探

    当了解了上面的文章有一定基础后,开始尝试初步基础布局,可能不美观,但是要开始有布局框架思想 基础代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML ...

  6. laravel 5.5 《电商实战 》基础布局

    我们需要为我们的项目构建一个基础的页面布局,布局文件统一存放在 resources/views/layouts 文件夹中,布局涉及的文件如下: app.blade.php —— 主要布局文件,项目的所 ...

  7. 在Orchard CMS Theme 用代码定义布局Widgets

    因为公司业务需要,经过本人几个月尝试,使用Orchard CMS 开发一个简单的企业门户(地址是http://www.ubof.cn).在刚开始接触Orchard CMS,对于个性化的网页布局不知道怎 ...

  8. CSS基础布局

    目录 css基础布局 1.布局相关的标签 2.盒子模型 2-1 什么是盒子模型 2-2 块级元素和内联元素(行内元素) 2-3 盒子模型之间的关系 盒子模型相关CSS属性 3.浮动 3-1 什么是浮动 ...

  9. Android 的UI基础布局的学习

    一. 今天学习了Android 的UI基础布局的部分,绝大多数的布局都在Androidstudio的这个界面里,如下: 在左边的框里的palette的内部,包含了的大多数的布局所要用的button按钮 ...

随机推荐

  1. wireshark使用过程中,卡死未响应

    原因 : 未知 处理办法:1.重装wireshark ----------无效果 2.卸载有道词典-----------成功,wireshark正常运行,重装有道词典该问题必现,所以问题由有道词典引起 ...

  2. python异常(理论知识)

    异常 程序在运行过程当中,不可避免的会出现一些错误,比如: 使用了没有赋值过的变量 使用了不存在的索引 除0 ... 这些错误在程序中,我们称其为异常. 程序运行过程中,一旦出现异常将会导致程序立即终 ...

  3. python集合的运算

    &  交集  | 并集    - 差集  ^ 异或集 # 在对集合做运算时,不会影响原来的集合,而是返回一个运算结果 # 创建两个集合 s = {1,2,3,4,5} s2 = {3,4,5, ...

  4. Scrapy解析器xpath

    一.使用xpath 不在scrapy框架中通过response from scrapy.http import HtmlResponse HtmlResponse->TextResponse-& ...

  5. 分布式唯一ID的生成方案

    分布式ID的特性 全局唯一 不能出现重复的ID,这是最基本的要求. 递增 有利于关系数据库索引性能. 高可用 既然是服务于分布式系统,为多个服务提供ID服务,访问压力一定很大,所以需要保证高可用. 信 ...

  6. 高通量计算框架HTCondor(二)——环境配置

    目录 1. 概述 2. 安装 3. 结果 4. 相关 1. 概述 HTCondor是开源跨平台的分布式计算框架,在其官网上直接提供了源代码和Windows.Linux以及MacOS的安装包.因为平台限 ...

  7. [bzoj3925] [洛谷P3343] [ZJOI2015] 地震后的幻想乡

    Description 傲娇少女幽香是一个很萌很萌的妹子,而且她非常非常地有爱心,很喜欢为幻想乡的人们做一些自己力所能及的事情来帮助他们. 这不,幻想乡突然发生了地震,所有的道路都崩塌了.现在的首要任 ...

  8. spring cloud 与 docker 读书笔记 1

    Eureka Server 的高可用

  9. SEO 搜索 形成一个关联

  10. Django自定义认证系统

    官网教程:https://docs.djangoproject.com/en/2.2/topics/auth/customizing/ app下的model.py from django.db imp ...