颤振时容器尺寸的变化?宽度或高度都行

Question

我目前正在开发我的第一个扑动应用程序，我需要一些帮助与我的登录屏幕。

顶部在容器中有一个Lottiefile资源。底部有一些按钮。

是否可以根据底部部分的大小设置带有Lottiefile资产的容器的大小?我不想有一个滚动视图，所以一切都应该适合它一个屏幕。Lottiefile资产应该填充顶部和底部开始部分之间的空间。是否有可能根据自由空间的宽度和高度来设置大小?

我试图设置高度&宽度为两倍。无限，但这使我的应用程序崩溃了。

代码如下:

  class OnBoardingPage extends StatelessWidget {
  const OnBoardingPage({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    var size = MediaQuery.of(context).size;
    return Scaffold(
        appBar: AppBar(
          toolbarHeight: 0,
          elevation: 0,
          backgroundColor: AppColor.statusbarColor,
        ),
        backgroundColor: AppColor.statusbarColor,
        body: Column(
          mainAxisAlignment: MainAxisAlignment.spaceBetween, // <-- spaceBetween
          children: [
            Container(
              padding: EdgeInsets.symmetric(horizontal: size.width * 0.08),
              child: Column(
                children: [
                  SizedBox(
                    height: size.height * 0.03,
                  ),
                  Container(
                    width: double.infinity,
                    child: Lottie.asset('assets/images/files.json',
                        fit: BoxFit.cover, repeat: false),
                  ),
                ],
              ),
            ),
            Container(
              padding: EdgeInsets.symmetric(horizontal: size.width * 0.08),
              child: Column(
                children: [
                  SizedBox(
                    height: size.height * 0.05,
                  ),
                  Container(
                    height: size.height * 0.012,
                    width: size.width * 0.14,
                    decoration: BoxDecoration(
                        color: AppColor.textColor,
                        borderRadius: BorderRadius.circular(15)),
                  ),
                  SizedBox(
                    height: size.height * 0.03,
                  ),
                  AppText(
                    title: "...",
                    color: AppColor.textColor,
                    size: size.height * 0.024,
                  ),
                  SizedBox(
                    height: size.height * 0.015,
                  ),
                  AppText(
                    title:
                        "...",
                    textAlign: TextAlign.center,
                    color: AppColor.textColor,
                    size: size.height * 0.018,
                  ),
                  SizedBox(
                    height: size.height * 0.05,
                  ),
                  AppButton(
                    buttonName: "Register",
                    buttonColor: AppColor.buttonColor,
                    textColor: AppColor.buttonTextColor,
                    onTap: () {
                      Get.to(const SignUp());
                    },
                    buttonRadius: BorderRadius.circular(15),
                    buttonWidth: size.width,
                    fontWeight: FontWeight.w500,
                    buttonHeight: size.height * 0.065,
                  ),
                  SizedBox(
                    height: size.height * 0.02,
                  ),
                  AppButton(
                    buttonName: "Login",
                    buttonColor: AppColor.buttonColor,
                    textColor: AppColor.buttonTextColor,
                    onTap: () {
                      Get.to(const LoginScreen());
                    },
                    buttonRadius: BorderRadius.circular(15),
                    buttonWidth: size.width,
                    fontWeight: FontWeight.w500,
                    buttonHeight: size.height * 0.065,
                  ),
                  SizedBox(
                    height: size.height * 0.02,
                  ),
                  InkWell(
                    onTap: () {
                      Get.to(const Guest());
                    },
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        AppText(
                          title: "Continue as a Guest (...)",
                          color: AppColor.primaryColor,
                          size: size.height * 0.02,
                        ),
                        SizedBox(
                          height: size.height * 0.014,
                        ),
                      ],
                    ),
                  ),
                  SizedBox(
                    height: size.height * 0.05,
                  ),
                ],
              ),
            ),
          ],
        ));
  }
}

我希望有人能帮我解决那个问题。非常感谢。

Answer 1

您是否尝试在展开的小部件中包装您的列或容器?