1 OverflowBox
对其子项施加不同约束的widget,它可能允许子项溢出父级
2 构造函数
OverflowBox({ Key key, this.alignment = Alignment.center, this.minWidth, this.maxWidth, this.minHeight, this.maxHeight, Widget child, })
复制
3 常用属性
3.1 alignment:对齐方式
alignment:Alignment.center,
复制
3.1.1 顶部左边
alignment:Alignment.topLeft,
复制
3.1.2 顶部中间
alignment:Alignment.topCenter,
复制
3.1.3 顶部右边
alignment:Alignment.topRight,
复制
3.1.4 中部左边
alignment:Alignment.centerLeft,
复制
3.1.5 中部中间
alignment:Alignment.center,
复制
3.1.6 中部右边
alignment:Alignment.centerRight,
复制
3.1.7 底部左边
alignment:Alignment.bottomLeft,
复制
3.1.8 底部中间
alignment:Alignment.bottomCenter,
复制
3.1.9 底部右边
alignment:Alignment.bottomRight,
复制
3.2 minWidth:允许child的最小宽度,如果child宽度小于这个值,则按照最小宽度进行显示
minWidth: 200.0,
复制
3.3 maxWidth:允许child的最大宽度,如果child宽度大于这个值,则按照最大宽度进行展示
maxWidth: 200.0,
复制
3.4 minHeight:允许child的最小高度,如果child高度小于这个值,则按照最小高度进行显示
minHeight: 200.0,
复制
3.5 maxHeight:允许child的最大高度,如果child高度大于这个值,则按照最大高度进行展示
maxHeight: 200.0,
复制
3.6 child:子widget
child: Text('你好 Flutter'),
复制
4 显示效果
5 widget代码
import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:flutter_markdown/flutter_markdown.dart'; // 字体适配 import '../../utils/app_size.dart'; class ListOverflowBox extends StatelessWidget { @override Widget build(BuildContext context) { return DefaultTabController( length: 2, child: Scaffold( appBar: AppBar( title: Text('OverflowBox'), backgroundColor: Color(0xFFfafcff), bottom: TabBar(labelColor: Color(0xff030303), tabs: [ Tab( text: "效果", ), Tab( text: "属性", ) ]), ), body: TabBarView(children: [ Container( decoration: new BoxDecoration( color: new Color(0xffffffff), borderRadius: new BorderRadius.circular((AppSize.width(20))), ), child: ShowEffect()), Container( decoration: new BoxDecoration( color: new Color(0xffffffff), borderRadius: new BorderRadius.circular((AppSize.width(20))), ), child: ShowAttribute()), ]), ), ); } } // 效果 class ShowEffect extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar( title: Text("WidgetsApp Demo"), ), body: Container( //1 注意:父容器的宽高是200 减去pading后是180 padding: EdgeInsets.all(10), color: Colors.green, width: 200, height: 200, child: new OverflowBox( maxHeight: 400, //2 不能小于父容器的高度180 child: new Container( color: Colors.deepOrange, width: 200, height: 600, ), ), ), ), ); } } // 属性 class ShowAttribute extends StatelessWidget { @override Widget build(BuildContext context) { return Container( child: FutureBuilder( future: rootBundle.loadString('lib/markdown/overflowBox.md'), builder: (BuildContext context, AsyncSnapshot snapshot) { if (snapshot.hasData) { return Markdown( data: snapshot.data, selectable: true, ); } else { return Center( child: Text("加载中..."), ); } }, ), ); } }
复制