title: Kendo UI not Displaying Title and View
body: <p>I have recently began developing an application and decided KendoUI along with phonegap would be the best solution to our project, however I cannot get KendoUI to display correctly.</p>
  
  <p>I am using a mac to develop the application and when I run the app it displays the code perfectly, I am not sure if this is because it is rendering it as an iOS device and that is why it is displaying correctly, but it does not work with the android device as you can see here: Note this is not just for tablets, I have tried on a Galaxy SII, HTC EVO 4G, and a Nexus 10. All of which produce the same results displayed below.</p>
  
  <p>The problem is it seems the application is ignoring the view and placing the title in the wrong place.</p>
  
  <p>If you need anymore information feel free to ask.. I don't know what else to list.</p>
  
  <p>My file structure for this application is:</p>
  
  <pre><code>/ &lt;--- project root
   /assets/
    /www/
     /css/
      /kendo.mobile.all.min.css
     /js/
      /jquery.min.js
      /kendo.all.min.js
      /kendo.mobile.min.js
     cordova-2.4.0.js
     index.html
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/5up8P.png" alt="enter image description here"></p>
  
  <p>The tutorial: <a href="http://docs.kendoui.com/getting-started/introduction" rel="nofollow noreferrer">http://docs.kendoui.com/getting-started/introduction</a>
  Here is the source code from the tutorial I am following:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;My App&lt;/title&gt;
      &lt;script src="cordova-2.4.0.js"&gt;&lt;/script&gt;
      &lt;link href="css/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" /&gt;
      &lt;script src="js/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="js/kendo.mobile.min.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script&gt;    
      &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="home" data-role="view" data-layout="default"&gt;
      Hello Mobile World!
  &lt;/div&gt;
  
  &lt;section data-role="layout" data-id="default"&gt;
      &lt;header data-role="header"&gt;
          &lt;div data-role="navbar"&gt;My App&lt;/div&gt;
      &lt;/header&gt;
      &lt;!--View content will render here--&gt;
      &lt;footer data-role="footer"&gt;
          &lt;div data-role="tabstrip"&gt;
              &lt;a href="#home"&gt;Home&lt;/a&gt;        
          &lt;/div&gt; 
      &lt;/footer&gt;
  &lt;/section&gt;
  &lt;script&gt;var app = new kendo.mobile.Application();&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I also used this tutorial however I do not understand the config file they give the one posted is mine: <a href="http://www.adobe.com/devnet/phonegap/articles/getting-started-kendo-ui-mobile-phonegap-build.html" rel="nofollow noreferrer">http://www.adobe.com/devnet/phonegap/articles/getting-started-kendo-ui-mobile-phonegap-build.html</a></p>
  
  <pre><code>    &lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;!--
         Licensed to the Apache Software Foundation (ASF) under one
         or more contributor license agreements.  See the NOTICE file
         distributed with this work for additional information
         regarding copyright ownership.  The ASF licenses this file
         to you under the Apache License, Version 2.0 (the
         "License"); you may not use this file except in compliance
         with the License.  You may obtain a copy of the License at
  
           http://www.apache.org/licenses/LICENSE-2.0
  
         Unless required by applicable law or agreed to in writing,
         software distributed under the License is distributed on an
         "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
         KIND, either express or implied.  See the License for the
         specific language governing permissions and limitations
         under the License.
  --&gt;
  &lt;cordova&gt;
      &lt;!--
      access elements control the Android whitelist.
      Domains are assumed blocked unless set otherwise
       --&gt;
  
      &lt;access origin="http://127.0.0.1*"/&gt; &lt;!-- allow local pages --&gt;
  
      &lt;!-- &lt;access origin="https://example.com" /&gt; allow any secure requests to example.com --&gt;
      &lt;!-- &lt;access origin="https://example.com" subdomains="true" /&gt; such as above, but including subdomains, such as www --&gt;
      &lt;access origin=".*"/&gt;
  
      &lt;!-- &lt;content src="http://mysite.com/myapp.html" /&gt; for external pages --&gt;
      &lt;content src="index.html" /&gt;
  
      &lt;log level="DEBUG"/&gt;
      &lt;preference name="useBrowserHistory" value="true" /&gt;
      &lt;preference name="exit-on-suspend" value="false" /&gt;
  &lt;plugins&gt;
      &lt;plugin name="App" value="org.apache.cordova.App"/&gt;
      &lt;plugin name="Geolocation" value="org.apache.cordova.GeoBroker"/&gt;
      &lt;plugin name="Device" value="org.apache.cordova.Device"/&gt;
      &lt;plugin name="Accelerometer" value="org.apache.cordova.AccelListener"/&gt;
      &lt;plugin name="Compass" value="org.apache.cordova.CompassListener"/&gt;
      &lt;plugin name="Media" value="org.apache.cordova.AudioHandler"/&gt;
      &lt;plugin name="Camera" value="org.apache.cordova.CameraLauncher"/&gt;
      &lt;plugin name="Contacts" value="org.apache.cordova.ContactManager"/&gt;
      &lt;plugin name="File" value="org.apache.cordova.FileUtils"/&gt;
      &lt;plugin name="NetworkStatus" value="org.apache.cordova.NetworkManager"/&gt;
      &lt;plugin name="Notification" value="org.apache.cordova.Notification"/&gt;
      &lt;plugin name="Storage" value="org.apache.cordova.Storage"/&gt;
      &lt;plugin name="FileTransfer" value="org.apache.cordova.FileTransfer"/&gt;
      &lt;plugin name="Capture" value="org.apache.cordova.Capture"/&gt;
      &lt;plugin name="Battery" value="org.apache.cordova.BatteryListener"/&gt;
      &lt;plugin name="SplashScreen" value="org.apache.cordova.SplashScreen"/&gt;
      &lt;plugin name="Echo" value="org.apache.cordova.Echo" /&gt;
      &lt;plugin name="Globalization" value="org.apache.cordova.Globalization"/&gt;
      &lt;plugin name="InAppBrowser" value="org.apache.cordova.InAppBrowser"/&gt;
  &lt;/plugins&gt;
  &lt;/cordova&gt;
  </code></pre>
  
  <p>Finally my MainActivity:</p>
  
  <pre><code>package com.example.project;
  
  import android.os.Bundle;
  import org.apache.cordova.DroidGap;
  
  public class MainActivity extends DroidGap {
  
      @Override
      public void onCreate(Bundle savedInstanceState) {
          super.onCreate(savedInstanceState);
          super.loadUrl("file:///android_asset/www/index.html");
      }
  }
  </code></pre>
  
  <p>Edit: I just tried this solution.. <a href="http://docs.kendoui.com/getting-started/mobile/navbar#showing-hidden-view-title" rel="nofollow noreferrer">http://docs.kendoui.com/getting-started/mobile/navbar#showing-hidden-view-title</a> however it was unsuccessful in showing the view. I gained this from another question: <a href="https://stackoverflow.com/questions/13043724/header-and-footer-not-displayed-in-kendo-ui-mobile-phonegap-application-for-andr?rq=1">header and footer not displayed in Kendo UI Mobile PhoneGap Application For Android</a> Here is the new result: </p>
  
  <p><img src="https://i.stack.imgur.com/nQUGQ.png" alt="enter image description here"></p>