长按拖拽组件 - LongPressDraggable
设置拖拽手势响应时间属性 delay
/// The duration that a user has to press down before a long press is registered.
///
/// Defaults to [kLongPressTimeout].
/// const Duration kLongPressTimeout = Duration(milliseconds: 500);
final Duration delay;
系统介绍 delay 控制长按响应时间，默认为kLongPressTimeout 500毫秒。默认时间有点长，长按显得不灵敏。通过修改delay后拖拽体验更流畅
LongPressDraggable(
child: Container(),
feedback: Container(),
delay: Duration(milliseconds: 100), // 设置长按响应时间为100毫秒
);
固定宽高比的组件 - AspectRatio
AspectRatio组件是固定宽高比的组件，如果组件的宽度固定，希望高是宽的1/2，可以用AspectRatio实现此效果，用法如下
AspectRatio(
aspectRatio: 2 / 1 ,
child: Container(color: Colors.black),
)
aspectRatio参数是宽高比，可以直接写成分数的形式，也可以写成小数的形式，但建议写成分数的形式，可读性更高
尺寸相对父组件尺寸比例组件 - FractionallySizedBox
当我们需要一个控件的尺寸是相对尺寸时，比如当前按钮的宽度占父组件的50%，可以使用FractionallySizedBox来实现此效果。
使用FractionallySizedBox包裹子控件，设置widthFactor宽度系数或者heightFactor高度系数，系数值的范围是0-1，0.5表示占父组件的50%，用法如下：
FractionallySizedBox(
widthFactor: .5,
child: Container(color: Colors.red),
)
约束子组件的最大宽高和最小宽高 - ConstrainedBox
ConstrainedBox组件 子组件的最大宽高和最小宽高，假如一个组件宽高都是300，包裹在ConstrainedBox中，并给ConstrainedBox添加最大宽高约束，用法如下：
ConstrainedBox(
constraints: BoxConstraints(maxHeight: 60, maxWidth: 200),
child: Container(height: 300, width: 300, color: Colors.yellow),
);
其中Container 也有constraints 属性，控制最大、小 宽高
Container(
constraints: BoxConstraints(
maxWidth: 100,
minWidth: 50,
maxHeight: 100,
minHeight: 100,
),
child: Text('123'),
);
指定顺序stack布局组件 - IndexedStack
IndexedStack是Stack的子类，Stack是将所有的子组件叠加显示，而IndexedStack只显示指定的子组件，用法如下：
IndexedStack(
index: _index,
children: [
Center(
child: Container(
height: 300,
width: 300,
color: Colors.yellow,
),
),
Center(
child: Container(
height: 300,
width: 300,
color: Colors.red,
),
),
Center(
child: Container(
height: 300,
width: 300,
color: Colors.blueGrey,
),
),
],
);
通过修改_index 来改变显示哪个UI组件
LayoutBuilder组件
通过 LayoutBuilder，我们可以在布局过程中拿到父组件传递的约束信息，然后我们可以根据约束信息动态的构建不同的布局。
比如我们实现一个响应式的组件 ResponsiveColumn，它的功能是当当前可用的宽度小于 200 时，将子组件显示为一列，否则显示为两列。简单来实现一下：
LayoutBuilder(
builder: (BuildContext context, BoxConstraints constraints) {
if (constraints.maxWidth < 200) {
// 最大宽度小于200，显示单列
return Column(children: children, mainAxisSize: MainAxisSize.min);
} else {
// 大于200，显示双列
var _children = <Widget>[];
for (var i = 0; i < children.length; i += 2) {
if (i + 1 < children.length) {
_children.add(Row(
children: [children[i], children[i + 1]],
mainAxisSize: MainAxisSize.min,
));
} else {
_children.add(children[i]);
}
}
return Column(children: _children, mainAxisSize: MainAxisSize.min);
}
},
)
