//……省略无关代码……

child: new Column(
children: <Widget>[
new SizedBox(height: 20.0),
new Stack(
alignment: const FractionalOffset(0.9, 0.1),//方法一
children: <Widget>[
new Image(
image: new AssetImage("assets/images/illustration_11.jpg"),
width: 300.0,
height: 200.0,
fit: BoxFit.cover,
),
new Opacity(
opacity: 0.8,
child: new Image(
image: new AssetImage("assets/images/illustration_12.jpg"),
width: 200.0,
height: 150.0,
fit: BoxFit.cover,
),
),
new GestureDetector(
onTap: () {
Fluttertoast.showToast(msg: "分享一下咯");
},
child: new Icon(Icons.share, color: Colors.white),
),
],
),
new SizedBox(height: 20.0),
new Stack(
children: <Widget>[
new Image(
image: new AssetImage("assets/images/illustration_11.jpg"),
width: 300.0,
height: 200.0,
fit: BoxFit.cover,
),
new Positioned(//方法二
right: 15.0,
top: 15.0,
child: new Icon(
Icons.share,
color: Colors.white,
),
),
],
)
],
), //……省略无关代码……

  

方法一

使用alignment配合FractionalOffset:对于FractionalOffset的参数,我是这么理解的:相当于比例,第一个代表横向的权重,第二个代表竖向的权重,横0.9代表在横向十分之九的位置,竖0.1代表在竖向十分之一的位置

方法二

使用定位组件Positioned,其中的top、right、buttom、left,直接代表,距离该方向的距离

Stack布局中定位的方式的更多相关文章

  1. Flutter Stack布局中定位的方式

    前言 想要记录一下Stack布局中,定位的两种方式 代码 //……省略无关代码…… child: new Column( children: <Widget>[ new SizedBox( ...

  2. CSS布局中的问题解决方式

    1.解决搜索框和按钮不对齐的方法 vertical-align属性只有两个元素设置为display:inline-block才有效 2.盒子莫名的分行现象 问题描述:比如父盒子宽度为960px,两个左 ...

  3. IOS自己主动布局中的浮动布局(6)----MyFloatLayout横空出世

    https://github.com/youngsoft/MyLinearLayout 前言 在MyLayout的6大布局中,每种布局都有不同的应用场景. 且每种布局的子视图的约束机制不一样:线性布局 ...

  4. Android中得到布局文件对象有三种方式

    Android中得到布局文件对象有三种方式 第一种,通过Activity对象 View view = Activity对象.getLayoutInflater().inflater(R.layout. ...

  5. flex布局中flex-grow与flex-shrink的计算方式

    CSS 中的 Flex(弹性布局) 可以很灵活的控制网页的布局,其中决定 Flex 布局内项目宽度/高度的是三个属性: flex-basis, flex-grow, flex-shrink. flex ...

  6. 定位布局中关于z-index的一些问题

    定位布局中关于z-index的一些问题 使不同父元素的子元素不会被其他父元素遮盖 背景 两父元素相互遮盖(或部分遮盖) html如下 <div class="main"> ...

  7. 在网页布局中合理使用inline formating context(IFC)

    引子:给大家出一个小小的考题,如何使用css来实现类似下面的在指定区域内,内容自适应的垂直居中.

  8. 奇妙的CSS之布局与定位

    前言 关于布局与定位是Web前端开发里非常基础而又重要的部分.介绍相关知识的文章,很容易就可以找到.虽然,这方面的知识点不是很多,但我们如果不弄清楚,在运用时候往往会出现预料之外的布局,这些“意外”有 ...

  9. css+div网页设计(二)--布局与定位

    在网页设计中,能否控制好各个模块中在页面中的位置是非常关键的,与传统的表格定位不同,css+div定位方式更加的灵活,本篇博客将为大家介绍css+div的布局与定位. 一.盒子模型 由图可以看出 盒子 ...

随机推荐

  1. [Web] HTML5新特性history pushState/replaceState解决浏览器刷新缓存

    转载: https://www.jianshu.com/p/cf63a1fabc86 现实开发中,例如‘商品列表页’跳转‘商品详情页’,返回时,不重新加载刷新页面,并且滚动到原来的位置. 1.首先,先 ...

  2. Camtasia如何录制小文件视频

      Camtasia 录制设置   FrameRate设成4就行,音频格式:PCM, 8000Hz, 8 位, 单声道, 7KB/秒 ,这样更小.   文章来源:刘俊涛的博客 欢迎关注公众号.留言.评 ...

  3. order by 多个条件

    ORDER子句按一个或多个(最多16个)字段排序查询结果,可以是升序(ASC)也可以是降序(DESC),缺省是升序.ORDER子句通常放在SQL语句的最后.ORDER子句中定义了多个字段,则按照字段的 ...

  4. C++11版本不能使用一个单行命名空间方式特化一个函数的bug

    warning: specialization of ‘template<class _Iterator> struct std::iterator_traits’ in differen ...

  5. git clone指定branch或tag

    git clone指定branch或tag发布时间:October 28, 2018 // 分类: // No Comments 取完整: git clone https://github.com/a ...

  6. 蓝牙BLE: ATT协议层中属性(Attribute)

    ATT(Attribute Protocol)属性层是GATT和GAP的基础,它定义了BLE协议栈上层的数据结构和组织方式. 属性(Attribute)概念是ATT层的核心,ATT层定义了属性的内容, ...

  7. Android ImageView属性

    ImageView 继承自View组件,主要功能是用于显示图片,实际上它不仅仅可以用来显示图片,任何Drawable对象都可以使用ImageView来显示.ImageView可以适用于任何布局中,并且 ...

  8. MYSQL报错:1055 - Expression #1 of SELECT list is not in GROUP BY clause and contains nonaggregated column

    1055 - Expression #1 of SELECT list is not in GROUP BY clause and contains nonaggregated column 'rpa ...

  9. vue---父子组件之间的通信【props,$refs、$emit】

    在用vue进行项目开发的时候,父子组件之间的通信是经常被用到的,下面就来具体说说父子组件通信的三种方式: 父组件: <template> <div> <h1>我是父 ...

  10. WebGL学习笔记(十三):拾取

    目前为止,我们还没有涉及到交互相关的内容,实际上,我们是需要知道我们点击的地方下面的第一个物体的信息,这个过程称为拾取. 简单拾取实现 我们可以通过颜色来获取是否成功点击,具体方式如下: 场景中有一个 ...