Flutter container write text over background image

Issue

I want to make a design like following

I build the base layout with background image. Following is the code to achieve that. Now i want to put "Grocery store" Text on top of this image and other widgets. How can i do that ?

Widget build(BuildContext context) {
return Container(
  height: 190.0,
  width: size.width,
  margin: const EdgeInsets.symmetric(
    horizontal: 16.0,
  ),
  child: Column(
    crossAxisAlignment: CrossAxisAlignment.stretch,
    children: <Widget>[
      Expanded(
        child: Row(
          children: <Widget>[
            Expanded(
              child: Container(
                width: size.width,
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(11.0),
                  image: DecorationImage(
                    image: NetworkImage(https://www.exampledomain.com/images/background.jpg),
                    fit: BoxFit.cover,
                  ),
                ),
                // child: ????
                
              ),
            ),
          ],
        ),
      ),
    ],
  ),
);}

Solution

child: Container(
                width: size.width,
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(11.0),
                  image: DecorationImage(
                    image: NetworkImage(https://www.exampledomain.com/images/background.jpg),
                    fit: BoxFit.cover,
                  ),
                ),
                child: Text('Grocery store'),
                //padding: <-- Using to shift text position a little bit for your requirement
              ),

Answered By – Jim

Answer Checked By – Mary Flores (FlutterFixes Volunteer)