Flutter中的Stack、Align、Positioned的使用
import 'package:flutter/material.dart';
import 'package:flutter_testdemo001/res/listData.dart'; void main() {
runApp(MyApp());
} class MyApp extends StatelessWidget {
const MyApp({Key key}) : super(key: key); @override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text("flutter demo"),
),
body: HomeContent(),
),
);
}
} class HomeContent extends StatelessWidget {
@override
Widget build(BuildContext context) {
// return Center(
// child: Stack(
// alignment: Alignment.center,
// children: <Widget>[
// Container(
// height: 400,
// width: 300,
// color: Colors.red,
// ),
// Text("我是一个文本", style: TextStyle(fontSize: 20, color: Colors.white))
// ],
// ),
// ); return Center(
child: Container(
height: ,
width: ,
color: Colors.red,
child: Stack(
children: <Widget>[
Align(
alignment: Alignment.topLeft,
child: Icon(Icons.home,size:,color: Colors.white),
),
Align(
alignment: Alignment.center,
child: Icon(Icons.block,size:,color: Colors.white),
),
Align(
alignment: Alignment.bottomRight,
child: Icon(Icons.search,size:,color: Colors.white),
),
],
),
),
);
}
}
Flutter中的Stack、Align、Positioned的使用的更多相关文章
- Flutter 布局类组件:层叠布局(Stack和Positioned)
前言 层叠布局,即子组件可以根据距父容器四个角的位置来确定自身的位置.绝对定位运行子组件堆叠起来,即按照代码中声明的顺序. Flutter中使用Stack和Positioned这两个组件来配合实现绝对 ...
- 11Flutter页面布局 Stack层叠组件 Stack与Align Stack与Positioned实现定位布局
/* Flutter 页面布局 Stack层叠组件: Stack与Align Stack与Positioned实现定位布局: Flutter Stack组件: Stack表示堆得意思,我们可以用Sta ...
- 定位布局 Stack 层叠组件 Stack 与 Align Stack 与 Positioned 实现
一.Flutter Stack 组件 Stack 表示堆的意思,我们可以用 Stack 或者 Stack 结合 Align 或者 Stack 结合 Positiond 来实现页面的定位布局 align ...
- flutter系列之:flutter中常用的Stack layout详解
[toc] 简介 对于现代APP的应用来说,为了更加美观,通常会需要用到不同图像的堆叠效果,比如在一个APP用户背景头像上面添加一个按钮,表示可以修改用户信息等. 要实现这样的效果,我们需要在一个Im ...
- flutter 中的样式
flutter 中的样式 样式 值 width 320.0 height 240.0 color Colors.white,Colors.grey[300] textAlign TextAlign.c ...
- Flutter中管理路由栈的方法和应用
原文地址:https://www.jianshu.com/p/5df089d360e4 本文首先讲的Flutter中的路由,然后主要讲下Flutter中栈管理的几种方法. 了解下Route和Navig ...
- 【转】JVM运行原理及JVM中的Stack和Heap的实现过程
来自: http://blog.csdn.net//u011067360/article/details/46047521 Java语言写的源程序通过Java编译器,编译成与平台无关的‘字节码程序’( ...
- 在Flutter中嵌入Native组件的正确姿势是...
引言 在漫长的从Native向Flutter过渡的混合工程时期,要想平滑地过渡,在Flutter中使用Native中较为完善的控件会是一个很好的选择.本文希望向大家介绍AndroidView的使用方式 ...
- 从零学习Fluter(五):Flutter中手势滑动拖动已经网络请求
从六号开始搞Flutter,到今天写这篇blog已经过了4天时间,文档初步浏览了一遍,写下了这个demo.demo源码分享在github上,现在对flutter有种说不出的喜欢了.大家一起搞吧! 废话 ...
随机推荐
- 深度学习环境搭建(CUDA9.0 + cudnn-9.0-linux-x64-v7 + tensorflow_gpu-1.8.0 + keras)
关于计算机的硬件配置说明 推荐配置 如果您是高校学生或者高级研究人员,并且实验室或者个人资金充沛,建议您采用如下配置: 主板:X299型号或Z270型号 CPU: i7-6950X或i7-7700K ...
- P3225 [HNOI2012]矿场搭建[割点]
题目描述 煤矿工地可以看成是由隧道连接挖煤点组成的无向图.为安全起见,希望在工地发生事故时所有挖煤点的工人都能有一条出路逃到救援出口处.于是矿主决定在某些挖煤点设立救援出口,使得无论哪一个挖煤点坍塌之 ...
- solrconfig.xml配置文件
部分来自http://www.jianshu.com/p/8cf609207497 一.总览 solr的配置重要的有三个:solr.xml.solrConfig.xml.schema.xml solr ...
- 使用LoadRunner脚本并发下载文件,出现19890错误
需求:10个客户并发下载同一份zip文件.执行的时候,8个Fail了,只下载了两份zip,且无论执行多少遍,都是这样. 错误信息如下:message code:-19890C interpreter ...
- python - ORM 查询
1. 正常查询: ## 效率低,因为每次查询都是查询表和关联表的所有数据 ret = User.objects.all() for item in ret: print(item.name,item. ...
- python - 登陆验证的滑块接口
----------------- 滑块接口 ----------------- 0:大体思路:点击登陆按钮的时候会进行第一次验证(滑块验证),然后访问后台滑块接口,并返回验证结果,如果滑块接口通 ...
- HTML 010 radio
Struts2单选按钮标签s:radio的使用及其设置默认值 转载atom168 发布于2014-12-01 15:40:59 阅读数 519 收藏 展开 首先在页面中引入struts标签库: &l ...
- greenplum 表在各个节点数据的分布情况
select gp_segment_id,count(*) from table_name group by gp_segment_id;
- 谈MongoDB的应用场景
转载自:http://blog.csdn.net/adparking/article/details/38727911 MongoDB的应用场景在网上搜索了下,很少介绍关于传统的信息化应用中如何使用M ...
- Intel 8086 CPU
一.8086概述 Intel8086拥有四个16位的通用寄存器,也能够当作八个8位寄存器来存取,以及四个16位索引寄存器(包含了堆栈指标).资料寄存器通常由指令隐含地使用,针对暂存值需要复杂的寄存器配 ...