Блог

Это мой первый раз, когда я использую flutter, и когда я добавил фон, он отлично работал с этим:

 class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    const darkBlueColor = const Color(0xff131f40);
    const lightBlueColor = const Color(0xff445c9e);
    return Scaffold(
      body: Center(
        child: Container(
          decoration: BoxDecoration(
            gradient: LinearGradient(
              colors: [
                darkBlueColor,
                lightBlueColor,
              ],
              stops: [0.5, 1],
              begin: const FractionalOffset(0.5, 0.2),
              end: const FractionalOffset(1, 1),
            ),
          ),
        ),
      ),
    );
  }
}
 

но когда я добавил столбец, чтобы у меня было больше дочерних функций, фон отображался только на моей добавленной фотографии:

Вот мой код с использованием столбца:

 class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    const darkBlueColor = const Color(0xff131f40);
    const lightBlueColor = const Color(0xff445c9e);
    return Scaffold(
      body: Column(
        children: [
          Container(
            decoration: BoxDecoration(
              gradient: LinearGradient(
                colors: [
                  darkBlueColor,
                  lightBlueColor,
                ],
                stops: [0.5, 1],
                begin: const FractionalOffset(0.5, 0.2),
                end: const FractionalOffset(1, 1),
              ),
            ),
            child: LppImage(),
          ),
        ],
      ),
    );
  }
}
 

Поэтому, если кто-нибудь знает, как решить эту проблему, пожалуйста, помогите. Спасибо вам 🙂

Вам лучше использовать Stack вместо Column этого, если вы хотите разместить другие элементы пользовательского интерфейса над фоном. Чтобы сделать фон заполняющим весь экран, используйте Positioned.fill внутри Stack :

 class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    const darkBlueColor = const Color(0xff131f40);
    const lightBlueColor = const Color(0xff445c9e);
    return Scaffold(
      body: Stack(
        children: [
          Positioned.fill(
            child: Container(
              decoration: BoxDecoration(
                gradient: LinearGradient(
                  colors: [
                    darkBlueColor,
                    lightBlueColor,
                  ],
                  stops: [0.5, 1],
                  begin: const FractionalOffset(0.5, 0.2),
                  end: const FractionalOffset(1, 1),
                ),
              ),
              child: LppImage(),
            ),
          ),
        ],
      ),
    );
  }
}