Flutter：错误元素 'List<Column>' 无法分配给列表类型 '<Widget>'

Question

我的代码在 Column 中包含固定小部件 //1 和 //4，我想在它们之间生成小部件列表。最初，我手动编写小部件（参考 //2）。但是，由于我将有一个要生成的 BulletList 和 SurahCard 小部件的列表，因此我想使用 for 循环或 List.generate（参考 //3).

但是，我遇到了这个错误：

Element 'List<Column>' can't be assigned to the list type '<Widget>'

感谢是否有人可以阐明如何解决此问题？

import ...

class ReciteSurah extends StatelessWidget {

  static const String id = 'recite_surah_screen';

  int pageNumber;
  int surahNumber;
  late Surah surah;
  late String surahName;
  List<int> surahNumberList;

  ReciteSurah({required this.surahNumberList, required this.surahNumber, required this.pageNumber}){
    surah = SurahHelper().getSurah(surahNumber: surahNumber);
    surahName = surah.nameMS;
  }
  


  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Container(
        padding: const EdgeInsets.fromLTRB(16.0, 16.0, 16.0, 96.0),

        child: Column(
          children: [

            //1 - This widget is fixed
        H2(text: '$pageNumber. BACA SURAH AL-FATIHAH & SURAH LAIN ATAU BEBERAPA AYAT LAIN'),

            //2 - Manually calling the BulletList & SurahCard Widget
            BulletList(lines:const [
              'Baca surah al-Fatihah:',
            ] ),
            SurahCard(surahNumber: 1),
            BulletList(lines: [
              'Baca surah $surahName:',
            ] ),
            SurahCard(surahNumber: surahNumber),

            //3 - Programatically generate List of BulletList & SurahCard Widget
          List.generate(surahList.length, (index){
            int curSurahNumber = surahNumberList[index];
            Surah curSurah = SurahHelper().getSurah(surahNumber: curSurahNumber);
            return Column(
              children: [
                BulletList(lines: [
                  'Baca surah ${curSurah.nameMS}:',
                ] ),
                SurahCard(surahNumber: curSurahNumber),
              ],
            );
          },
          ),

            //4 - This widget is fixed
            P(text: 'Anda juga boleh membaca surah pilihan sendiri.'),

          ],
        ),
      ),
    );
  }
}

这是现有代码 //1 //2 和 //4 的样子：

Answer 1

您可以使用 ... Spread Operator 将 widgets 的列表添加到您的专栏中。

...List.generate(
              surahList.length,
              (index) {
                int curSurahNumber = surahNumberList[index];
                Surah curSurah =
                    SurahHelper().getSurah(surahNumber: curSurahNumber);
                return Column(
                  children: [
                    BulletList(lines: [
                      'Baca surah ${curSurah.nameMS}:',
                    ] ),
                    SurahCard(surahNumber: ${curSurahNumber}),
                  ],
                );
              },
            ),

Spread Operator are used for inserting multiple elements in a collection, In your case, it is Column's children (which is List<Widget>) in which you want to add one more List<Widget>.

Flutter：错误元素 'List<Column>' 无法分配给列表类型 '<Widget>'

Flutter: Error Element 'List<Column>' can't be assigned to the list type '<Widget>'

android

for-loop

list

widget

flutter