Question

在尝试了一堆javascript标签栏（大多数在使用表单时失败）后，我认为去本土可能是个好主意。

有谁知道如何在jqTouch应用程序中加入原生UIControls（tabbar＆amp; header）。我仍然需要保留对标题中“后退”和“信息”按钮的控制。

谢谢！格伦

Answer 1

此时您需要确定的是混合方法的好处是什么？在您花费所有时间编写本机代码以支持导航以及选项卡和标题栏之后，您将编写相当多的代码。

然后尝试将这些代码放在一起以接口回Phonegap UIWebview的方式，恕我直言，它会变得过于复杂......但是可以这样做。

我建议您首先编写本机应用程序并使其正常运行，然后将该代码重新集成到PhoneGap Applicate Delegate中

这是一个complete tutorial，这将是一个很好的起点

Answer 2

我已经找到了最好的方法来实现这个功能，并且认为我会分享代码。

所以这是组合：jQTouch + Phonegap = Native Tabbar将与jQTouch协同工作。 IE浏览器。单击标签栏图标时，它将转到相应的jQTouch页面。



document.addEventListener("deviceready",setupToolbars);

function setupToolbars() {
 // Add these if you want the toolbar
 // window.uicontrols.createToolBar();
 // window.uicontrols.setToolBarTitle("Toolbar");

var activeTab;
activeTab = "#home"; // Better to have intro screen at home, and then make tab1 the first tab.

window.uicontrols.createTabBar();

window.uicontrols.createTabBarItem("tab1", "Tab1", "/www/images/tabs/yourimage1.png", {
  onSelect: function() {
    myName = "#home"
    if (activeTab != myName)
    {
        jQT.goTo("#home", "fade");
        activeTab = myName;
    }
  }
});

window.uicontrols.createTabBarItem("tab2", "Tab2", "/www/images/tabs/yourimage2.png", {
  onSelect: function() {
    myName = "#tab2"
    if (activeTab != myName)
    {
        jQT.goTo("#tab2", "fade");
        activeTab = myName;
    }
  }
});

window.uicontrols.createTabBarItem("tab3", "Tab3", "/www/images/tabs/yourimage3.png", {
  onSelect: function() {
    myName = "#tab3"
    if (activeTab != myName)
    {
        jQT.goTo("#tab3", "fade");
        activeTab = myName;
    }
  }
});

 window.uicontrols.createTabBarItem("tab4", "Tab4", "/www/images/tabs/yourimage4.png", {
  onSelect: function() {
    myName = "#tab4"
    if (activeTab != myName)
    {
        jQT.goTo("#tab4", "fade");
        activeTab = myName;
    }
  }
});

 window.uicontrols.showTabBar();
 window.uicontrols.showTabBarItems("tab1", "tab2", "tab3", "tab4");
}

使用jqTouch的原生UIControl

2 个答案: