Question

我想知道是否可以更改线性和圆形进度条的宽度/长度/高度。我正在尝试使用它制作XP栏，但不确定是否可行。另外，我知道这些值只能通过0.0和1.0来表示，但我也认为有可能（不确定）我可以制定一个仍然可以使用的公式。

Answer 1

进度指示器将填充其父布局小部件，例如

SizedBox(
    child: 
        new CircularProgressIndicator(
        valueColor: new AlwaysStoppedAnimation(Colors.blue),
        strokeWidth: 5.0),
    height: 300.0,
    width: 300.0,)

Answer 2

使用此代码，您可以确定它是Widget的数组，如果你把那是一个数组，因为您可以给予回应，您可以添加更多小部件，
那是居中的
什么是CircularProgressIndicator。

通过这种方式，循环进度指示器不会占用包含它的父亲的宽度和高度

致谢

<Widget>[Center(child: CircularProgressIndicator())]

Answer 3

如何将创建加载指标的类与我的按钮，以便当我按下它时，指示灯会打开并翻转到下一页？

代码在这里：

class Loader extends StatefulWidget {
      @override
      State createState() => LoaderState();
    }

    class LoaderState extends State<Loader> with SingleTickerProviderStateMixin {
      AnimationController controller;
      Animation<double> animation;

      @override
      void initState() {
        super.initState();
        controller = AnimationController(
            duration: Duration(milliseconds: 1200), vsync: this);
        animation = CurvedAnimation(parent: controller, curve: Curves.elasticOut);
        animation.addListener(() {
          this.setState(() {});
        });
        animation.addStatusListener((AnimationStatus status) {});
        controller.repeat();
      }

      @override
      void dispose() {
        controller.dispose();
        super.dispose();
      }

      @override
      Widget build(BuildContext context) {
        return Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Container(
              color: Colors.blue,
              height: 3.0,
              width: animation.value * 100.0,
            ),
            Padding(
              padding: EdgeInsets.only(bottom: 5.0),
            ),
            Container(
              color: Colors.blue[300],
              height: 3.0,
              width: animation.value * 75.0,
            ),
            Padding(
              padding: EdgeInsets.only(bottom: 5.0),
            ),
            Container(
              color: Colors.blue,
              height: 3.0,
              width: animation.value * 50.0,
            )
          ],
        );
      }
    }


    Expanded(
                        child: Padding(
                          padding:
                              EdgeInsets.only(left: 20.0, right: 5.0, top:20.0),
                          child: GestureDetector(
                            onTap: () {
                              Navigator.push(
                                  context,
                                  MaterialPageRoute(
                                      builder: (context) => FirstScreen()));
                            },
                            child: Container(
                                alignment: Alignment.center,
                                height: 45.0,
                                decoration: BoxDecoration(
                                    color: Color(0xFF1976D2),
                                    borderRadius: BorderRadius.circular(9.0)),
                                child: Text('Login',
                                    style: TextStyle(
                                        fontSize: 20.0, color: Colors.white))),
                          ),
                        ),
                      ),

颤动进度指示器大小

3 个答案: