Why I can't add a Text widget inside Stack

I am trying something like this but it doesnt work

  return Scaffold(
   body: Container(
     child: Stack(
      children: <Widget>[
        Container(
          decoration: BoxDecoration(
            image: DecorationImage(
                image: AssetImage("img/spider.jpg"), fit: BoxFit.cover),
          ),
            child: Column(children: <Widget>[Text("Test")],),
         ),
       ],
     ),
   ),
 );

`

Hello and welcome, you have the Text widget (inside a Column) as the child of the container that you are using to display the spider image with DecorationImage, but it should be its sibling in the Stack. This works as you should expect:

    return Scaffold(
      body: SafeArea(
        child: Container(
          child: Stack(
            children: <Widget>[
              Container(
                  decoration: BoxDecoration(
                image: DecorationImage(
                    image: AssetImage("img/spider.png"), fit: BoxFit.cover),
              )),
              Text("Spider",
                  style: TextStyle(
                      fontWeight: FontWeight.bold,
                      fontSize: 72,
                      color: Colors.white)),
            ],
          ),
        ),
      ),
    );

I wrapped it all in a SafeArea because … why not?! :slightly_smiling_face:

thank you patrick :slight_smile:

You are welcome, Ali :slightly_smiling_face:

1 Like