垂直布局的差距 - 钛

时间:2014-08-26 15:09:31

标签: javascript titanium titanium-mobile

我在滚动视图中有两个使用垂直布局属性放置的视图。我尝试了很多种组合但总是在两种观点之间存在巨大差距。

screenshot of gap in layout

var view = Titanium.UI.createScrollView({
    top:0,
    width:Ti.UI.width,
    layout:'vertical'
});
contentWin.add(view);

var floor1view = Titanium.UI.createView({
    layout: 'horizontal'
});
view.add(floor1view);
var floor1viewlower = Titanium.UI.createView({
    top: 0,
    layout: 'horizontal'
});
view.add(floor1viewlower);

然后我可以毫无问题地将对象添加到楼层视图中。

1 个答案:

答案 0 :(得分:0)

布局适用于父视图,不适用于儿童。

Appcelerator Documentation说:

<强>垂直即可。儿童从上到下垂直布置。第一个孩子从其父母的边界框中排列出顶级单位。每个后续的孩子都被安排在前一个孩子的下面。儿童之间的空间等于孩子的最低值加上孩子的最低值。 每个子项都与复合布局模式一样水平放置。

<强>水平即可。水平布局具有不同的行为,具体取决于是否启用了换行。默认情况下启用环绕(horizo​​ntalWrap属性为true)。垂直布局根据顶部和底部确定子项的位置。对于包装行为,子项从左到右水平排列成行。如果子项需要的水平空间大于当前行中存在的水平空间,则会将其包装到新行。每行的高度等于该行中子项的最大高度。

因此,您应该使用水平和设置子宽度到父宽度以移除间隙。

var view = Titanium.UI.createScrollView({
    top: 0,
    left: 0,
    height: contentWin.height,
    width: contentWin.width,
    layout: 'horizontal'
});
contentWin.add(view);

var floor1view = Titanium.UI.createView({
    width: view.width,
    height: 50,
    backgroundColor: '#00FF00'
});
view.add(floor1view);

var floor1viewlower = Titanium.UI.createView({
    width: view.width,
    height: 100,
    backgroundColor: '#FF0000'
});
view.add(floor1viewlower);

差距应该是孩子的身高。它适用于iOS 7.1,Titanium SDK 3.3.0GA,OSX 10.9.4