Flutter ListView 不滚动（我觉得我已经尝试了互联网上的所有解决方案）

Posted 2023-02-23

【中文标题】Flutter ListView 不滚动（我觉得我已经尝试了互联网上的所有解决方案）

【英文标题】：Flutter ListView not scrolling (I feel like I've tried every solution on the internet)

【发布时间】：2021-04-23 06:57:23

【问题描述】：

如果我向下拖动手指，我可以看到一些位于屏幕截断下方的项目，但只要我松开手指，它就会弹回顶部。我尝试使用 SingleChildScrollView 位置，尝试设置 primary = true，以及其他一些没有帮助的东西。我对扑腾还很陌生，所以任何帮助都将不胜感激！如果需要更多信息，请告诉我。

这是我的代码：

import 'package:flutter/material.dart';
import 'package:drink_specials/models/restaurant.dart';
import 'package:drink_specials/screens/home/restaurant_list.dart';

class RestaurantNameTextStyle 
  static TextStyle display5(BuildContext context) 
    return Theme.of(context).textTheme.headline2.copyWith(color: Colors.white);
  


class RestaurantTypeTextStyle 
  static TextStyle display5(BuildContext context) 
    return Theme.of(context).textTheme.headline6.copyWith(color: Colors.white);
  



class RestaurantDetail extends StatelessWidget 

  final Restaurant restaurant;
  RestaurantDetail(Key key, @required this.restaurant) : super(key: key);

  @override
  Widget build(BuildContext context) 

    final topContentText = Column(
      crossAxisAlignment: CrossAxisAlignment.center,
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        SizedBox(height: 100.0),
        Text(
          restaurant.name,
          style: RestaurantNameTextStyle.display5(context),
        ),
        SizedBox(height: 10.0),
        Expanded(
            flex: 6,
            child: Padding(
                padding: EdgeInsets.only(left: 10.0),
                child: Text(
                  restaurant.restaurant_type,
                  style: RestaurantTypeTextStyle.display5(context),
                ))),
      ],
    );

    final topContent = Stack(
      children: <Widget>[
        Container(
            padding: EdgeInsets.only(left: 10.0),
            height: MediaQuery.of(context).size.height * 0.5,
            decoration: new BoxDecoration(
              image: new DecorationImage(
                image: NetworkImage(restaurant.photo),
                fit: BoxFit.cover,
              ),
            )),
        Container(
          height: MediaQuery.of(context).size.height * 0.5,
          padding: EdgeInsets.all(40.0),
          width: MediaQuery.of(context).size.width,
          decoration: BoxDecoration(color: Color.fromRGBO(58, 66, 86, .9)),
          child: Center(
            child: topContentText,
          ),
        ),
        Positioned(
          left: 8.0,
          top: 60.0,
          child: InkWell(
            onTap: () 
              Navigator.pop(context);
            ,
            child: Icon(Icons.arrow_back, color: Colors.white),
          ),
        )
      ],
    );


    final bottomContent = Container(
      width: MediaQuery.of(context).size.width,
      padding: EdgeInsets.all(8.0),
      child: Center(
        child: ListView.builder(
          scrollDirection: Axis.vertical,
          physics: const BouncingScrollPhysics(parent: AlwaysScrollableScrollPhysics()),
          itemCount: restaurant.specials.length,
          itemBuilder: (context, index) 
            final item = restaurant.specials[index];
            return Card(
              elevation: 8.0,
              margin: new EdgeInsets.symmetric(horizontal: 10.0, vertical: 6.0),
              child: Container(
                decoration: BoxDecoration(color: Color.fromRGBO(58, 66, 86, 1.0)),
                child: ListTile(
                  contentPadding: EdgeInsets.symmetric(horizontal:20, vertical:10),
                  title: Text(item, style: TextStyle(color: Colors.white)),
            )
                ),
            );
          
        ),
      ),
    );

    return Scaffold(
      body: Column(
        children: <Widget>[
          topContent,
          Expanded(
            child: bottomContent,
          ),
        ],
      ),
    );
  

【问题讨论】：

我已将代码块更新为功能代码

【参考方案1】：

SingleChildScrollView 中有一个ListView，它们都是可滚动的。应该禁用滚动其中之一。

【讨论】：

我认为 ListView 上的 primary=false 会禁用滚动...我发现现在情况并非如此。谢谢你的帮助，我觉得自己很笨:)

【参考方案2】：

正如他们已经解释的那样。如果您有 ListView.builder，则不需要 SingleChildScrollView。 尝试删除 SingleChildScrollView。代码应如下所示：

Scaffold(
  body: Column(
      children: <Widget>[
        topContent,
        Expanded(
            child: bottomContent,
        ),
      ],
  ),
);

【参考方案3】：

ListView 已经有滚动行为，所以你不需要一些 SingleChildScrollView