Question

我正在尝试向左右navButton添加自定义按钮，但如果我设置了backgroundImage，则会出现间隔符。如果仅设置标题文本，则间距正确。这是我重现问题的例子，我添加了一个borderColor来显示图像不是罪魁祸首。

var win = Ti.UI.createWindow({
    width: '100%',
    height: '100%',
    backgroundColor: 'white'
});
var leftBtn = Ti.UI.createButton({
    backgroundImage:"/images/headerCmdMenu.png",
    width: '81px',
    height:'74px',
    title: 'left',
    borderColor: 'red',
    borderWidth: 1
});
var rightBtn = Ti.UI.createButton({
    width: '81px',
    height:'74px',
    title: 'right'
});
win.leftNavButton = leftBtn;
win.rightNavButton = rightBtn;
var nc =  Ti.UI.iOS.createNavigationWindow({
    window : win
});
nc.open();

以下是视图的截图...

http://imagebin.ca/v/13wq8Jrn1hst

任何想法如何解决这个问题？谢谢。克里斯

注意：我确实在官方论坛上提出这个问题，但14天后没有得到答复。 http://developer.appcelerator.com/question/160022/leftnavbutton-and-rightnavbutton-spacer-appears-if-using-backgroundimage-#comment-196608

Answer 1

这回答很长，但它可能仍然可以帮助其他人寻找同样的问题。

对于左/右导航按钮中的图像，请先查找以下几点：

如果您只设置了标题，那么它将按预期工作。
如果您只设置backgroundImage（未设置宽度和高度），则图片将被拉伸以占据整个空间。
如果你只设置一些宽度和背景的backgroundImage。高度，然后按钮将表现为具有预期间距和面积的普通按钮。
如果同时设置backgroundImage＆amp;标题，那就是这篇文章的情况。
另外请记住，当打算用作左/右导航按钮时，始终使用正确尺寸的图像文件。

appcelerator钛金属应用程序左右导航按钮有额外的空间？

1 个答案: