Экспорт Flutter SfDataGrid в PDF не отображает StackedHeader и Footer

Я хочу экспортировать SFDataGrid в PDF, включая StackedHeader и Footer, но он всегда пуст. Пример кода ниже

      import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
import 'package:syncfusion_flutter_pdf/pdf.dart' as sf_pdf;
import 'package:syncfusion_flutter_datagrid_export/export.dart';
import 'package:printing/printing.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    List<Employee> employees = [
      Employee(10001, 'James', 'Project Lead', 20000),
      Employee(10002, 'Kathryn', 'Manager', 30000),
      Employee(10003, 'Lara', 'Developer', 15000),
      Employee(10004, 'Michael', 'Designer', 15000),
      Employee(10005, 'Martin', 'Developer', 15000),
      Employee(10006, 'Newberry', 'Developer', 15000),
      Employee(10007, 'Balnc', 'Developer', 15000),
      Employee(10008, 'Perry', 'Developer', 15000),
      Employee(10009, 'Gable', 'Developer', 15000),
      Employee(10010, 'Grimes', 'Developer', 15000)
    ];

    GlobalKey<SfDataGridState> key = GlobalKey<SfDataGridState>();
    EmployeeDataSource employeeDataSource =
        EmployeeDataSource(employees: employees);
    void exportDataGridToPDF() async {
      sf_pdf.PdfDocument document = key.currentState!.exportToPdfDocument();
      final List<int> bytes = document.saveSync();

      await Printing.layoutPdf(onLayout: (_) => Uint8List.fromList(bytes));
      document.dispose();
    }

    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        body: Column(
          children: [
            SfDataGrid(
              key: key,
              source: employeeDataSource,
              stackedHeaderRows: [
                StackedHeaderRow(
                  cells: [
                    StackedHeaderCell(
                      columnNames: ['id', 'name', 'designation', 'salary'],
                      child: const Text("Stacked Header"),
                    ),
                  ],
                ),
              ],
              footer: const Text("FOOTER"),
              columns: [
                GridColumn(
                    columnName: 'id',
                    label: Container(
                        padding: const EdgeInsets.symmetric(horizontal: 16.0),
                        alignment: Alignment.centerRight,
                        child: const Text(
                          'ID',
                          overflow: TextOverflow.ellipsis,
                        ))),
                GridColumn(
                    columnName: 'name',
                    label: Container(
                        padding: const EdgeInsets.symmetric(horizontal: 16.0),
                        alignment: Alignment.centerLeft,
                        child: const Text(
                          'Name',
                          overflow: TextOverflow.ellipsis,
                        ))),
                GridColumn(
                    columnName: 'designation',
                    label: Container(
                        padding: const EdgeInsets.symmetric(horizontal: 16.0),
                        alignment: Alignment.centerLeft,
                        child: const Text(
                          'Designation',
                          overflow: TextOverflow.ellipsis,
                        ))),
                GridColumn(
                    columnName: 'salary',
                    label: Container(
                        padding: const EdgeInsets.symmetric(horizontal: 16.0),
                        alignment: Alignment.centerRight,
                        child: const Text(
                          'Salary',
                          overflow: TextOverflow.ellipsis,
                        ))),
              ],
            ),
            ElevatedButton(
                onPressed: () => exportDataGridToPDF(),
                child: const Text("Export to PDF"))
          ],
        ),
      ),
    );
  }
}

class Employee {
  Employee(this.id, this.name, this.designation, this.salary);
  final int id;
  final String name;
  final String designation;
  final int salary;
}

class EmployeeDataSource extends DataGridSource {
  EmployeeDataSource({required List<Employee> employees}) {
    dataGridRows = employees
        .map<DataGridRow>((dataGridRow) => DataGridRow(cells: [
              DataGridCell<int>(columnName: 'id', value: dataGridRow.id),
              DataGridCell<String>(columnName: 'name', value: dataGridRow.name),
              DataGridCell<String>(
                  columnName: 'designation', value: dataGridRow.designation),
              DataGridCell<int>(
                  columnName: 'salary', value: dataGridRow.salary),
            ]))
        .toList();
  }

  List<DataGridRow> dataGridRows = [];

  @override
  List<DataGridRow> get rows => dataGridRows;

  @override
  DataGridRowAdapter? buildRow(DataGridRow row) {
    return DataGridRowAdapter(
        cells: row.getCells().map<Widget>((dataGridCell) {
      return Container(
          alignment: (dataGridCell.columnName == 'id' ||
                  dataGridCell.columnName == 'salary')
              ? Alignment.centerRight
              : Alignment.centerLeft,
          padding: const EdgeInsets.symmetric(horizontal: 16.0),
          child: Text(
            dataGridCell.value.toString(),
            overflow: TextOverflow.ellipsis,
          ));
    }).toList());
  }
}

Выход

Мой другой вариант - создать собственный нижний колонтитул, используяDataGridToPdfConverter-DataGridPdfHeaderFooterExportCallbackно я не могу найти, как получить положение нижней части таблицы данных на выходе. По сути, я хочу создать нижний колонтитул чуть ниже таблицы данных.

1 ответ

Чтобы отобразить StackedHeader в экспортированных документах, установите свойство text StackedHeaderCell. Я не могу помочь вам с нижним колонтитулом.

Другие вопросы по тегам