Screen flash on navigation with WP8

9 posts, 0 answers
  1. Kenneth
    Kenneth avatar
    70 posts
    Member since:
    Feb 2008

    Posted 05 Apr 2013 Link to this post

    I am porting an android/iOS kendoui mobile app to wp8. There is a very pronounced what screen that flashes on every navigation. I'm not doing anything special. Has this been reported by others? Is there a fix?
  2. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 05 Apr 2013 Link to this post

    Hello Kenneth,

    This is not a known issue, can you provide a sample page where we can reproduce it? Thank you in advance.

    Greetings,
    Kamen Bundev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Kenneth
    Kenneth avatar
    70 posts
    Member since:
    Feb 2008

    Posted 05 Apr 2013 Link to this post

    In trying to pull together a simple solution to illustrate the issue - I discovered the root cause.

    When navigating to these views I am updating the view-layout elements' href attributes. This is what is causing the flash. It works fine in android/ios.

    I am going to look at switching to using an onclick in instead of changing the href, to see if I can avoid the flash.
  5. Kenneth
    Kenneth avatar
    70 posts
    Member since:
    Feb 2008

    Posted 05 Apr 2013 Link to this post

    The onclick idea also works in iOS and android - but still causes the flash on wp8. As long as I am using a static href for the tabstrip element there is no flash, when I try to dynamically change the href, or to dynamically navigate using the onclick - I get the flash.

    Any ideas?
  6. Kenneth
    Kenneth avatar
    70 posts
    Member since:
    Feb 2008

    Posted 05 Apr 2013 Link to this post

    Have developed a sample app that demonstrates the issue. If a tabstrip item href as a query string it will cause the flash in WP8.

    This technique is very useful in managing program state, would require some significant work arounds for my app, and works fine in android/iOS. Anyone have any ideas?
  7. Kenneth
    Kenneth avatar
    70 posts
    Member since:
    Feb 2008

    Posted 09 Apr 2013 Link to this post

    Any thoughts? After looking at several possible ideas, came down to having a query string in an href causes the flash. Sample code attached earlier in thread that demonstrates this.
  8. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 09 Apr 2013 Link to this post

    Hello Kenneth,

    No ideas yet, I've ran through our code and concluded this is something PhoneGap related - the query strings trigger something there. However up until now I wasn't able to nail the issue down. I'll get back to it tomorrow. On a side note the loading animation fix didn't get it in the today's internal build, it will be in the next one tomorrow.

    Greetings,
    Kamen Bundev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  9. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 10 Apr 2013 Link to this post

    Hello Kenneth,

    We managed to nail it down - the flash seems to be caused by a bug in the WP8 WebBrowser control that is used both in PhoneGap and HTML5 apps. The bug causes a screen flash when location.hash is changed with a string that has a question mark in it. This is contrary to the spec - the hash fragment doesn't need to be encoded at all. We will try to come up with a proper solution for this issue for the service pack. Meanwhile you can URI encode the question mark before navigation. Unfortunately this can't be done directly in the TabStrip URLs - we need to override the ViewEngine's navigate event. Try adding this handler to your initial View init event:
    function replaceNavigate() {
        app.pane
            .unbind("navigate")
            .bind("navigate", function(e) {
                app.router.navigate(e.url.replace("?","%3f"), true);
            });
    }


    Let me know if this fixes the issue.

    Regards,
    Kamen Bundev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  10. Kenneth
    Kenneth avatar
    70 posts
    Member since:
    Feb 2008

    Posted 10 Apr 2013 Link to this post

    This worked - although I had to change the logic for parsing the query string. But - no flash. Thanks.
Back to Top
Kendo UI is VS 2017 Ready