如何在颤动中使我的文本与 listview.builder 一起滚动

Posted 2023-02-23

【中文标题】如何在颤动中使我的文本与 listview.builder 一起滚动

【英文标题】：How to make my text scrollable with along with listview.builder in flutter

【发布时间】：2020-09-29 22:03:11

【问题描述】：

所以，我有 2 个功能。一个是在顶部显示一些文本，另一个是 listview.builder。我的 listview.builder 是可滚动的，但我想让位于 listview.builder 上方的文本也可滚动。因为当我滚动时，我只能滚动listview.builder。所以当我滚动 listview.builder 时，我的文本也应该自动滚动

我的身体，我称之为这些功能的地方：

return Scaffold(
        appBar: header(context, apptitle: true),
        backgroundColor: Color(0xff66FF99),
        body: ListView(children: [
          displaytitle(), \\ my function1
          SizedBox(
            height: 500,
            child: showpics(), \\ my second function
          ),
        ]));

我的 displaytitle() 函数：

displaytitle() 
    return Column(children: [
      SizedBox(
        height: 30.0,
      ),
      Text(
        "General Contest",
        style: TextStyle(
          fontFamily: "Montesserat",
          fontSize: 20.0,
          fontStyle: FontStyle.italic,
          fontWeight: FontWeight.w700,
        ),
      ),
      SizedBox(height: 30.0),
      Container(
        width: MediaQuery.of(context).size.width / 2,
        height: 40.0,
        child: Material(
          borderRadius: BorderRadius.circular(100.0),
          //shadowColor: Color(0xff859DEF),
          color: Color(0xff4AA0F0),
          elevation: 10.0,

我有我的 listview.builder 的显示图片功能

return FutureBuilder(
        future: Future.wait([getposts(), getposts2()]),
        builder: (BuildContext context, AsyncSnapshot<List<dynamic>> snapshot) 
          if (!snapshot.hasData) 
            return  Text(
              "Loading...",
              )
          
          return ListView.builder(
              itemCount: snapshot.data[0].length,
              itemBuilder: (BuildContext context, int index) 
                return GestureDetector(
                  child: Card(
                    elevation: 20.0,
                    child: Column(children: [
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceAround,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: <Widget>[
                          CircleAvatar(
                            radius: 20.0,
                            backgroundImage:
                                NetworkImage(snapshot.data[0][index].picture),
                          ),

所以我的问题是我只能滚动我的 listview.builder 而不是我上面的文本。我无法将文本添加到 listview.builder，因为它会破坏我的结构。

【参考方案1】：

将 ClampingScrollPhysics() 添加到 listviewbuilder

ListView.builder(
  physics: ClampingScrollPhysics(),
  itemCount: 1,
  itemBuilder: (BuildContext context, int index) 
  return ;
 ,
),

例如

ListView(
        children: [
          Column(
            children: [
              SizedBox(
                height: 30.0,
              ),
              Text(
                "General Contest",
                style: TextStyle(
                  fontFamily: "Montesserat",
                  fontSize: 20.0,
                  fontStyle: FontStyle.italic,
                  fontWeight: FontWeight.w700,
                ),
              ),
              Container(
                width: MediaQuery.of(context).size.width / 2,
                height: 40.0,
                child: Material(
                  borderRadius: BorderRadius.circular(100.0),
                  //shadowColor: Color(0xff859DEF),
                  color: Color(0xff4AA0F0),
                  elevation: 10.0,
                ),
              ),
            ],
          ),
          ListView.builder(
            physics: ClampingScrollPhysics(),
            shrinkWrap: true,
            itemCount: 30,
            itemBuilder: (context, index) => GestureDetector(
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: Container(
                  height: 50,
                  width: double.infinity,
                  color: Colors.yellow,
                ),
              ),
            ),
          ),
        ],
      ),

【讨论】：

没有用，因为它只适用于我的 listview.builder 而不是我的 displaytitle()

如果你想滚动文本小部件以及列表视图构建器，那么上面的 sn-p 工作（测试）。