Question

我有一个简单的对话框，其中CircularProgressIndicator为子级。
对话框不考虑任何孩子的宽度。

一周前一切正常，我没有更改此代码，只是升级了flutter版本，然后发生了这种情况。我什至尝试降级我的flutter版本，但都不能解决此问题。
这是我的代码：

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: DialogApp()));

class DialogApp extends StatefulWidget {
  @override
  _DialogAppState createState() => _DialogAppState();
}
class _DialogAppState extends State<DialogApp> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: RaisedButton(
          child: Text("Test"),
          onPressed: () {
            _showDialog();
          },
        ),
      ),
    );
  }
  Future<Null> _showDialog() async {
    await showDialog(
        context: context,
        builder: (BuildContext context) {
          return DialogWidget();
        });
  }
}
class DialogWidget extends StatefulWidget {
  @override
  _DialogWidgetState createState() => _DialogWidgetState();
}
class _DialogWidgetState extends State<DialogWidget> {
  @override
  Widget build(BuildContext context) {
    return Dialog(
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12.0)),
      child: AnimatedContainer(
        height: 60.0,
        width: 60.0,
        duration: Duration(milliseconds: 100),
        curve: Curves.ease,
        padding: EdgeInsets.all(10.0),
        child: CircularProgressIndicator(
            backgroundColor: Colors.transparent,
            valueColor: AlwaysStoppedAnimation<Color>(Colors.black)),
      ),
    );
  }
}

Answer 1

这是解决方案，只需包装<table> <thead> <tr> <th>Head 1</th> <th>Head 2</th> <th>Head 3</th> </tr> </thead> <tbody> <tr> <td>Content 1</td> <td>Content 2</td> <td>Content 3</td> </tr> <tr class="bg-normal"> <td>Content 1</td> <td>Content 2</td> <td>Content 3</td> </tr> <tr class="bg-text"> <td>Content 1</td> <td>Content 2</td> <td>Content 3</td> </tr> </tbody> </table>，以便使用宽度和高度包装的内容。

CircularProgressIndicator

Answer 2

选项1 您只想将circulerProgressIndicator包装到“中心”小部件中

Center(
   child: CircularProgressIndicator(
                backgroundColor: Colors.transparent,
                valueColor: AlwaysStoppedAnimation<Color>(Colors.black)),
   ),
),

选项2 如果要显示透明的processDialog，则可以添加此方法并在需要时调用它

void showLoadingDialog(BuildContext _context) async {
await showDialog(
    context: _context,
    barrierDismissible: false,
    builder: (BuildContext context) {
      return SimpleDialog(
        elevation: 0.0,
        backgroundColor: Colors.transparent,
        children: <Widget>[
          Center(
            child: CircularProgressIndicator(
              valueColor:
                  AlwaysStoppedAnimation<Color>(ColorUtils.primaryColor),
            ),
          )
        ],
      );
    });
}

Flutter Dialog不尊重其子宽度

2 个答案: