Question

我正在尝试构建小部件的水平滑块（ListView），并想在ListView的末尾添加一个按钮（以便可以添加另一张卡片）。到目前为止，如果我尝试通过从中拉出以生成ListView.builder的窗口小部件列表进行添加，则不允许我这样做，因为该窗口小部件与我指定的列表中的窗口小部件不同。

我不知道如何以其他方式将其添加到列表的末尾。我已经能够将其放在列表的旁边，但这会占用不应占用的屏幕空间，因为所需的效果应该是将其添加在ListView的末尾，而不是在其旁边。

代码如下：

Column(
      children: <Widget>[
        Expanded(
          flex: 20,
          child: Column(
            children: <Widget>[
              Padding(
                padding:
                    const EdgeInsets.only(left: 20, top: 10, bottom: 10),
                child: Align(
                  alignment: Alignment.topLeft,
                  child: Text(
                    'Buildings',
                    style: TextStyle(
                        color: Colors.white,
                        fontSize: 30,
                        fontFamily: 'Montserrat',
                        fontWeight: FontWeight.w300),
                  ),
                ),
              ),
              Expanded(
                child: Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 20),
                  child: SearchBar(),
                ),
              ),
            ],
          ),
        ),
        Expanded(
          flex: 30,
          child: Row(
            children: <Widget>[
              Expanded(
                child: Consumer<BuildingData>(
                  builder: (context, buildingData, child) {
                    return ListView.builder(
                      scrollDirection: Axis.horizontal,
                      itemBuilder: (context, index) {
                        final building = buildingData.buildingInputs[index];
                        return BuildingCard(
                          buildingName: building.buildingName,
                        );
                      },
                      itemCount: buildingData.buildingCount,
                    );
                  },
                ),
              ),
              AddBuildingButton(
                onPressed: () {
                  print('success');
                },
              ),
            ],
          ),
        ),
        Expanded(
          flex: 50,
          child: Container(
            padding: EdgeInsets.only(top: 30, left: 30, right: 30),
            decoration: BoxDecoration(
              color: Color(0xff2e3032),
              borderRadius: BorderRadius.only(
                topLeft: Radius.circular(50),
                topRight: Radius.circular(50),
              ),
            ),
          ),
        )
      ],
    ),

Answer 1

只需按照以下步骤更改代码，

               return ListView.builder(
                      scrollDirection: Axis.horizontal,
                      itemBuilder: (context, index) {
                        // checking if the index item is the last item of the list or not
                        if (index == buildingData.buildingCount){
                           return Your_New_Card_Widget;
                        }

                        final building = buildingData.buildingInputs[index];

                        return BuildingCard(
                        buildingName: building.buildingName,
                        );
                      },
                      itemCount: buildingData.buildingCount+1,
                    );

“ Your_New_Card_Widget”是您想要在列表中添加新产品的小部件。

Flutter：如何在包含其他类型窗口小部件的ListView.builder的末尾添加按钮窗口小部件？

1 个答案: