flutter-Container

简介: flutter-Container

Container

是有多个widget组成的(LimitedBox->ConstrainedBox->Align->Padding->DecoratedBox->ConstrainedBox->Padding->Transform)

constraints:添加到child上额外的约束条件 最大最小值
current = ConstrainedBox(constraints: constraints, child: 
current);
alignment:控制child的对齐方式,
current = Align(alignment: alignment, child: current);
padding:文本区域和widget之间
current = Padding(padding: effectivePadding, child: current);
margin :widget和widget之间
current = Padding(padding: margin, child: current);

decoration

decoration: 背景装饰 类似android中的shape 边框 圆角,背景色,背景图片等

current = DecoratedBox(decoration: decoration, child: current);
 const BoxDecoration({
    this.color,
    this.image,
    this.border,
    this.borderRadius,
    this.boxShadow,
    this.gradient,
    this.backgroundBlendMode,
    this.shape = BoxShape.rectangle,
  }) : assert(shape != null),
       assert(
         backgroundBlendMode == null || color != null || gradient != null,
         'backgroundBlendMode applies to BoxDecoration\'s background color or '
         'gradient, but no color or gradient was provided.'
       );


color:背景色,最后也会设置到decoration这个widget上面 所以不可同时设置color和decoration

//断言不能同时存在
assert(color == null || decoration == null)
//用color生成BoxDecoration
decoration = decoration ?? (color != null ? BoxDecoration(color: color) : null),

foregroundDecoration 前景色 DecoratedBox 底部颜色即背景色,中间内容,顶部颜色即前景色 会遮挡中间内容


current = DecoratedBox(  decoration: foregroundDecoration,  position: DecorationPosition.foreground,  child: current,);


width height 最后要作用到BoxConstraints,由BoxConstraints限制范围


 constraints =
        (width != null || height != null)
          ? constraints?.tighten(width: width, height: height)
            ?? BoxConstraints.tightFor(width: width, height: height)
          : constraints,


dart 语法学习

三元表达式 ?:

??

相关文章
|
小程序
UniApp video 使用(自定义进度条,及微信无法暂停播放设置进度问题)
UniApp video 使用(自定义进度条,及微信无法暂停播放设置进度问题)
2327 0
|
IDE Java 开发工具
解决IntelliJ IDEA报错Error:Cannot determine path to ‘tools.jar‘ library for 17 (D:/JAVA)
解决IntelliJ IDEA报错Error:Cannot determine path to ‘tools.jar‘ library for 17 (D:/JAVA)
1337 0
|
缓存 搜索推荐 JavaScript
|
存储 消息中间件 NoSQL
【redis】redis的特性和主要应用场景
【redis】redis的特性和主要应用场景
678 2
|
Java 开发工具 Android开发
解决flutter doctor出现Android license status unknown或cmdline-tools component is missing
解决flutter doctor出现Android license status unknown或cmdline-tools component is missing
495 4
解决flutter doctor出现Android license status unknown或cmdline-tools component is missing
|
开发者
flutter:功能性组件 (八)
本文介绍了Flutter中常用的UI组件和功能,包括进度指示器(线性和圆形)、下拉刷新、选项按钮(单选按钮、复选框、开关)、手势识别(GestureDetector、Ink和InkWell)以及提示和Offstage组件的使用方法和示例代码。这些组件和功能可以帮助开发者快速构建交互丰富的应用程序界面。
216 0
|
XML 安全 Android开发
Flutter配置Android和IOS允许http访问
Flutter配置Android和IOS允许http访问
550 3
|
JavaScript 前端开发 API
Vue3之script-setup 语法糖
本文介绍了Vue 3的`<script setup>`语法糖,通过示例代码演示了如何在组件中使用`<script setup>`以及相关的Vue 3 Composition API函数和特性,如响应式引用、生命周期钩子、CSS模块等,并展示了组件间的通信和样式应用。
412 0
Vue3之script-setup 语法糖
|
Java 开发工具
开发工具系类 之 Cannot determine path to ‘tools.jar‘ library for 17 (D:/Program Files/Java/jdk-17.0.9)
这篇文章讲述了作者在升级JDK至17版本后遇到IDEA无法识别`tools.jar`的问题,并提供了两种解决方法:升级IDEA版本或降低JDK版本,并提供了相关版本的IDEA兼容性信息。
开发工具系类 之 Cannot determine path to ‘tools.jar‘ library for 17 (D:/Program Files/Java/jdk-17.0.9)
|
编解码 Dart 网络协议
Flutter如何玩转超低延迟RTSP/RTMP播放,跨平台视频流体验大升级,让你的应用秒变直播神器!
【9月更文挑战第3天】Flutter作为谷歌推出的跨平台移动UI框架,凭借高性能和丰富的生态系统广受好评。本文详细介绍如何在Flutter应用中实现低延迟的跨平台RTSP/RTMP播放,并提供具体示例代码。首先介绍了如何使用`flutter_vlc_player`播放RTSP流,然后讨论了优化视频播放以降低延迟的方法,包括调整播放器配置等。通过选用合适的播放器插件并进行优化,Flutter可在视频流播放领域提供卓越的用户体验。随着生态的发展,Flutter有望成为视频流媒体开发的首选框架。
1479 6