美文网首页
FractionallySizedBox相对父组件尺寸组件-定位

FractionallySizedBox相对父组件尺寸组件-定位

作者: 爱吃豆包 | 来源:发表于2023-03-11 16:34 被阅读0次

FractionallySizedBox 是一个相对父组件尺寸的组件,比如占父组件的70%:

Container(
  height: 200,
  width: 200,
  color: Colors.blue,
  child: FractionallySizedBox(
    widthFactor: .8,
    heightFactor: .3,
    child: Container(
      color: Colors.red,
    ),
  ),
)

image

通过 alignment 参数控制子组件显示的位置,默认为居中,用法如下:

FractionallySizedBox(
  alignment: Alignment.center,
  ...
)

相关文章

  • Flutter 组件 — FractionallySizedBo

    FractionallySizedBox介绍 当我们需要一个控件的尺寸是相对尺寸时,比如当前按钮的宽度占父组件的7...

  • vue中结合betterScroll制作一个城市选择

    ###父组件 ###城市列表组件 ######右边字母定位

  • 插槽

    1、作用:让父组件可以向子组件指定位置插入html结构,也是一种组件之间通信的方式, 适用于 父组件===>...

  • vue组建中子组件向父组件中传递值

    子组件向父组件传值相对来说繁琐,子组件中需要在方法中使用$emit向父组件自定义事件对应的方法传值,父组件需要在自...

  • 14-vue 插槽 slot

    1. 作用 让父组件可以向子组件指定位置插入 html 结构,也是一种组件间通信的方式,适用于父组件向子组件通信。...

  • Tailwind Alert

    基本结构 alert组件容器 父级容器:采用相对定义因为内部按钮需要使用绝对定位 alert组件内部分为三部分,依...

  • vue源码解读--props(更新)

    本节示例代码如下 父组件 子组件 定位断点 经过之前章节的介绍,我们知道了。父组件中存在components属性时...

  • 插槽(默认插槽、具名插槽、作用域插槽)

    默认插槽 1.作用:让父组件可以向子组件指定位置插入 html 结构,也是一种组件间通信的方式,适用于父组件 ==...

  • Angular5 父子组件之间的通信

    一、父组件向子组件通信 父组件: 子组件: 二、子组件向父组件通信 父组件: 子组件:

  • 知识 | 父与子传值

    参考地址1参考地址2 父传子 父组件 子组件 子传父 子组件 父组件 父调用子组件的方法 父组件 子组件: 父组件...

网友评论

      本文标题:FractionallySizedBox相对父组件尺寸组件-定位

      本文链接:https://www.haomeiwen.com/subject/bnhuaktx.html