未來<widget>無法分配給列表類型“小部件”</widget>

Question

我正在制作一個對話框屏幕，其中包含一些下拉框和列表視圖，如下所示。

showDialog(
        context: context,
        builder: (BuildContext context) {
          return AlertDialog(
            content: StatefulBuilder(
              builder: (BuildContext DialogContext, StateSetter setState) {
                return Column(
                  children: [
                    Dropdown(DialogContext, setState, 0, ReceiveArgs, _lListOfDepthList), 
                    Dropdown(DialogContext, setState, 1, ReceiveArgs, _lListOfDepthList),                        
                    FutureListView(ReceiveArgs),                                            
                  ],
                );
              },
            ),
          );
        });

由於我調用了未來 function、SetName，因此我也將“FutureListView”更改為 Future function。 FutureListView 代碼如下。

       
  Future<Widget> FutureListView(ArgumentClass ReceiveArgs) async{
    String SelectedFullAddress = GetSelectedAddress(5, "");

    _Name = await SetName(ReceiveArgs.lFullList, SelectedFullAddress);

    if (_Name.isNotEmpty) {
      print("ListView!");
      return ListView.builder(
        itemCount: _Name.length,
        itemBuilder: (context, index) {
          return CheckboxListTile(
            title: Text(_Name[index]),
            value: null,
            onChanged: null,
          );
        },
      );
    } else {
      print("List Null");
      return Text("");
    }
  }

但是，更改后，我在下面收到了編譯錯誤。

錯誤：元素類型“未來”不能分配給列表類型“小部件”。 （list_element_type_not_assignable 在 [checker_v2]）

你能幫我解決這個問題嗎？

同時我使用 StatefulBuilder 因為其他 Dropdownbutton 小部件相互交互。

謝謝！

Answer 1

您需要將帶有Future的小部件包裝到FutureBuilder ：

FutureBuilder<TypeOfName>(
  future: getName(),
  builder (context, snapshot) {
    // Data is not loading, you should show progress indicator to user
    if (!snapshot.hasData) {
      return CircularProgressIndicator();
    }
    // Data from Future is loaded
    final name = snapshot.data;
    if (name.isEmpty) {
      return Text('');
    } else {
      return ListView.builder(
        itemCount: name.length,
        itemBuilder: (context, index) {
          return CheckboxListTile(
            title: Text(name[index]),
            value: null,
            onChanged: null,
          );
        },
      );
    }
  }
);

和getName()方法：

Future<TypeOfName> getName() {
  String SelectedFullAddress = GetSelectedAddress(5, "");
  return SetName(ReceiveArgs.lFullList, SelectedFullAddress);
}

並將_Name替換為TypeOfName變量的類型（您不能聲明它）。

Answer 2

使用FutureBuilder 。

這是您的FutureListView的外觀（您現在可以更改方法的名稱）

 Future<String> FutureListView(ArgumentClass ReceiveArgs) async{
        String SelectedFullAddress = GetSelectedAddress(5, "");
  
        return await SetName(ReceiveArgs.lFullList, SelectedFullAddress);
      }

而且，這應該是你的 showDialog

showDialog(
        context: context,
        builder: (BuildContext context) {
          return AlertDialog(
            content: StatefulBuilder(
              builder: (BuildContext DialogContext, StateSetter setState) {
                return Column(
                  children: [
                    Dropdown(DialogContext, setState, 0, ReceiveArgs, _lListOfDepthList),
                    Dropdown(DialogContext, setState, 1, ReceiveArgs, _lListOfDepthList),
                    FutureBuilder<String>(
                    future: FutureListView(ReceiveArgs),
                    builder: (context, snapshot) => {
                      if(!snapshot.hasData) return Container(); // This container can be a loading screen, since its waiting for data.

                      if(snapshot.data.isNotEmpty){
                        print("ListView!");
                        return ListView.builder(
                          itemCount: _Name.length,
                          itemBuilder: (context, index) {
                            return CheckboxListTile(
                              title: Text(_Name[index]),
                              value: null,
                              onChanged: null,
                              );
                            },
                          );,
                        } else {
                          print("List Null");
                          return Text("");
                      },
                    )
                  ],
                );
              },
            ),
          );
        });

FutureBuilder 的 future不會等到 async 方法完成，而是嘗試構建 builder 方法直到它完成。 您可以使用snapshot.hasData檢查異步方法是否已經返回了某些內容，如果沒有，您可以根據需要顯示加載屏幕。 然后，使用snapshot.data訪問您未來的結果。

Answer 3

使用類型 Widget 而不是 Future，因為您不能直接在小部件設計中調用 future。

您可以像這樣簡單地修改您的代碼。

  Widget FutureListView(ArgumentClass receiveArgs) {
    String SelectedFullAddress = GetSelectedAddress(5, "");
    _Name = await SetName(receiveArgs.lFullList, SelectedFullAddress);
    if (_Name.isNotEmpty) {
    bool _isChecked = false;

    print("ListView!");
      return ListView.builder(
        itemCount: 3,
        shrinkWrap: true,
        itemBuilder: (context, index) {
          return  CheckboxListTile(
            value: _isChecked,
            title: Text(_Name[index]),
            onChanged: (bool value) {
              setState(() {
                _isChecked = value;
              });
            },
          );
        },
      );
    } else {
      print("List Null");
      return Text("");
    }
  }