1

我有一个使用的窗口，layout: 'horizontal'当我添加子视图时，每个都使用width: '50%'，这很棒，它们都像一个 2 列表一样填充。

但是，我意识到我需要滚动内容，所以我在窗口中添加了一个滚动视图，并将我的子视图添加到滚动视图中 - 但它不起作用。当我layout: 'horizontal'在滚动视图上使用时，它会尝试使内容水平滚动 - 所有子视图都在一行上（在 UI 上只看到前 2 个）。如果我将其更改为layout: 'vertical'，它会正确滚动，但视图以 1 列格式布局（一个在另一个之上）

var deals_window = Titanium.UI.createWindow({
    title: 'Deals',
    layout: 'horizontal'
  });

  var scrollView = Ti.UI.createScrollView({
    showVerticalScrollIndicator: true,
    layout: 'horizontal',
    scrollType: 'vertical',
    contentWidth: '100%',
    contentHeight: 'auto',
    width: '100%',
    height: 'auto'

  });
  deals_window.add(scrollView);

如何让 scrollView 在垂直滚动时使用“水平”布局行为......？

4

2 回答 2

0

不要使用水平布局。尝试这个：

var scrollView = Ti.UI.createScrollView({
   layout: 'vertical',
   height: Ti.UI.FILL
});

var row = Ti.UI.createView({
   height: Ti.UI.SIZE
});

var view1 = Ti.UI.createView({
    width: "50%",
    left: 0
});

var view2 = Ti.UI.createView({
    width: "50%",
    right: 0
});

row.add(view1);
row.add(view2);

scrollView.add(row);
于 2013-04-10T09:13:57.697 回答
0

尝试使用 scrollView 的属性 Horizo​​ntalWrap:true。它可以帮助你！

这是代码：

//window
var win = Ti.UI.createWindow({
    width: '100%',
    height: '100%',
    backgroundColor: 'white'
});
//scrollView
var scrollView = Ti.UI.createScrollView({}i
    top: 0,
    width: '100%',
    height: '100%',
    contentWidth: '100%',
    layout: 'horizontal',
    horizontalWrap: true,
    scrollType: 'vertical'
);
win.add(scrollView);
//item in scrollView
for(var i = 0; i < 8; i++){
    var itemLabel = Ti.UI.createLabel({
        font:{
            fontSize: '18'
        },
        left: '2.5%',
        width: '30%',
        color: 'black',
        height: '90'
        borderRadius: 5,
        textAlign: 'center',
        text: 'item '+(i+1),
        backgroundColor: 'red',
        verticalAlign: Ti.UI.TEXT_VERTICAL_ALIGNMENT_CENTER
    });
    scrollView.add(itemLabel);
}

好吧，这种方式确实有效，但是，scrollView有一个问题，当它可以滚动时，最后一行的部分将被覆盖。所以，我不建议你用这种方式来解决你的问题。您可以尝试更多更好的UI 组件，例如TableView或ListView，对于TableView只需在TableViewRow中放入您想要的任意数量的项目，对于ListView只需定义一个ItemTemplate，其中包含您想要的几个项目。如果您需要更多详细信息，请给我写电子邮件：frankjorsn@gmail.com

于 2015-08-07T02:13:17.097 回答