Question

将tableView添加到其他项目（图像，字段，文本等）下方的视图中，表格将其他项目推离屏幕。

在下面的示例中，我向视图添加标签，然后向视图添加表格。然后将视图添加到窗口。表格的顶部会将标签推离屏幕顶部。如果我向下滑动，它就在那里。

还有其他人看到吗？我想念什么吗？

Ti.UI.backgroundColor = 'white';
var win = Ti.UI.createWindow({
	layout : 'vertical',
});

var tableData = [{
	title : 'Apples'
}, {
	title : 'Bananas'
}, {
	title : 'Carrots'
}, {
	title : 'Potatoes'
}, {
	title : 'Apples'
}, {
	title : 'Bananas'
}, {
	title : 'Carrots'
}, {
	title : 'Potatoes'
}, {
	title : 'Apples'
}, {
	title : 'Bananas'
}, {
	title : 'Carrots'
}, {
	title : 'Potatoes'
}, {
	title : 'Apples'
}, {
	title : 'Bananas'
}, {
	title : 'Carrots'
}, {
	title : 'Potatoes'
}];

var view = Ti.UI.createScrollView({
	backgroundColor : 'transparent',
	top : 0,
	left : 0,
	width : 'auto',
	height : Titanium.UI.SIZE,
	layout : 'vertical',
	id : 'mainView',
});

var label1 = Ti.UI.createLabel({
	color : 'white',
	text : 'I am label 1',
	font : {
		fontSize : 50,
	},
	top : 0,
});
view.add(label1);

var table = Ti.UI.createTableView({
	data : tableData,
	top : 0
});

view.add(table);
win.add(view);
win.open();

Answer 1

您所看到的是正确的。不要混用滚动视图（表视图会自动滚动）。您看到的是：将标签添加到滚动视图中，然后将表（高度100％）添加到同一滚动视图中。因此，标签高度为+ 100％，并且标签被移到视口之外。

现在，当您滚动时，您将首先移动表格视图，当滚动到最高水平时，您将再次看到标签。

您可以做什么：

将createScrollView更改为普通createView

或

将标签添加为TableViewRow（您可以在每行内部创建自定义布局，使其看起来像标题）

Ti.UI.backgroundColor = 'white';
var win = Ti.UI.createWindow({
    layout: 'vertical',
});

var tableData = [{
    title: 'Apples'
}, {
    title: 'Bananas'
}, {
    title: 'Carrots'
}, {
    title: 'Potatoes'
}, {
    title: 'Apples'
}, {
    title: 'Bananas'
}, {
    title: 'Carrots'
}, {
    title: 'Potatoes'
}, {
    title: 'Apples'
}, {
    title: 'Bananas'
}, {
    title: 'Carrots'
}, {
    title: 'Potatoes'
}, {
    title: 'Apples'
}, {
    title: 'Bananas'
}, {
    title: 'Carrots'
}, {
    title: 'Potatoes'
}];

var view = Ti.UI.createView({
    backgroundColor: 'transparent',
    top: 0,
    left: 0,
    width: 'auto',
    height: Titanium.UI.FILL,
    layout: 'vertical',
    id: 'mainView',
});

var label1 = Ti.UI.createLabel({
    color: 'white',
    text: 'I am label 1',
    font: {
        fontSize: 50,
    },
    top: 0,
    height:Ti.UI.SIZE
});
view.add(label1);

var table = Ti.UI.createTableView({
    data: tableData,
    top: 0
});

view.add(table);
win.add(view);
win.open();

第二个例子

Ti.UI.backgroundColor = '#000';
var win = Ti.UI.createWindow({
    layout: 'vertical',
});



var tableData = [];

function createHeadline(txt) {
    var label1 = Ti.UI.createLabel({
        color: 'white',
        text: txt,
        font: {
            fontSize: 50,
        },
        height: Ti.UI.SIZE
    });
    var r1 = Ti.UI.createTableViewRow({
        height: Ti.UI.SIZE
    });
    var v1 = Ti.UI.createView({
        height: Ti.UI.SIZE,
        width: Ti.UI.FILL,
    });
    v1.add(label1);
    r1.add(v1);
    tableData.push(r1);
}

function createRow(txt) {
    var r1 = Ti.UI.createTableViewRow({
        height: Ti.UI.SIZE
    });
    var v1 = Ti.UI.createView({
        height: 40,
        width: Ti.UI.FILL,
    });
    var label1 = Ti.UI.createLabel({
        color: 'white',
        text: txt,
        font: {
            fontSize: 18,
        },
        height: Ti.UI.SIZE
    });
    v1.add(label1);
    r1.add(v1);
    tableData.push(r1);
}

createHeadline("Label 1");
createRow("text")
createRow("text")
createRow("text")
createRow("text")
createRow("text")
createRow("text")
createHeadline("Label 2");
createRow("text")
createRow("text")
createRow("text")
createRow("text")
createRow("text")

var table = Ti.UI.createTableView({
    data: tableData,
    top: 0
});

win.add(table);
win.open();

表格视图将推至屏幕顶部

1 个答案: