PdfViewer could not be scrollable when nested inside SingleChildScrollView

[abdelaziz-mahdy]

Issue Description: I have embedded a PDF viewer widget inside a SingleChildScrollView in my Flutter application. However, I've encountered an issue where the PDF viewer becomes non-scrollable when nested in this way.

Expected Behavior: The expected behavior is that the PDF viewer should remain scrollable even when placed inside a SingleChildScrollView.

Actual Behavior: The PDF viewer loses its scrolling functionality when nested inside a SingleChildScrollView.

Steps to Reproduce:

1. Place a PDF viewer widget inside a SingleChildScrollView.
2. Attempt to scroll through the PDF content.

Flutter Environment:

• Flutter version: 3.16.7
• Platform: (web-desktop) not tested on mobile

Additional Context: I am looking for a solution or workaround that allows the PDF viewer to be scrollable while still being a child of SingleChildScrollView. Any suggestions or insights into why this behavior occurs would be greatly appreciated.

[abdelaziz-mahdy]

i just tested on macos, and it works correctly, but web doesnt scroll

example: https://github.com/zezo357/pdfrx/tree/example

[espresso3389]

In general, nesting Scrollables are not recommended because scroll logics conflict each other.

Only possible workaround for such situlation is, just disable scrolling on focus change. If PdfViewer has focus, you should disable scrolling on the outer Scrollable widget by switching SingleChildScrollView.physics.

[abdelaziz-mahdy]

In general, nesting Scrollables are not recommended because scroll logics conflict each other.

Only possible workaround for such situlation is, just disable scrolling on focus change. If PdfViewer has focus, you should disable scrolling on the outer Scrollable widget by switching SingleChildScrollView.physics.

for the example i provided can you explain your workaround, since i dont see a focus node in the pdf viewer

also i works correctly in native macos , just web doesn't, so it may be a different way of handling scrolling?

[espresso3389]

Just wrapping PDFViewer with some Focus or such is enough to control Focus on PdfViewer I guess. Anyway, PdfViewer does not use its own FocusNode directly (so far).

[abdelaziz-mahdy]

thank you very much, if i implemented a workaround i will share here in case it helps

[abdelaziz-mahdy]

Note: I failed to implement it this why I didn't provide the workaround

[espresso3389]

Just a sample, which controls outer Scrollable's physics by tapping:

class _MyHomePageState extends State<MyHomePage> {
  bool focusedOnPdf = false;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Pdfrx Nested Scrollables'),
      ),
      body: GestureDetector(
        onTap: () => setState(() {
          focusedOnPdf = false;
        }),
        child: SingleChildScrollView(
          physics: focusedOnPdf
              ? const NeverScrollableScrollPhysics()
              : const AlwaysScrollableScrollPhysics(),
          child: Column(
            children: [
              Container(
                height: 1000,
                color: Colors.blue,
              ),
              SizedBox(
                height: 500,
                child: GestureDetector(
                    onTap: () => setState(() {
                          focusedOnPdf = true;
                        }),
                    child: PdfViewer.asset('assets/hello.pdf')),
              ),
              Container(
                height: 1000,
                color: Colors.green,
              ),
            ],
          ),
        ),
      ),
    );
  }
}

[abdelaziz-mahdy]

Thank you very much