FLUTTER: How to make a persitent background image for app

Question

I want to use the same background image for all screen in my app, make it static so it don't move when I use navigator. Do you have an idea how to do that ?

Answer 1

You can define a widget with a background image and stack your desired screen on top of that.

class BackgroundPage extends StatelessWidget {
  const BackgroundPage({
    Key key,
    @required this.child,
  }) : super(key: key);

  /// The widget to display
  final Widget child;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: <Widget>[
          Container(
            decoration: BoxDecoration(
              image: DecorationImage(
                image: ExactAssetImage('image.png'),
              ),
            ),
          ),
          child,
        ],
      ),
    );
  }
}