Search code examples
flutterflutter-layoutflutter-design

Flutter - Stack with Scaffold


I'm currently using Scaffold with BottomNavigationBar in a project and need to display a separated widget on top of all that.

Tried to create a Stack on the build return and put this widget and the Scaffold as the children, but the widget is simply not displayed (not showed at all)! There isn't any error messages either.

What could be wrong? Or there is any other approach? (calling AlertDialog won't work for this purpose).

Defining the Stack on the body of the Scaffold didn't work also, as it need a list for the BottomNavigationBar.

    Widget build(BuildContext context) {
        var Test = Center(
          child: SizedBox(width: 100, height: 100,
          child: Container(
              color: Colors.blue,
              child: Text("Test"),),),);
      return Stack(
        alignment: Alignment.center,
        children: [
          Test,
          Scaffold(
            appBar: ..... (rest of the code)

Solution

  • As @HBS mentioned, the problem was caused by the Stack ordering, but the fixing can be achieved just by changing the Widget order:

    Widget build(BuildContext context) {
        var Test = Center(
          child: SizedBox(width: 100, height: 100,
          child: Container(
              color: Colors.blue,
              child: Text("Test"),),),);
      return Stack(
        alignment: Alignment.center,
        children: [
          Scaffold(
            appBar: ..... (rest of the code),
            Test,
            ],