Flutter ComboBox FormField causes rebuild when used with ModalRoute

I have upgraded to Flutter 3.19.4 from 3.16.9 and the combo box in PDF Viewer now causes rebuilds of the entire pdf when pressed.


See a minimally reproducible example here: https://github.com/isenbj/Syncfusion_slow_pdf_creation/blob/master/lib/main.dart

When Line 51 is commented out, pressing the combo box field causes no rebuilds. 


Once the line is not commented out, pressing the line will cause multiple rebuilds. This is an issue because my pdf takes a second or two tow build and has many combo boxes. This is a poor user experience.


commented out, no prints.

Image_4345_1711611753788

after un commenting line

Image_9156_1711611837436




3 Replies 1 reply marked as answer

IP ImmanKumarP Palanikumar Syncfusion Team March 29, 2024 08:05 AM UTC

Hi Jeremy Isenburg,

We use the DropdownButton widget to render the Combo box form field in the SfPdfViewer widget.

The reported issue can be replicated without the SfPdfViewer widget itself. Please find the minimal code snippet to replicate the issue without using the SfPdfViewer widget and using only the DropDownButton widget.


import 'package:flutter/material.dart';
// import 'package:syncfusion_flutter_pdfviewer/pdfviewer.dart';


void main() {
  runApp(
    MaterialApp(
      title: 'Title',
      home: const ComboBoxDemo(),
      routes: {
        TestScreen.routeName: (ctx) => TestScreen(),
      },
    ),
  );
}


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


  @override
  State<ComboBoxDemo> createState() => _ComboBoxDemoState();
}


class _ComboBoxDemoState extends State<ComboBoxDemo> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: ElevatedButton(
          onPressed: () => Navigator.of(context)
              .pushNamed(TestScreen.routeName, arguments: "some arg")
              .then((value) => setState(() {})),
          child: const Text('press me'),
        ),
      ),
    );
  }
}


class TestScreen extends StatelessWidget {
  static const routeName = '/route';


  final List<String> items = <String>['A', 'B', 'C', 'D'];


  TestScreen({super.key});


  @override
  Widget build(BuildContext context) {
    print('building new screen!');
    final args = ModalRoute.of(context)!.settings.arguments as String;
    // return Scaffold(body: SfPdfViewer.asset('assets/radio.pdf'));
    return Scaffold(
      body: DropdownButton<String>(
          value: items[0],
          items: items
              .map((item) => DropdownMenuItem<String>(
                    value: item,
                    child: Text(item),
                  ))
              .toList(),
          onChanged: (newValue) {
            print('new value: $newValue');
          }),
    );
  }
}


We suspect that this is the behavior of Flutter framework.



JI Jeremy Isenburg March 29, 2024 04:48 PM UTC

I looked into the flutter issues in git after you mention it is with the dropdown button.


https://github.com/flutter/flutter/issues/143709


Looks like this is intended new behavior, and I will have to work around it. For future users, see comments in the github post about workarounds.


Thanks.


Marked as answer

IP ImmanKumarP Palanikumar Syncfusion Team April 5, 2024 04:40 AM UTC

Hi Jeremy Isenburg,

Thank you for sharing this information.


Loader.
Up arrow icon