如何将抽奖动画扩展到整个屏幕-Flutter

Question

我目前正在尝试在我的应用中制作渐变背景动画……我是在大量动画的帮助下实现的！我试图将其封闭在容器中，并成功地做到了这一点。但是有一个问题，尽管我将高度更改为大于2000的值，但我仍然无法使容器大于一定的数量。我真的不知道该怎么做才能确保容器中没有空格。屏幕，并且此渐变会填充所有设备的屏幕。这是代码。我还在屏幕截图中添加了它的外观，以便您了解发生了什么。

import 'package:flutter/material.dart';
import 'package:lottie/lottie.dart';

class WelcomeScreen extends StatefulWidget {
  @override
  _WelcomeScreenState createState() => _WelcomeScreenState();
}

class _WelcomeScreenState extends State<WelcomeScreen> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
      body: Padding(
        padding: const EdgeInsets.all(0),
        child: Container(
          height: 1000,
          width: 1000,
          child: Lottie.asset('assets/gradient-background.json'),
        ),
      ),
    ));
  }
}

我是扑扑开发的新手，所以如果这是一个非常愚蠢的错误，请原谅我！非常感谢，非常感谢您的帮助！

Answer 1

首先，我要感谢大家的帮助。特别感谢Nehal，因为他让我意识到了fit属性，事实证明这是lotty资产动画的功能！非常感谢，这是正确的代码：

import 'package:flutter/material.dart';
import 'package:lottie/lottie.dart';

class WelcomeScreen extends StatefulWidget {
  @override
  _WelcomeScreenState createState() => _WelcomeScreenState();
}

class _WelcomeScreenState extends State<WelcomeScreen> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
      body: Container(
        height: double.infinity,
        width: double.infinity,
        child:
            Lottie.asset('assets/gradient-background.json', fit: BoxFit.cover),
      ),
    ));
  }
}

Answer 2

使用展开的小部件，不要使用任何填充。您无需提及容器的高度或宽度，并在装饰容器时使用background属性

<input type="text" id="testBox" placeholder="text box" />

此外，您还可以使用自定义渐变效果而不是使用背景图片。