底部導航欄隱藏屏幕 - Flutter

Question

我使用https://medium.flutterdevs.com/custom-animated-bottomnavigation-bar-in-flutter-65293e231e4a中的教程在 flutter 中創建了底部導航欄

問題是底部導航隱藏了它下面的屏幕。 參考圖片： https://postimg.cc/v1q2YWn2/

代碼是

@override
  Widget build(BuildContext context) {
    return Scaffold(
        body: StreamBuilder(
            stream: _db
                .collection('orders')
                .where('driverId', isEqualTo: sp.getString('uid'))
                .where('status', whereIn: ['Accepted', 'Picked Up', 'Ready For Pickup'])
                .orderBy('timeStamp', descending: true)
                .snapshots(),
            builder: (BuildContext context,
                AsyncSnapshot<QuerySnapshot> OrdersSnapshot) {
              if (!OrdersSnapshot.hasData) return const Text('Loading...');
              return ListView.builder(
                  itemCount: OrdersSnapshot.data!.docs.length,
                  itemBuilder: (context, index) {
                    var documentSnapshot = OrdersSnapshot.data!.docs[index]
                        .data() as Map<String, dynamic>;
                    return Padding(
                      padding: EdgeInsets.symmetric(vertical: 10),
                      child: Container(
                        width: MediaQuery.of(context).size.width,
                        height: 260,
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(8),
                            border: Border.all(color: documentSnapshot['status'] == 'Accepted' ? hexStringToColor("FBAF03") : Colors.black38, width: 1)),
                        child: Column(
                          children: [
                            Row(
                              children: [
                                Padding(
                                  padding: const EdgeInsets.symmetric(
                                      vertical: 10, horizontal: 10),
                                  child: Container(
                                      height: 60,
                                      width: 60,
                                      decoration: BoxDecoration(
                                          borderRadius:
                                          BorderRadius.circular(6),
                                          border: Border.all(
                                              color: Colors.black12)),
                                      child: Image.network(
                                          'https://indiaeducationdiary.in/wp-content/uploads/2020/10/IMG-20201024-WA0014.jpg')),
                                ),
                                Container(
                                  width:
                                  MediaQuery.of(context).size.width * 0.70,
                                  child: Column(
                                    crossAxisAlignment:
                                    CrossAxisAlignment.start,
                                    children: [
                                      FutureBuilder(
                                          future: FirebaseFirestore.instance
                                              .doc(documentSnapshot['vid'].path)
                                              .get(),
                                          builder: (BuildContext context,
                                              AsyncSnapshot<DocumentSnapshot>
                                              snapshot) {
                                            if (snapshot.hasError) {
                                              return const Text(
                                                  "Something went wrong");
                                            }
                                            if (snapshot.hasData &&
                                                !snapshot.data!.exists) {
                                              return const Text(
                                                  "Document doesn't exist");
                                            } else if (snapshot
                                                .connectionState ==
                                                ConnectionState.done) {
                                              Map<String, dynamic> data =
                                              snapshot.data!.data()
                                              as Map<String, dynamic>;
                                              return Column(
                                                crossAxisAlignment:
                                                CrossAxisAlignment.start,
                                                children: [
                                                  Text(
                                                    data['name'],
                                                    style: GoogleFonts.poppins(
                                                        fontWeight:
                                                        FontWeight.bold,
                                                        fontSize: 14),
                                                    overflow:
                                                    TextOverflow.ellipsis,
                                                  ),
                                                  Text(
                                                    data['address'],
                                                    style: GoogleFonts.poppins(
                                                        fontWeight:
                                                        FontWeight.w400,
                                                        fontSize: 11,
                                                        color: hexStringToColor(
                                                            '636567')),
                                                    overflow:
                                                    TextOverflow.ellipsis,
                                                    maxLines: 1,
                                                  ),
                                                ],
                                              );
                                            }
                                            return const Text("Loading...");
                                          }),
                                    ],
                                  ),
                                ),
                              ],
                            ),
                            const DottedLine(
                              dashColor: Colors.black26,
                              dashGapLength: 10,
                            ),
                            Padding(
                              padding: EdgeInsets.all(20),
                              child: Container(
                                width: MediaQuery.of(context).size.height,
                                child: Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Row(
                                      children: [
                                        Icon(Icons.account_circle),
                                        SizedBox(
                                          width: 7,
                                        ),
                                        FutureBuilder(
                                            future: FirebaseFirestore.instance
                                                .doc(documentSnapshot['uid']
                                                .path)
                                                .get(),
                                            builder: (BuildContext context,
                                                AsyncSnapshot<DocumentSnapshot>
                                                snapshot) {
                                              if (snapshot.hasError) {
                                                return Text(
                                                    "Something went wrong");
                                              }
                                              if (snapshot.hasData &&
                                                  !snapshot.data!.exists) {
                                                return Text(
                                                    "Document doesn't exist");
                                              } else if (snapshot
                                                  .connectionState ==
                                                  ConnectionState.done) {
                                                Map<String, dynamic> data =
                                                snapshot.data!.data()
                                                as Map<String, dynamic>;
                                                return Column(
                                                  crossAxisAlignment:
                                                  CrossAxisAlignment.start,
                                                  children: [
                                                    Text(
                                                      data['fullname'] + ' | ',
                                                      style: GoogleFonts.poppins(
                                                          fontSize: 12,
                                                          fontWeight:
                                                          FontWeight.w500,
                                                          color:
                                                          hexStringToColor(
                                                              '636567')),
                                                    ),
                                                  ],
                                                );
                                              }
                                              return Text("Loading...");
                                            }),
                                        SizedBox(width: 3),
                                        Text(
                                          '#' + documentSnapshot['orderId'],
                                          style: GoogleFonts.poppins(
                                              fontSize: 12,
                                              fontWeight: FontWeight.w500,
                                              color:
                                              hexStringToColor('636567')),
                                        )
                                      ],
                                    ),
                                    Container(
                                      width: MediaQuery.of(context).size.width *
                                          0.90,
                                      child: Row(
                                        children: [
                                          Icon(Icons.location_on_rounded),
                                          SizedBox(
                                            width: 7,
                                          ),
                                          Expanded(
                                            child: Text(
                                              documentSnapshot['address']
                                              ['address'],
                                              style: GoogleFonts.poppins(
                                                  fontSize: 12,
                                                  fontWeight: FontWeight.w500,
                                                  color: hexStringToColor(
                                                      '636567')),
                                              overflow: TextOverflow.clip,
                                              maxLines: 1,
                                            ),
                                          ),
                                        ],
                                      ),
                                    ),
                                    SizedBox(
                                      height: 20,
                                    ),
                                    Row(
                                      children: [
                                        Container(
                                          decoration: BoxDecoration(
                                              color: hexStringToColor('aeaeae'),
                                              borderRadius:
                                              BorderRadius.circular(5)),
                                          width: 80,
                                          height: 20,
                                          child: Row(
                                            mainAxisAlignment:
                                            MainAxisAlignment.center,
                                            children: [
                                              Text(
                                                '3 Items',
                                                style: GoogleFonts.poppins(
                                                    fontSize: 10,
                                                    fontWeight:
                                                    FontWeight.w500),
                                              )
                                            ],
                                          ),
                                        ),
                                        SizedBox(
                                          width: 20,
                                        ),
                                        Container(
                                          decoration: BoxDecoration(
                                              color: hexStringToColor('aeaeae'),
                                              borderRadius:
                                              BorderRadius.circular(5)),
                                          width: 80,
                                          height: 20,
                                          child: Row(
                                            mainAxisAlignment:
                                            MainAxisAlignment.center,
                                            children: [
                                              Text(
                                                "₹${documentSnapshot[
                                                    'grandTotal']}",
                                                style: GoogleFonts.poppins(
                                                    fontSize: 10,
                                                    fontWeight:
                                                    FontWeight.w500),
                                              )
                                            ],
                                          ),
                                        ),
                                      ],
                                    ),
                                    Align(
                                      alignment: Alignment.centerRight,
                                      child: ElevatedButton(
                                        onPressed: () => {
                                          PreferenceUtils.setString("orderId", documentSnapshot['orderId']),
                                          Navigator.push(
                                            context,
                                            SizeTransitionDownToUp(const OrderDetails()),
                                          )
                                        },
                                        style: ElevatedButton.styleFrom(
                                            elevation: 3,
                                            shape: RoundedRectangleBorder(
                                                borderRadius:
                                                BorderRadius.circular(5)),
                                            textStyle: GoogleFonts.poppins(
                                                fontWeight: FontWeight.w400,
                                                fontSize: 14)),
                                        child: const Text('View Details'),
                                      ),
                                    )
                                  ],
                                ),
                              ),
                            )
                          ],
                        ),
                      ),
                    );
                  });
            }));
  }

我無法滾動到底部。 提出建議

Answer 1

請嘗試

      @override
      Widget build(BuildContext context) {
        return Scaffold(
            body: Padding(
              padding: const EdgeInsets.only(bottom: 100.0),
              child: StreamBuilder(
                  stream: _db
                      .collection('orders')
                      .where('driverId', isEqualTo: sp.getString('uid'))
                      .where('status', whereIn: ['Accepted', 'Picked Up', 'Ready For Pickup'])
                      .orderBy('timeStamp', descending: true)
                      .snapshots(),
                  builder: (BuildContext context,
                      AsyncSnapshot<QuerySnapshot> OrdersSnapshot) {
                    if (!OrdersSnapshot.hasData) return const Text('Loading...');
                    return ListView.builder(
                        itemCount: OrdersSnapshot.data!.docs.length,
                        itemBuilder: (context, index) {
                          var documentSnapshot = OrdersSnapshot.data!.docs[index]
                              .data() as Map<String, dynamic>;
                          return Padding(
                            padding: EdgeInsets.symmetric(vertical: 10),
                            child: Container(
                              width: MediaQuery.of(context).size.width,
                              height: 260,
                              decoration: BoxDecoration(
                                  borderRadius: BorderRadius.circular(8),
                                  border: Border.all(color: documentSnapshot['status'] == 'Accepted' ? hexStringToColor("FBAF03") : Colors.black38, width: 1)),
                              child: Column(
                                children: [
                                  Row(
                                    children: [
                                      Padding(
                                        padding: const EdgeInsets.symmetric(
                                            vertical: 10, horizontal: 10),
                                        child: Container(
                                            height: 60,
                                            width: 60,
                                            decoration: BoxDecoration(
                                                borderRadius:
                                                BorderRadius.circular(6),
                                                border: Border.all(
                                                    color: Colors.black12)),
                                            child: Image.network(
                                                'https://indiaeducationdiary.in/wp-content/uploads/2020/10/IMG-20201024-WA0014.jpg')),
                                      ),
                                      Container(
                                        width:
                                        MediaQuery.of(context).size.width * 0.70,
                                        child: Column(
                                          crossAxisAlignment:
                                          CrossAxisAlignment.start,
                                          children: [
                                            FutureBuilder(
                                                future: FirebaseFirestore.instance
                                                    .doc(documentSnapshot['vid'].path)
                                                    .get(),
                                                builder: (BuildContext context,
                                                    AsyncSnapshot<DocumentSnapshot>
                                                    snapshot) {
                                                  if (snapshot.hasError) {
                                                    return const Text(
                                                        "Something went wrong");
                                                  }
                                                  if (snapshot.hasData &&
                                                      !snapshot.data!.exists) {
                                                    return const Text(
                                                        "Document doesn't exist");
                                                  } else if (snapshot
                                                      .connectionState ==
                                                      ConnectionState.done) {
                                                    Map<String, dynamic> data =
                                                    snapshot.data!.data()
                                                    as Map<String, dynamic>;
                                                    return Column(
                                                      crossAxisAlignment:
                                                      CrossAxisAlignment.start,
                                                      children: [
                                                        Text(
                                                          data['name'],
                                                          style: GoogleFonts.poppins(
                                                              fontWeight:
                                                              FontWeight.bold,
                                                              fontSize: 14),
                                                          overflow:
                                                          TextOverflow.ellipsis,
                                                        ),
                                                        Text(
                                                          data['address'],
                                                          style: GoogleFonts.poppins(
                                                              fontWeight:
                                                              FontWeight.w400,
                                                              fontSize: 11,
                                                              color: hexStringToColor(
                                                                  '636567')),
                                                          overflow:
                                                          TextOverflow.ellipsis,
                                                          maxLines: 1,
                                                        ),
                                                      ],
                                                    );
                                                  }
                                                  return const Text("Loading...");
                                                }),
                                          ],
                                        ),
                                      ),
                                    ],
                                  ),
                                  const DottedLine(
                                    dashColor: Colors.black26,
                                    dashGapLength: 10,
                                  ),
                                  Padding(
                                    padding: EdgeInsets.all(20),
                                    child: Container(
                                      width: MediaQuery.of(context).size.height,
                                      child: Column(
                                        crossAxisAlignment: CrossAxisAlignment.start,
                                        children: [
                                          Row(
                                            children: [
                                              Icon(Icons.account_circle),
                                              SizedBox(
                                                width: 7,
                                              ),
                                              FutureBuilder(
                                                  future: FirebaseFirestore.instance
                                                      .doc(documentSnapshot['uid']
                                                      .path)
                                                      .get(),
                                                  builder: (BuildContext context,
                                                      AsyncSnapshot<DocumentSnapshot>
                                                      snapshot) {
                                                    if (snapshot.hasError) {
                                                      return Text(
                                                          "Something went wrong");
                                                    }
                                                    if (snapshot.hasData &&
                                                        !snapshot.data!.exists) {
                                                      return Text(
                                                          "Document doesn't exist");
                                                    } else if (snapshot
                                                        .connectionState ==
                                                        ConnectionState.done) {
                                                      Map<String, dynamic> data =
                                                      snapshot.data!.data()
                                                      as Map<String, dynamic>;
                                                      return Column(
                                                        crossAxisAlignment:
                                                        CrossAxisAlignment.start,
                                                        children: [
                                                          Text(
                                                            data['fullname'] + ' | ',
                                                            style: GoogleFonts.poppins(
                                                                fontSize: 12,
                                                                fontWeight:
                                                                FontWeight.w500,
                                                                color:
                                                                hexStringToColor(
                                                                    '636567')),
                                                          ),
                                                        ],
                                                      );
                                                    }
                                                    return Text("Loading...");
                                                  }),
                                              SizedBox(width: 3),
                                              Text(
                                                '#' + documentSnapshot['orderId'],
                                                style: GoogleFonts.poppins(
                                                    fontSize: 12,
                                                    fontWeight: FontWeight.w500,
                                                    color:
                                                    hexStringToColor('636567')),
                                              )
                                            ],
                                          ),
                                          Container(
                                            width: MediaQuery.of(context).size.width *
                                                0.90,
                                            child: Row(
                                              children: [
                                                Icon(Icons.location_on_rounded),
                                                SizedBox(
                                                  width: 7,
                                                ),
                                                Expanded(
                                                  child: Text(
                                                    documentSnapshot['address']
                                                    ['address'],
                                                    style: GoogleFonts.poppins(
                                                        fontSize: 12,
                                                        fontWeight: FontWeight.w500,
                                                        color: hexStringToColor(
                                                            '636567')),
                                                    overflow: TextOverflow.clip,
                                                    maxLines: 1,
                                                  ),
                                                ),
                                              ],
                                            ),
                                          ),
                                          SizedBox(
                                            height: 20,
                                          ),
                                          Row(
                                            children: [
                                              Container(
                                                decoration: BoxDecoration(
                                                    color: hexStringToColor('aeaeae'),
                                                    borderRadius:
                                                    BorderRadius.circular(5)),
                                                width: 80,
                                                height: 20,
                                                child: Row(
                                                  mainAxisAlignment:
                                                  MainAxisAlignment.center,
                                                  children: [
                                                    Text(
                                                      '3 Items',
                                                      style: GoogleFonts.poppins(
                                                          fontSize: 10,
                                                          fontWeight:
                                                          FontWeight.w500),
                                                    )
                                                  ],
                                                ),
                                              ),
                                              SizedBox(
                                                width: 20,
                                              ),
                                              Container(
                                                decoration: BoxDecoration(
                                                    color: hexStringToColor('aeaeae'),
                                                    borderRadius:
                                                    BorderRadius.circular(5)),
                                                width: 80,
                                                height: 20,
                                                child: Row(
                                                  mainAxisAlignment:
                                                  MainAxisAlignment.center,
                                                  children: [
                                                    Text(
                                                      "₹${documentSnapshot[
                                                      'grandTotal']}",
                                                      style: GoogleFonts.poppins(
                                                          fontSize: 10,
                                                          fontWeight:
                                                          FontWeight.w500),
                                                    )
                                                  ],
                                                ),
                                              ),
                                            ],
                                          ),
                                          Align(
                                            alignment: Alignment.centerRight,
                                            child: ElevatedButton(
                                              onPressed: () => {
                                                PreferenceUtils.setString("orderId", documentSnapshot['orderId']),
                                                Navigator.push(
                                                  context,
                                                  SizeTransitionDownToUp(const OrderDetails()),
                                                )
                                              },
                                              style: ElevatedButton.styleFrom(
                                                  elevation: 3,
                                                  shape: RoundedRectangleBorder(
                                                      borderRadius:
                                                      BorderRadius.circular(5)),
                                                  textStyle: GoogleFonts.poppins(
                                                      fontWeight: FontWeight.w400,
                                                      fontSize: 14)),
                                              child: const Text('View Details'),
                                            ),
                                          )
                                        ],
                                      ),
                                    ),
                                  )
                                ],
                              ),
                            ),
                          );
                        });
                  }),
            ));
      }