首页 > 解决方案 > 如何在 Flutter 中的 App Bar 上方或内部放置进度条?

问题描述

有谁知道我是否可以在应用栏中包含进度条?请参阅我正在尝试实现的屏幕截图。我正在尝试重用代码,如果我可以创建一个带有进度指示器的应用栏,那么没有。这将使用户能够在注册时完成此屏幕,然后在他们拥有帐户后在没有进度条的情况下编辑此屏幕。这甚至可能吗?

进度应用栏

标签: flutterprogress-barappbar

解决方案


我通过将进度条放在正文中解决了这个问题,将正文延伸到应用栏后面,然后使应用栏透明。

class SignUpForm extends StatelessWidget {
  double progress = 0.22;

  @override
  Widget build(BuildContext context) => Scaffold(
    backgroundColor: Colors.white,
    extendBodyBehindAppBar: true,

    appBar: BasicFormAppBar(),

    body: Column(
      children: [
        SizedBox(height: 45),
        Container(
          child: LinearProgressIndicator(
            value: progress,
            valueColor: AlwaysStoppedAnimation(Colors.Blue),
            backgroundColor: Colors.Grey,
          ),
        ), //column & scaffold are not closed in this snippet

推荐阅读