how can I extend a progress bar in a AlertDialog(fluent UI)?

Issue

I would like to implement an AlertDialog using Flutter and fluent_ui for Windows. This is a progressive progress bar, so the percentage will change when some of my other code executes. My problem is that the Progress Bar does not extend until the end of the AlertDialog. Currently, the progress bar looks like below, set at progress of 50.

Progress bar inside AlertDialog

Edit: Below is the code I have tried

showDialog(
      context: context,
      builder: (context) {
        return ContentDialog(
          title: Text(title),
          content: const Expanded(
            child: ProgressBar(value: 50, strokeWidth: 10),
          ),
          actions: [
            const SizedBox(),
            Button(
                style: MyButtonStyles.dialogYes(),
                child: const Text('OK', style: TextStyle(fontSize: 16.0)),
                onPressed: () {
                  Navigator.pop(context);
                }),
          ],
        );
      },
    );

Solution

You can replace Expanded with SizedBox by providing infinity/ specific width.
Also, can be use SizedBox.fromSize.

ContentDialog(
  title: Text("title"),
  content: SizedBox(
    width: double.infinity,
    child: ProgressBar(value: 50, strokeWidth: 10),
  ),

enter image description here

Answered By – Yeasin Sheikh

Answer Checked By – Gilberto Lyons (FlutterFixes Admin)

Leave a Reply

Your email address will not be published.