Monocle flickering on page turns in Cordova Android app

107 views
Skip to first unread message

David Christensen

unread,
Dec 19, 2014, 12:59:16 AM12/19/14
to monoc...@googlegroups.com
Hello,

I have set up an html ebook with Monocle using more or less the same code as the scrubber example on this page

It works beautifully within any of my computer's browsers (Firefox, Chrome & Cromium) and I'm quite happy.

I then added all of the same ebook files to a Cordova project, run:
cordova build
and then add the app file (.apk) to Dropbox to install on my Nexus 4. 

The app works as expected, except that there is a lot of flickering after forward page turns for many (but not all page turns). It seems most noticeable for a 1 or 2 page turns before and after a page with .jpg images. If there is a long stretch of pages (say 10 to 15) with no images, it seems like page turns are silky again.The flicker seems to show a distorted version of the previous page for a millisecond. If I turn from a page with an image, I will see the image on the next page's flicker. See video (sometimes it is more obvious that seen in the video).

If I turn the pages backward within the app, it seems it's just as silky as you might hope.

Any one else experience this within Cordova?
Are there any tips or ideas for troubleshooting?
Thanks for any ideas you might have.
-DC
IMG_0457.MOV

Cássio Nandi Citadin

unread,
Dec 19, 2014, 6:06:42 AM12/19/14
to monoc...@googlegroups.com
David, sorry for the off-topic, but you keep the epub files on the device's storage or it is read directly in the browser, page by page. 

--
You received this message because you are subscribed to the Google Groups "Monocle" group.
To unsubscribe from this group and stop receiving emails from it, send an email to monocle-js+...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

David Christensen

unread,
Dec 19, 2014, 1:13:27 PM12/19/14
to monoc...@googlegroups.com
It is an html ebook (not an EPUB). All of the book content in chapter files. In my case, I have:
  •  index.html - this is basic index with links to each chapter (there is no monocle.js code in this file)
  • 1.html - the first chapter, as seen in the video (all book text for chapter 1 is in this file)
  • 2.html - chapter 2
etc


--
You received this message because you are subscribed to a topic in the Google Groups "Monocle" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/monocle-js/A1jowaYfxow/unsubscribe.
To unsubscribe from this group and all its topics, send an email to monocle-js+...@googlegroups.com.

Daniel Anken

unread,
Jul 3, 2015, 6:57:36 AM7/3/15
to monoc...@googlegroups.com
Hi,

I have the exact same issue with an Android app.
Are there any solutions regarding this issue ?

Thanks - any help welcome.


Daniel

David

unread,
Jul 3, 2015, 11:52:17 AM7/3/15
to monoc...@googlegroups.com
Hi Daniel,

I recently put another book in a Cordova app (Memoirs of Fanny Hill). As far as I can tell, the problem is gone with this latest book. My hypothesis is the flickering happens when you have a larger file size. With the book, Treasure Island, there were several JPG images and the book flickered like crazy.

I also half suspected (and partly still do) that using jquery mobile was part of the problem. 
-david

Daniel Anken

unread,
Jul 4, 2015, 6:25:23 AM7/4/15
to monoc...@googlegroups.com
Hi David,

Thank you for the info.
We do indeed have a lot of images in the book.
What is surprising is that it does not happen on every Android phone - on some it is fine.

So as I understand it, you did not find a solution for the issue, right ?


Daniel

David Christensen

unread,
Jul 4, 2015, 4:29:12 PM7/4/15
to monoc...@googlegroups.com

Correct. I never found a solution, so it ended up just offering it for free in the Play Store.

Daniel Anken

unread,
Jul 7, 2015, 4:29:22 AM7/7/15
to monoc...@googlegroups.com
Hi David,

I actually resolved the problem by jumping into monocore's code.
I tried to use another page Slider (thought the error might disappear when using the instant Slider) but it did not work (couldn't use the other sliders).

So I looked for what the error might actually be, and my patch (see hereby) seems to work perfectly on all the devices I tested it on (Android 4.4 - 5.1).
I do not understand why it was coded that way to begin with, but maybe the Monocle's developers might answer that.

Anyway, I hope this patch helps some other people !!


Daniel
monocle_core_flickering_patch.patch
Reply all
Reply to author
Forward
0 new messages