I am trying to implement kendo ui in my phonegap app. I am using cordova2.2.0 and also put < android:hardwareAccelerated="false" > in the androidmanifest.xml.
It is not working and the error is cordovawebview timeout error . Increasing the timeout time span also not works.
here is my code:
<!DOCTYPE html>
<html>
<head>
<title>Kendo UI Complex Demo</title>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi" />
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.mobile.all.min.css" />
<!-- <link rel="stylesheet" href="style.css" /> -->
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://cdn.kendostatic.com/2013.2.716/js/kendo.all.min.js"></script>
<!-- <script src="script.js"></script>
--></head>
<body>
<!-- Header && Footer-->
<div data-role="layout" data-id="app-toolbar">
<div data-role="header">
<div data-role="navbar">
<a href="#panel" data-rel="drawer" data-role="button" data-icon="action" data-align="left">Panel</a>
<span data-role="view-title">My View Title</span>
</div>
</div>
<footer data-role="footer">
<div data-role="tabstrip">
<a data-icon="globe" href="#page1">Page 1</a>
<a data-icon="organize" href="#page2">Page 2</a>
<a data-icon="contacts" href="#page3">Page 3</a>
</div>
</footer>
</div>
<!-- Page 1 -->
<div data-role="view" id="page1" data-transition="slide:left" data-layout="app-toolbar" data-title="Page 1 header">
<img src="http://www.winnipeghumanesociety.ca/images/cute-puppy.jpg" title="Some picture" width="50%" height="auto" />
<ul data-role="listview" data-style="inset">
<li><a href="#page2">Slide to page 2</a>
</li>
<li>Bar</li>
</ul>
</div>
<!-- Page 2 -->
<div data-role="view" id="page2" data-transition="slide:left" data-layout="app-toolbar" data-title="Page 2 header">
<a href="#page1" data-role="button">Slide back to page 1</a>
</div>
<!-- Page 3 -->
<div data-role="view" id="page3" data-transition="slide:left" data-layout="app-toolbar" data-title="Page 3 header">
<a href="#page1" data-role="button">Slide back to page 1</a>
</div>
<!-- Sliding panel -->
<div data-role="drawer" id="panel">
Panel
</div>
</body>
<script>
$( document ).ready(function() {
var app = new kendo.mobile.Application($(document.body), { skin: 'flat' });
})
</script>
</html>
thank you in advance.
1 Answer, 1 is accepted
If I understand correctly, you are using PhoneGap and not AppBuilder. This forum is aimed at discussing problems and scenarios related to Telerik AppBuilder by Progress.
A quick note based on your code snippet—it seems that you are using outdated versions of both Kendo UI and Cordova. I advice you to uprade both product versions and test the scenario again. If the issue persists and you are not reproducing it in AppBuilder, you can open a thread in a community board like Stack Overflow, where discussions about open source frameworks like PhoneGap and Kendo Hybrid UI take place.
Regards,
Tsvetina
Telerik by Progress
Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.