Flutter ListView.Builder Card 小部件占据了屏幕的所有垂直空间

Question

在我的 ListView.Builder 内的代码中有一个 Card() 小部件。那张卡占用了所有空白的垂直空间，留下了一些我想摆脱的空白空间。我希望卡片在行中的最后一个元素（蓝色 RaisedButton）之后结束。 （设置硬编码的屏幕尺寸不是一种选择。）我尝试将 Row 包装在 Flexible() 中，但这并没有解决问题。

扑医生结果：

[✓] Flutter (Channel stable, v1.12.13+hotfix.7, on Mac OS X 10.15.1 19B88,
    locale en-LK)

[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)

[✓] Xcode - develop for iOS and macOS (Xcode 11.3)
[✓] Android Studio (version 3.5)
[✓] VS Code (version 1.42.1)
[✓] Connected device (1 available)

• No issues found!
proitzens-mini:~ proitzen$ flutter doctor -v
[✓] Flutter (Channel stable, v1.12.13+hotfix.7, on Mac OS X 10.15.1 19B88, locale en-LK)
    • Flutter version 1.12.13+hotfix.7 at /Users/proitzen/Developer/flutter
    • Framework revision 9f5ff2306b (4 weeks ago), 2020-01-26 22:38:26 -0800
    • Engine revision a67792536c
    • Dart version 2.7.0


[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
    • Android SDK at /Users/proitzen/Library/Android/sdk
    • Android NDK location not configured (optional; useful for native profiling support)
    • Platform android-29, build-tools 29.0.2
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 11.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.3, Build version 11C29
    • CocoaPods version 1.8.4

[✓] Android Studio (version 3.5)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin version 41.0.2
    • Dart plugin version 191.8593
    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)

[✓] VS Code (version 1.42.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.8.1

[✓] Connected device (1 available)
    • P10 • C8W7KTMJWP • android-arm64 • Android 7.1.2 (API 25)

• No issues found!

这里是Listview.builder() 方法

return ListView.builder(
  itemBuilder: (BuildContext context, int index) {
    if (noData) {
      return _noBookingsForDay();
    } else {
      if (data[date] != null &&
          data[date].length > 0 &&
          data[date][index] != null) {
        final bookingData = Booking.fromJson(data[date][index]);
        return Container(
          margin: EdgeInsets.only(left: 35.0,top: 5.0,bottom: 5.0),
          child: Card(
              shape: RoundedRectangleBorder(
                borderRadius:
                    BorderRadius.all(Radius.circular(15.0)),
              ),
              elevation: 15.0,
              child: Row(
                mainAxisSize: MainAxisSize.min,
                children: <Widget>[
                  FractionalTranslation(
                    translation: Offset(-0.4, 0.0),
                    child: Align(
                      child: CircleAvatar(
                        backgroundImage: NetworkImage(
                            bookingData.childPicUrl),
                        radius: 40.0,
                      ),
                      alignment:
                          FractionalOffset(0.5, 0.0),
                    ),
                  ),
                  SizedBox(width: 5.0),
                  Text(bookingData.room,
                      style: TextStyle(
                        fontSize: 16.0,
                          fontWeight: FontWeight.bold)),
                  SizedBox(width: 30.0),
                  GestureDetector(
                    child: RaisedButton(
                        color: Colors.blue,
                        onPressed: _showChangeSchdl,
                        child: Text(
                            "09:00 a.m - 18:00 p.m",
                            style: TextStyle(
                              fontSize: 16.0,
                                color: Colors.white,))),
                  ),
                  SizedBox(width: 10.0),
                ],
              )),
        );
      } else {
        return Center(child: Text("No data found!"));
      }
    }
  },
  itemCount: (noData == false && data[date] != null)
      ? data[date].length
      : 0,
);

Answer 1

只需将您的Container 包裹在Align() 中

return Align(
    alignment: Alignment.centerLeft,
    child: Container() // your container with the Card
);