The list rendering issue according Page height.

[MuhamadHaydar]

Describe the bug

The issue happens when the pdf renders the listview whose height does not fit the current page height.

When it renders the list of experiences in my application, if the height size (depending on the number of experiences) is higher than the full page size, the issue happens.

Here if I add one more Experience, it renders in the following way:

IF I add another experience, the issue happens, my resume won't be generated.

To Reproduce Code snippet to reproduce the behavior:

// your code
 pdf.ListView(
                      children: userProfile.cv!.experiences
                          .map(
                            (experience) => _Block(
                                title: experience.jobTitle,
                                fromDate: TimeUtils.formatDateToYearMonthForm(
                                    experience.startDate),
                                endDate: TimeUtils.formatDateToYearMonthForm(
                                    experience.endDate ?? DateTime.now()),
                                jobCompany: experience.companyName,
                                description: experience.desc,
                                isRTL: false),
                          )
                          .toList(),
                    ),

_block widget:

// your code
class _Block extends pdf.StatelessWidget {
  _Block({
    this.title,
    this.jobCompany,
    this.fromDate,
    this.endDate,
    this.description,
    required this.isRTL,
  });

  final String? title;
  final String? jobCompany;
  final String? fromDate;
  final String? endDate;
  final String? description;
  final bool isRTL;

  PdfColor green = PdfColor.fromInt(0xff9ce5d0);
  PdfColor lightGreen = PdfColor.fromInt(0xffcdf1e7);

  @override
  pdf.Widget build(pdf.Context context) {
    return pdf.Column(
        crossAxisAlignment: pdf.CrossAxisAlignment.stretch,
        children: <pdf.Widget>[
          title != null
              ? isRTL
                  ? pdf.Row(
                      mainAxisAlignment: pdf.MainAxisAlignment.end,
                      children: <pdf.Widget>[
                          pdf.Flexible(
                            flex: 7,
                            child: pdf.Text(
                              title!,
                              style: pdf.Theme.of(context)
                                  .defaultTextStyle
                                  .copyWith(
                                    fontWeight: pdf.FontWeight.normal,
                                    fontSize: PDFService.singleJobTitleSize,
                                    color: PDFService.blueBoldColor,
                                  ),
                            ),
                          ),
                          pdf.Flexible(
                            flex: 1,
                            child: pdf.Container(
                              width: 6,
                              height: 6,
                              margin: const pdf.EdgeInsets.only(
                                  top: 5.5, left: 5, right: 5),
                              decoration: pdf.BoxDecoration(
                                color: green,
                                shape: pdf.BoxShape.circle,
                              ),
                            ),
                          ),
                        ])
                  : pdf.Row(
                      crossAxisAlignment: pdf.CrossAxisAlignment.start,
                      children: <pdf.Widget>[
                          pdf.Flexible(
                            flex: 1,
                            child: pdf.Container(
                              width: 6,
                              height: 6,
                              margin: const pdf.EdgeInsets.only(
                                  top: 5.5, left: 5, right: 5),
                              decoration: pdf.BoxDecoration(
                                color: green,
                                shape: pdf.BoxShape.circle,
                              ),
                            ),
                          ),
                          pdf.Flexible(
                            flex: 7,
                            child: pdf.Text(
                              title!,
                              style: pdf.Theme.of(context)
                                  .defaultTextStyle
                                  .copyWith(
                                    fontWeight: pdf.FontWeight.normal,
                                    color: PDFService.blueBoldColor,
                                    fontSize: PDFService.singleJobTitleSize,
                                  ),
                            ),
                          )
                        ])
              : pdf.SizedBox.shrink(),
          pdf.Container(
            decoration: pdf.BoxDecoration(
                border: isRTL
                    ? pdf.Border(
                        right: pdf.BorderSide(color: green, width: 2),
                      )
                    : pdf.Border(
                        left: pdf.BorderSide(color: green, width: 2),
                      )),
            padding: isRTL
                ? pdf.EdgeInsets.only(right: 10, top: 5, bottom: 5)
                : pdf.EdgeInsets.only(left: 10, top: 5, bottom: 5),
            margin: isRTL
                ? pdf.EdgeInsets.only(right: 5)
                : pdf.EdgeInsets.only(left: 5),
            child: pdf.Column(
                crossAxisAlignment: pdf.CrossAxisAlignment.start,
                children: <pdf.Widget>[
                  pdf.SizedBox(height: 5),
                  isRTL
                      ? pdf.Row(
                          mainAxisAlignment: pdf.MainAxisAlignment.spaceBetween,
                          children: [
                              pdf.Flexible(
                                  flex: 1,
                                  child: pdf.Text(
                                    "${endDate ?? ""} - ${fromDate ?? ""}",
                                    style: pdf.Theme.of(context)
                                        .defaultTextStyle
                                        .copyWith(
                                            fontWeight: pdf.FontWeight.normal,
                                            fontSize: PDFService.bodySize,
                                            color: PdfColors.grey700),
                                  )),
                              pdf.Flexible(
                                  flex: 1,
                                  child: pdf.Text(
                                    jobCompany ?? "",
                                    style: pdf.Theme.of(context)
                                        .defaultTextStyle
                                        .copyWith(
                                            fontWeight: pdf.FontWeight.normal,
                                            fontSize: PDFService.bodySize,
                                            color: PdfColors.grey700),
                                  )),
                            ])
                      : pdf.Row(
                          mainAxisAlignment: pdf.MainAxisAlignment.spaceBetween,
                          children: [
                              pdf.Flexible(
                                  flex: 1,
                                  child: pdf.Text(
                                    jobCompany ?? "",
                                    style: pdf.Theme.of(context)
                                        .defaultTextStyle
                                        .copyWith(
                                            fontWeight: pdf.FontWeight.normal,
                                            fontSize: PDFService.bodySize,
                                            color: PdfColors.grey700),
                                  )),
                              pdf.Flexible(
                                  flex: 1,
                                  child: pdf.Text(
                                    "${fromDate ?? ""} - ${endDate ?? ""}",
                                    style: pdf.Theme.of(context)
                                        .defaultTextStyle
                                        .copyWith(
                                            fontWeight: pdf.FontWeight.normal,
                                            fontSize: PDFService.bodySize,
                                            color: PdfColors.grey700),
                                  ))
                            ]),
                  pdf.SizedBox(height: 10),
                  description != null
                      ? pdf.Text(description!,
                          style: pdf.Theme.of(context)
                              .defaultTextStyle
                              .copyWith(
                                  fontWeight: pdf.FontWeight.normal,
                                  fontSize: PDFService.bodySize,
                                  color: PdfColors.grey700))
                      : pdf.SizedBox.shrink(),
                  SizedBox(height: 10)
                ]),
          ),
        ]);
  }
}

Expected behavior

I want to render the last experience in a new page, not moving whole experiences to the next page.

Screenshots

Flutter Doctor

[✓] Flutter (Channel stable, 3.10.3, on macOS 13.4 22F66 darwin-arm64, locale en-US)
    • Flutter version 3.10.3 on channel stable at /opt/homebrew/Caskroom/flutter/2.10.4/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision f92f44110e (3 weeks ago), 2023-06-01 18:17:33 -0500
    • Engine revision 2a3401c9bb
    • Dart version 3.0.3
    • DevTools version 2.23.1

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0-rc4)
    • Android SDK at /Users/muhamadhaydar/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0-rc4
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b802.4-9586694)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.3.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14E300c
    • CocoaPods version 1.12.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.2)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b802.4-9586694)

[✓] IntelliJ IDEA Community Edition (version 2022.1.3)
    • IntelliJ at /Applications/IntelliJ IDEA CE.app
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart

[✓] VS Code (version 1.76.2)
    • VS Code at /Users/muhamadhaydar/Library/Mobile Documents/com~apple~CloudDocs/Desktop/Visual Studio Code.app/Contents
    • Flutter extension version 3.66.0

[✓] VS Code (version 1.78.2)
    • VS Code at /Users/muhamadhaydar/Desktop/Visual Studio Code.app/Contents
    • Flutter extension version 3.66.0

[✓] Connected device (4 available)
    • Muhamad Haydar’s iPhone (mobile) • 00008101-001A793901F8001E            • ios            • iOS 16.5.1 20F75
    • iPhone 14 Pro (mobile)           • B299F357-9A89-4725-AFA9-33977D747D89 • ios            •
      com.apple.CoreSimulator.SimRuntime.iOS-16-4 (simulator)
    • macOS (desktop)                  • macos                                • darwin-arm64   • macOS 13.4 22F66 darwin-arm64
    • Chrome (web)                     • chrome                               • web-javascript • Google Chrome 114.0.5735.133

[✓] Network resources
    • All expected network resources are available.

Desktop (please complete the following information):

• iOS
• Android

Smartphone (please complete the following information):

• Device: most IOS and android devices.
• Pdf Version: 3.10.4

Additional context

[MuhamadHaydar]

@DavBfr Please have a look of this issue.

[bksbora]

ahh try to divide experiences , you are showing whole experience part like one union

[MuhamadHaydar]

@bksbora As it's the list of items, I used ListView to show the experiences, if the height does not fit the page, it throws an issue and the pdf won't be generated.

[bksbora]

@MuhamadHaydar brother , think like that you are giving array.length to a builder it creates hisself completely then goes to A4 page ,not fits. So what can we do ,we can divide our array. Previously, you have 1 listview or 2 , now it should be more. Hope you understand , if you didn't add me on discord : borakececi