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有种说不出的喜欢了.大家一起搞吧! 废话 ...
随机推荐
- 3.XPath
使用XPath可以在不遍历xml文档的情况下选择具体节点. 转自https://www.cnblogs.com/vaevvaev/p/6928201.html XPath可以快速定位到Xml中的节点或 ...
- 使用vue打包,vendor文件过大,或者是app.js文件很大
我的解决办法: 1.把不常改变的库放到index.html中,通过cdn引入,比如下面这样: 然后找到build/webpack.base.conf.js文件,在 module.exports = { ...
- python网络-静态Web服务器案例(29)
一.静态Web服务器案例代码static_web_server.py # coding:utf-8 # 导入socket模块 import socket # 导入正则表达式模块 import re # ...
- python递归的最大层数?
Python的最大递归层数是可以设置的,默认的在window上的最大递归层数是 998. 可以通过sys.setrecursionlimit()进行设置,但是一般默认不会超过3925-3929这个范围 ...
- HTML中的标签列表
1 :基础标签 <!DOCTYPE> :定义文档类型 <title>:定义文档标题 <h1>to<h2>定义HTML标题,其中h1到h6表示字体大小依次 ...
- NoSql数据库使用半年后在设计上面的一些心得 (转载)
NoSql数据库这个概念听闻许久了,也陆续看到很多公司和产品都在使用,优缺点似乎都被分析的清清楚楚.但我心里一直存有一个疑惑,它的出现究竟是为了解决什么问题? 这个疑惑非常大,为此我看了很多分析文章, ...
- 014_Python3 循环语句
1.while 循环 #!/usr/bin/env python3 n = 100 sum = 0 counter = 1 while counter <= n: sum = s ...
- OSS使用
https://www.cnblogs.com/wumian1360/p/8486726.html https://help.aliyun.com/document_detail/52204.html ...
- GitHub上的一些使用技巧
1.搜索 转:掌握 3 个搜索技巧,在 GitHub 上快速找到实用软件资源 例如 查找位于深圳的C#开发者 2.查看文件历史提交记录 定位至需要查看的文件 修改地址栏github.com 为 git ...
- C结构体指针的初步使用
#include <stdio.h> #include <string.h> struct Books { char title[50]; //char author[100] ...