简单描述下，个人初步接触flutter，因需求需要，将一组按钮写成公共组件各页面进行嵌套，多个页面需要使用这些按钮进行业务操作。我这边实现的方式就是将按钮做一次封装，哪一个页面需要用这些按钮的时候将页面的widget传入。组件中使用stack进行层叠布局。当进行引用的时候，如下图：
其中，蓝色的框为我写的组件部分，但是目前发现问题是，因为层叠，底下的内容被覆盖上无法查看，解决方案又不想把业务内容的下面添加类似一个空白的Container把最下面内容撑开，因此，各位flutter开发有无好的意见建议对封装的组件部分代码进行改造的？下面是我封装的代码具体内容
@override
Widget build(BuildContext context) {
var root = Stack(
alignment: AlignmentDirectional.bottomCenter,
children: <Widget>[
Positioned(
child: this.widget.busParams,
),
Positioned(
width: 420,
//bottom: 20,
child: Container(
decoration: new BoxDecoration(
color: Color(0xFFFAFAFA),
),
child: new Column(children: <Widget>[
SizedBox(
height: Screen.uiSize(54),
),
widget.finalPermission
? Container(
padding: EdgeInsets.only(left: Screen.uiSize(42),
right:Screen.uiSize(42)),
child: MaterialButton(
minWidth: double.infinity,
height: Screen.uiSize(80),
color: BaseColor.theme,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(27.5),
),
onPressed: () {
showMain();
},
child: Text(
'终审通过',
style: TextStyle(color: Colors.white, fontSize: Screen.uiSize(36)),
),
),
)
: Container(),
SizedBox(
height: Screen.uiSize(52),
),
Container(
height: 50,
padding: EdgeInsets.only(left: Screen.uiSize(42), right:Screen.uiSize(42)),
child: new Row(
children: <Widget>[
widget.refusePermission
? Expanded(
flex: 4,
child: MaterialButton(
minWidth: double.infinity,
height: Screen.uiSize(72),
color: BaseColor.theme,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(27.5),
),
onPressed: () {
Pages.pubRefuseManage(
widget.pageLevel + 1)
.push<int>(context, (result) {
// print(result);
});
},
child: Text(
'拒绝',
style: TextStyle(
color: Colors.white, fontSize: Screen.uiSize(32)),
),
),
)
: Expanded(
flex: 4,
child: Container(),
),
SizedBox(
width: Screen.uiSize(42),
),
widget.continuePermisson
? Expanded(
flex: 4,
child: MaterialButton(
minWidth: double.infinity,
height: Screen.uiSize(72),
color: BaseColor.theme,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(27.5),
),
onPressed: () {
Pages.submitChoosePage(widget.pageLevel + 1, {}).push<int>(context,
(result) {
// print(result);
});
},
child: Text(
'继续提交',
style: TextStyle(
color: Colors.white, fontSize: Screen.uiSize(32)),
),
),
)
: Expanded(
flex: 4,
child: Container(),
),
SizedBox(
width: Screen.uiSize(42),
),
widget.backPermission
? Expanded(
flex: 4,
child: MaterialButton(
minWidth: double.infinity,
height: Screen.uiSize(72),
color: BaseColor.theme,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(27.5),
),
onPressed: () {},
child: Text(
'退回',
style: TextStyle(
color: Colors.white, fontSize: Screen.uiSize(32)),
),
),
)
: Expanded(
flex: 4,
child: Container(),
),
],
),
),
SizedBox(
height: Screen.uiSize(65),
),
])),
),
],
);
return root;
}
