Отображение прокручиваемого списка в диалоге Flutter Show

Question

У меня есть динамический c список названий стран. Я хочу показать этот список в диалоговом окне (скажем, когда пользователь нажимает кнопку).

Вот моя реализация диалогового окна:

 List<String> countries = [
    'India','Japan','China','USA','France','Egypt','Norway','Nigeria','Colombia','Australia','South Korea','Bangladesh','Mozambique','Canada','Germany','Belgium','Vietnam','Bhutan','Israel','Brazil'
  ];


  @override
  Widget build(BuildContext context) {
    return Dialog(
        child: Container(
      width: 400,
      height: 400,
      child: SingleChildScrollView(
        child: ListView.builder(
            shrinkWrap: true,
            itemCount: countries.length,
            itemBuilder: (context, index) {
              return Padding(
                padding: const EdgeInsets.all(20.0),
                child: Text('${countries[index]}'),
              );
            }),
      ),
    ));
  }
}

Вывод Я получение выглядит следующим образом:

Очевидно, что видны только 7 стран.

Я пробовал несколько других вариантов:

1. Создание высоты Контейнера как double.maxFinite.
2. Размещение другого столбца внутри SingleChildScrollView.
3. Все возможные перестановки Column, Container, SingleChildScrollView

Однако ни один из вышеперечисленных методов, похоже, не работает (ошибка переполнения, ограниченное количество отображаемых элементов и т. Д. c).

На самом деле я хочу, чтобы была возможность отображать список с использованием метода ListView.builder внутри ShowDialog.

Answer 1

Решено так:

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  List<String> _countries = [
    'India',
    'Japan',
    'China',
    'USA',
    'France',
    'Egypt',
    'Norway',
    'Nigeria',
    'Colombia',
    'Australia',
    'South Korea',
    'Bangladesh',
    'Mozambique',
    'Canada',
    'Germany',
    'Belgium',
    'Vietnam',
    'Bhutan',
    'Israel',
    'Brazil'
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Push for open list dialog',
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _showDialogOnButtonPressing,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }

  _showDialogOnButtonPressing() => showDialog(
        context: context,
        child: Container(
          width: MediaQuery.of(context).size.width - 40,
          height: MediaQuery.of(context).size.height - 60,
          child: Dialog(
            child: ListView.builder(
              itemCount: _countries.length,
              itemBuilder: (context, index) => ListTile(
                title: Text('${index + 1}. ${_countries[index]}'),
              ),
            ),
          ),
        ),
      );
}

Результат на изображении, и вы можете без проблем прокручивать вверх и вниз: