Device ready not fired in Android devices having version 4.0-4.1

2 posts, 0 answers
  1. ruchin
    ruchin avatar
    33 posts
    Member since:
    Jun 2015

    Posted 22 Jul 2015 Link to this post

    Hi All,

    I am getting a strange behaviour on android devices having version 4.0-4.1. The device ready event is not fired .

    Consider this scenario,

    in my index.html page, i have added the following references,

     

      <link href="kendo/styles/kendo.mobile.all.min.css" rel="stylesheet" />
        <script src="cordova.js"></script>

        <script src="kendo/js/kendo.mobile.min.js" type="text/javascript"></script>​

      <script src="kendo/js/jquery.min.js" type="text/javascript"></script>

        <link href="kendo/styles/kendo.common.min.css" rel="stylesheet" />
        <link href="kendo/styles/kendo.default.min.css" rel="stylesheet" />
        <link href="kendo/styles/kendo.dataviz.min.css" rel="stylesheet" />
        <link href="kendo/styles/kendo.dataviz.default.min.css" rel="stylesheet" />
        <link href="kendo/styles/kendo.mobile.all.min.css" rel="stylesheet" />

       <script src="kendo/js/angular.min.js" type="text/javascript"></script>
        <script src="kendo/js/kendo.all.min.js" type="text/javascript"></script>
        <script src="kendo/js/kendo.button.min.js" type="text/javascript"></script>

     

    This causes the app to show a blank black screen for around 7 seconds after the splashscreen , then it shows a blank gray screen ,  the gray color is the theme of my project.

    All this while the deviceready event is not fired, this caused the app to get stuck.

     

    Now if i keep only these references,


     <link href="kendo/styles/kendo.mobile.all.min.css" rel="stylesheet" />
        <script src="cordova.js"></script>
        <script src="kendo/js/kendo.mobile.min.js" type="text/javascript"></script>​
      <script src="kendo/js/jquery.min.js" type="text/javascript"></script>

    The black blank screen shows but goes within  3 seconds , later the device ready event is fired and everything works fine.

    I need the other references i mentioned for a lot of functionality in the app.

    There is one more scenario while building the app using telerik app builder if i change the cordova version to 2.7 (deprecated) , there are no such problems.

     I tried setting the minimum sdk to 8, this does not help.

     
    For higher android versions from 4.2 onwards this issue does not occur, there is a smooth transition from splashscreen to the main app screen.



    Thanks

    Ruchin Dayal
  2. Anton Dobrev
    Admin
    Anton Dobrev avatar
    539 posts

    Posted 24 Jul 2015 Link to this post

    Hello Ruchin,

    Could you please specify the Cordova version you are using in your app or ideally provide a runnable sample?

    I am suspecting that you could easily fix the issue by placing the jQuery reference before Kendo UI:

    ​For example, the following resources should be sufficient for your app:
    <link href="kendo/styles/kendo.common.min.css" rel="stylesheet" />
    <link href="kendo/styles/kendo.default.min.css" rel="stylesheet" />
    <link href="kendo/styles/kendo.dataviz.min.css" rel="stylesheet" />
    <link href="kendo/styles/kendo.mobile.all.min.css" rel="stylesheet" />
         
    <script src="cordova.js"></script>
     
    <script src="kendo/js/jquery.min.js" type="text/javascript"></script>
    <script src="kendo/js/angular.min.js" type="text/javascript"></script>
    <script src="kendo/js/kendo.all.min.js" type="text/javascript"></script>

    Let me know if this helps.

    Regards,
    Anton Dobrev
    Telerik
     

    Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

     
Back to Top