Question

我想实现一个屏幕，其中的元素可以垂直滚动。因此，我将其放置在listview.builder上。问题是，其中一个元素是另一个水平滚动的listview.builder。当我实现它时，horizontal.builder中的元素不会显示。这是我到目前为止的内容：

  @override
  Widget build(BuildContext context) {
    return ListView.builder(
      itemCount: 3,
      itemBuilder: (context, position) {
        if (position == 0) {
          return Card(
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(15.0),
            ),
            elevation: 1.5,
            margin: EdgeInsets.fromLTRB(12.0, 12.0, 12.0, 0.0),
            child: Padding(
              padding: EdgeInsets.fromLTRB(16.0, 8.0, 16.0, 0.0),
              child: Column(
                children: <Widget>[
                  //PICTURE
                  Padding(
                    padding: const EdgeInsets.only(bottom: 8.0),
                    child: Center(
                      child: Image.asset(
                        "assets/snek.gif",
                        fit: BoxFit.scaleDown,
                      ),
                    ),
                  ),

                  Padding(
                    padding: const EdgeInsets.only(bottom: 16.0),
                    child: Text(
                      HOME_GIF_TEXT_STR,
                      textAlign: TextAlign.center,
                      style: TextStyle(fontSize: 18.0),
                    ),
                  ),
                ],
              ),
            ),
          );
        } 
        else if (position == 1) //Videos Title
        {
          return Padding(
            padding: EdgeInsets.all(16.0),
            child: Text(
              "Videos",
              style: TextStyle(
                  fontSize: 36.0,
                  fontWeight: FontWeight.bold,
                  color: Colors.black),
            ),
          );
        }
        else if (position == 2) //Videos
        {
          Container(
            height: 350.0,
            child: ListView.builder(
              physics: NeverScrollableScrollPhysics(),
              itemCount: 3,
              controller: scrollController,
              scrollDirection: Axis.horizontal,
              itemBuilder: (context, position) {
                return GestureDetector(
                    child: Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Card(
                        child: Container(
                          width: 280.0,
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.center,
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: <Widget>[
                              Column(
                                children: <Widget>[
                                  Container(
                                    height: 230.0,
                                    decoration: new BoxDecoration(
                                      image: new DecorationImage(
                                        fit: BoxFit.cover,
                                        image: new AssetImage(
                                            "${videoList[position].imgPath}"),
                                      ),
                                    ),
                                  ),
                                  Padding(
                                    padding: EdgeInsets.only(top: 8.0),
                                    child: Text(
                                      "${videoList[position].name}",
                                      style: TextStyle(fontSize: 28.0),
                                    ),
                                  ),
                                ],
                              ),
                            ],
                          ),
                        ),
                        shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(10.0)),
                      ),
                    ),
                    onHorizontalDragEnd: (details) {
                      if (details.velocity.pixelsPerSecond.dx > 0) {
                        if (cardIndex > 0) cardIndex--;
                      } else {
                        if (cardIndex < 2) cardIndex++;
                      }
                      setState(() {
                        scrollController.animateTo((cardIndex) * 256.0,
                            duration: Duration(milliseconds: 500),
                            curve: Curves.fastOutSlowIn);
                      });
                    },
                    onTap: () {
                      _launchURL("${videoList[position].url}");
                    });
              },
            ),
          );
        } 
        else if (position == 3)
        {
          return Padding(
            padding: EdgeInsets.all(16.0),
            child: Text(
              "Useful Links",
              style: TextStyle(
                  fontSize: 36.0,
                  fontWeight: FontWeight.bold,
                  color: Colors.black),
            ),
          );
        }
        else if (position == 4) //Links
        {
          //TODO PUT LINKS
        } 
      },
    );
  }
}

前两个元素正确显示。我还在其他环境中但在listview.builder之外尝试了位置== 2中的元素，并且工作正常。关于它为什么不显示的任何想法？谢谢。

Answer 1

您没有返回小部件if(position == 2)

if (position == 2) {
  //Add Return Statement HERE:
  return Container(
    height: 350.0,
    child: ListView.builder(
      physics: NeverScrollableScrollPhysics(),
      itemCount: 3,
      controller: scrollController,
      scrollDirection: Axis.horizontal,
      itemBuilder: (context, position) {
        return GestureDetector(
          // All other stuff
        );

      },
    ),
  );
 }

Flutter：ListView.builder中的ListView.builder

1 个答案: