带有 ListView 构建器的未来构建器不滚动?

Future builder with ListView builder is not scrolling?

未来构建器中的列表视图构建器不可滚动。

order_screen.dart

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import '../../models_providers/order.dart';
import '../../services/global_methods.dart';
import 'empty_order.dart';
import 'full_order.dart';

class OrderScreen extends StatefulWidget {
  static const routeName = '/Order-screen';

  const OrderScreen({Key? key}) : super(key: key);

  @override
  State<OrderScreen> createState() => _OrderScreenState();
}

class _OrderScreenState extends State<OrderScreen> {
  @override
  void initState() {
    super.initState();
  }

  GlobalMethods globalMethods = GlobalMethods();

  @override
  Widget build(BuildContext context) {
    final orderProvider = Provider.of<OrderProvider>(context);
    return FutureBuilder(
        future: orderProvider.fetchOrders(),
        builder: (context, snapshot) {
          if (orderProvider.getOrders.isEmpty) {
            return const Scaffold(
                  body: EmptyOrder(),
                );
          } else {
            return Scaffold(
                  appBar: AppBar(
                    title: Text('Order (${orderProvider.getOrders.length})'),
                  ),
                  body: SingleChildScrollView(
                    child: Column(
                     children: [
                       ListView.builder(
                         shrinkWrap: true,
                         scrollDirection: Axis.vertical,
                         physics: const AlwaysScrollableScrollPhysics(),
                         itemCount: orderProvider.getOrders.length,
                         itemBuilder: (ctx, i) {
                           return ChangeNotifierProvider.value(
                             value: orderProvider.getOrders[i],
                             child: const FullOrder(),
                           );
                         },
                       ),
                     ],
                    ),
                  ),
                );
          }
        });
  }
}

full_order.dart

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';

class FullOrder extends StatelessWidget {
  const FullOrder({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final FirebaseAuth _auth = FirebaseAuth.instance;
    User? user = _auth.currentUser;
    var _uid = user!.uid;
    // it enable scrolling on small device
    return FutureBuilder(
        future: FirebaseFirestore.instance.collection('orders')
            .where('userId', isEqualTo: _uid)
            .get(),
        builder: (context, snapshot) {

          if (snapshot.connectionState == ConnectionState.done ||
              snapshot.hasData) {

            List<QueryDocumentSnapshot> docs = (snapshot.data! as QuerySnapshot).docs;
            return ListView.builder(
                shrinkWrap: true,
                itemCount: docs.length,
                itemBuilder: (context, index) {

                  var data = docs[index];
                  var dataOrders = data['orders'] as List<dynamic>;
                  var mappedDataOrders = dataOrders.map((o) => (o as Map<String, dynamic>)).toList();

                  return Card(
                      child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Row(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: [
                                Text('Order Id: ${data['orderId']}'),
                              ],
                            ),
                            Padding(
                              padding: const EdgeInsets.all(8.0),
                              child: Row(
                                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                                children: [
                                Text('Order Date: ${DateFormat('dd/MM/yyyy').format(data['createdAt'].toDate())}'),
                                Text('Order Time: ${DateFormat('hh:mm a').format(data['createdAt'].toDate())}'),
                              ],),
                            ),
                            Padding(
                              padding: const EdgeInsets.all(4.0),
                              child: Row(
                                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                children: [
                                  Text('Name: ${data['name']}', style: const TextStyle(fontWeight: FontWeight.bold),),
                                  Text('Contact: ${data['phoneNumber'].toString()}', style: const TextStyle(fontWeight: FontWeight.bold),),
                                ],
                              ),
                            ),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Column(
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  children: [
                                    const Text('Delivery Slot', style: TextStyle(fontWeight: FontWeight.bold),),
                                    Text('${data['deliverySlot']}'),
                                  ],
                                ),
                                Column(
                                  children: [
                                    Text('Address: ${data['addressType']}', style: const TextStyle(fontWeight: FontWeight.bold),),
                                    Text('${data['address']}'),
                                    Text('${data['area']}'),
                                    Text('${data['city']}')
                                  ],
                                )
                              ],
                            ),
                            ...List.generate(
                                mappedDataOrders.length,
                                    (index) {
                                  var order = mappedDataOrders[index];

                                  return Column(
                                    children: [
                                      Row(
                                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                        children: [
                                          Text(order['title']),
                                          Text(order['unit'].toString()),
                                          Text(order['quantity'].toString()),
                                          Text(order['price'].toString()),
                                        ],
                                      ),
                                    ],
                                  );
                                }
                            )
                          ]
                      )
                  );
                }
            );
          }

          return const Center(

              child: SizedBox(
                  width: 100,
                  height: 100,
                  child: CircularProgressIndicator(
                      valueColor: AlwaysStoppedAnimation<Color>(Colors.black),
                      strokeWidth: 5
                  )
              )

          );
        }
    );
  }
}

SingleChildScrollViewColumn 是不需要的,ListView 本身是可滚动的。

我能够重新创建正在发生的错误,您只需删除 ColumnSingleChildScrollView 然后您可以从 ListView

另一种解决方案是禁用 ListView 的滚动并使用 SingleChildScrollView 滚动,您可以通过添加以下内容来禁用 ListView 的滚动:

physics: NeverScrollableScrollPhysics()