Phonegap NativeControls无法正常工作
我已阅读并关注本网站或网站上有关如何使用Jquery Mobile将NativeControls插件添加到PhoneGap(Cordova 1.5)的教程。 我无法让工具栏正常工作。
我尝试了很多不同的事情而没有运气。 这是我的代码:
HTML:
<!----> LOGIN
<!-- Main Page Footer
-->
main.js:
function onBodyLoad() { $('#submit').click(function() { var program = document.getElementById('program').value; var username = document.getElementById('username').value; var password = document.getElementById('password').value; if (!program || program == "") { alert("Please enter a program"); return false; } else if (!username || username == "") { alert("Please enter a username"); return false; } else if (!password || password == "") { alert("Please enter a password"); return false; } return true; }); document.addEventListener("deviceready", onDeviceReady, false); } /* When this function is called, Cordova has been initialized and is ready to roll */ /* If you are supporting your own protocol, the var invokeString will contain any arguments to the app launch. see http://iosdevelopertips.com/cocoa/launching-your-own-application-via-a-custom-url-scheme.html for more details -jm */ function onDeviceReady() { // Initializating TabBar navigator.notification.alert("Cordova is working"); nativeControls = window.plugins.nativeControls; navigator.notification.alert(nativeControls); nativeControls.createTabBar(); // Books tab nativeControls.createTabBarItem( "books", "Books", //"/www/tabs/book.png", "", {"onSelect": function() { books(); }} ); // Stats tab nativeControls.createTabBarItem( "finished", "Finished", //"/www/tabs/box.png", "", {"onSelect": function() { finished(); }} ); // About tab nativeControls.createTabBarItem( "about", "About", //"/www/tabs/info.png", "", {"onSelect": function() { about(); }} ); // Compile the TabBar nativeControls.showTabBar(); nativeControls.showTabBarItems("books", "finished", "about"); nativeControls.selectTabBarItem("books"); } function books() { } function about() { } function finished(){ }
如你所见,我做了一个:
navigator.notification.alert("Cordova is working"); nativeControls = window.plugins.nativeControls; navigator.notification.alert(nativeControls); nativeControls.createTabBar();
测试nativeControls变量是否包含任何内容。 我没有得到任何警报。 我甚至尝试过:
navigator.notification.alert(window);
没有运气。 我已将NativeControls键添加到Cordova.plist作为NativeControls – NativeControls。
任何帮助将不胜感激!
我将源代码上传到iTunes商店的jQM应用程序,该应用程序在两个方向上都有一个Tabbar工作在iPhone和iPad上的示例。 我希望它有所帮助!!
http://zsprawl.com/iOS/2012/04/nativecontrols-plugin-for-cordovaphonegap/
我也遭受了同样的挣扎。 构造函数可能存在一些误解。
我看到一个post ,其中添加了一些额外的行,以避免任何冲突,它的工作原理!
这是我的代码,它的工作原理:
function onDeviceReady() { var nc = window.plugins.nativeControls; nc.createTabBar(); nc.createTabBarItem('whoTabItem', 'Quem?', '', null); nc.createTabBarItem('whereTabItem', 'Onde?', '', null); nc.createTabBarItem('whatTabItem', 'O que?', '', null); nc.showTabBar(); nc.showTabBarItems('whoTabItem', 'whereTabItem', 'whatTabItem'); }
在NativeControls.js的最后,window.plugins.nativeControls被初始化,所以应该没问题:
if(!window.plugins) window.plugins = {}; window.plugins.nativeControls = new NativeControls();
您对createTabBarItem的调用有5个参数 – 它只有4个。消除第四个空白参数并进行测试。 也许这就是你的onSelectfunction不起作用的原因。
你需要在main.js文件的顶部将nativeControls定义为变量,然后你可以在这一行中使用它,否则,js将通过关于未定义变量的exception
nativeControls = window.plugins.nativeControls;