Is it possible to page-break after overflowing the screen, like an e-book reader?

[sliverRing]

I like the flutter_html plugin very much, and I have been paying attention to it since it appeared in the flutter market.

So hats off to the author!

But I found that dragging the screen is cumbersome when rendering very long text content, and it is not suitable for reading. Is it possible to realize the page breaking function after overflowing the screen? Just like an e-book reader.

[erickok]

I think this was suggested before. While I understand the use-case very much, I am afraid this isn't supported and I don't see this happening any time soon, if ever. In the end, flutter_html just renders a (very large) rich text and that widget doesn't support such style of layout/wrapping.

Some people try to do this using TextPainter directly but with all the rich (images, tables, list, etc.) features we offer I have not much confidence that this is realistic.

[sliverRing]

thank you for your reply. I think that as a professional and practical html text parser, the function I proposed can exist. For developers, they can choose paged mode (in plain text mode) or no page break (with a lot of pictures or tables).

[sliverRing]

In fact, for Flutter, it is still much more difficult to achieve a complex and multi-style text reading experience similar to H5 web pages.

Even with flutter_html, which can fine-tune the control of each html tag, for software developers, how users input, what tags are used, and what styles are used... are all uncontrollable.

Therefore, in the actual application development process, perhaps many developers will not parse overly complex text content when using the flutter html parser.

They even limit the formats in which users can post content on the app. If more complex content, I think they will choose webview

[Vito0912]

@sliverRing, I’m not sure if you’ve found a solution yet, but I came across something that might meet your needs. Check out this link: https://github.com/FlafyDev/epub_reader/. It could be a good source of inspiration.

However, it uses a webview, so it’s not compatible with Windows or other desktop platforms, as far as I know. I’m not very familiar with webviews.

I’m trying to build an e-reader app with multiplatform (including windows and mac) support and features like syncing. Therefore for my purposes, I need a different solution. Right now, I’m converting widgets into a List<Widget>, calculating the height of each one, and adding them until the page is full. To fill the whole page (since there’s usually some space left over, because you can´t just crunch in an half Widget), I use a formula to calculate the position based on an approximate number of characters that will fit.

Then I “render” it and check if it fits. If it doesn’t fit, I try again with fewer characters. If it does fit, I try again with more characters. <- I think there would be a far better method, that I don´t know. This would solve my perfomance issues on older mobile devices

This approach works to some extent, but it’s not very efficient. Another issue I’ve encountered is that most e-readers only indent the first line of a paragraph and then align the rest of the text to the left. Since my approach renders the whole paragraph as a widget, it intends everything, which doesn’t look great.

At this point, I’m not sure if Flutter is the best choice for this kind of project.

[Sub6Resources]

You might also consider breaking your html up into pages manually and then passing them to our widget?

As has been mentioned, this is difficult in practice due to the wide range of use cases for this plugin.