5

I am prototyping an Epub reader in Flutter. Each chapter is displayed in a WebView and these WebViews are placed inside a PageView. The contents of each WebView is paginated thanks to a multi-column layout: 1 column = 1 visible page. During a horizontal swipe gesture, the expected behavior is to have the WebView's contents scrolling while possible, and then have the PageView scrolling between pages as soon as the WebView has reached its limit. Note: during 1 swipe gesture, both can happen: WebView scrolling first, then the PageView. On Android, it's easily handled thanks to overscroll notifications, as in This code.

But in Flutter, the WebViews are not scrollable and we cannot use the OverscrollNotifications (AFAIK). So I have a few working solutions based on injecting JS code inside the WebView to broadcast the scroll position to the Flutter side, but this is very dirty and frustrating, I hate this kind of code...

Does anyone have a good solution? Thanks a lot in advance!

EDIT: I have a new idea based on Javascript. Instead of continuously sending scroll notifications to the Flutter side during scrolling, I will insert transparent pixels at the beginning and end of each "chapter", and send events to Flutter only when these elements become visible/invisible (thanks to the IntersectionObserver API). But such a solution requires injecting stuff into the chapter's HTML, which is not the best solution. Any better idea is still welcome!

SurfinJim
  • 51
  • 4

0 Answers0