appceleratororientationchange 导航栏图像隐藏/显示

Question

我正在为 iPhone 构建一个带有一些标签的应用程序。 改写了appcelerator网站here中的问题

当我从纵向更改为横向时，我想隐藏导航栏。

如果我不切换到另一个选项卡，它会正常工作。 但是当我纵向查看 1 个标签时， 切换到另一个选项卡，更改为横向视图， 切换回第一个标签， 然后更改为背面肖像 导航栏（window.barImage）全部被拉伸（到横向导航栏的大小）

此外，当我删除所有隐藏导航栏的代码时，也会出现同样的问题。

我尝试在方向更改时再次设置 barImage，但这也无济于事。

网站注释：我在导航栏的每个选项卡上都使用相同的图像，这可能是问题吗？

我用绿色标记了导航栏图像，蓝色部分是图像通常应该在的位置。

还请注意，图像的大小适合导航栏的纵向视图。

代码：

var windowWidth = Ti.Platform.displayCaps.platformWidth;

var catWin = Ti.UI.createWindow({
    title:'',
    barImage: 'images/barImage.png',
    url:'vacancies/categories.js',
    width: windowWidth
});

catWin.orientationModes = [
    Titanium.UI.PORTRAIT,
    Titanium.UI.LANDSCAPE_LEFT,
    Titanium.UI.LANDSCAPE_RIGHT
];

Titanium.Gesture.addEventListener('orientationchange', function(e) {
    if(e.orientation == Titanium.UI.LANDSCAPE_RIGHT){
        catWin.hideNavBar();
    } else if(e.orientation == Titanium.UI.LANDSCAPE_LEFT){
        catWin.hideNavBar();
    } else if(e.orientation == Titanium.UI.PORTRAIT){
        catWin.showNavBar();
    }
});

Answer 1

您确实需要发布更多代码，例如我不知道您使用的是Ti.UI.currentWindow.hideNavBar(); 还是仅使用.hide(); 和.show();？

据我所知，问题可能在于宽度。尝试将其设置为 '100%' 而不是使用 platformWidth。再次没有 all 相关代码，例如您的 orientationchange 事件，这是我能给出的最佳建议。希望对您有所帮助。

第三条评论：可能

Titanium.Gesture.addEventListener('orientationchange', function(e) {
    if(e.source.isLandscape()){
        catWin.hideNavBar();
    } else {
        catWin.barImage = 'images/barImage.png';
        catWin.showNavBar();
    }
});

就在某处或选项卡事件中。我会尝试这个想法，看看它是否能让你更进一步？

Answer 2

虽然这不是最好的解决方案，因为它看起来仍然有点奇怪（但比以前好多了），但这是迄今为止最好的解决方案。 我通过使用以下代码找到了某种解决方案：

我已经在 createWindow 代码中设置了 barImage，所以至少在开始时它看起来还可以：

var jbWin = Ti.UI.createWindow({
    title: '',
    url:'homePage.js',
    barImage: 'images/jobbroker_bar.png'
});

然后在orientationchange上我取消设置barImage并开始使用titleImage：

Titanium.Gesture.addEventListener('orientationchange', function(e){
   if(e.source.isLandscape()){
      catWin.titleImage = '';
      catWin.barImage = '';
      catWin.hideNavBar();
   else if( e.orientation != Ti.UI.FACE_UP && e.orientation != Ti.UI.FACE_DOWN ) {
      catWin.titleImage = 'images/jobbroker_bar.png';
      catWin.showNavBar();
   }
}

Answer 3

您是否尝试过使用导航栏上的“titleControl”来设置图像而不是 barImage 控件？

您还可以在某处发布一个带有相关图像的小型apps.js 文件吗？不运行项目很难完全把握问题