Flutter 固定底部导航栏

 

如图一的立即兑换按钮,整个一行都固定在底部

Flutter有个bottomNavigationBar这个组件

 

Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('积分商城'),
      ),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[BennerSwiper(), GoodInfo()],
      ),
      bottomNavigationBar: ImmediatelyChange,
    );
  }

 

//底部的立即兑换
Widget ImmediatelyChange = Container(
  height: 50.0,
  child: Row(
    mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
      Expanded(
        flex: 1,
        child: Container(
          height: 50.0,
          color: Colors.white,
        ),
      ),
      Expanded(
        flex: 1,
        child: Container(
          height: 50.0,
          color: Colors.red,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text(
                '立即兑换',
                style: TextStyle(color: Colors.white,fontSize: 18.0),
              )
            ],
          ),
        ),
      ),
    ],
  ),
);