TableView 中的多行标签

发布于 2024-11-06 14:44:52 字数 111 浏览 1 评论 0原文

如何在我的表格视图中添加多行标签，例如此屏幕中的标签（多任务手势下方的标签）： http://cl.ly/6g0B

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

别忘他 2024-11-13 14:44:52

您需要对 tableview 进行分组（至少在针对 iOS 设备时）。然后，您创建一个表视图部分来包含您的行，并且您的多行标签将通过其 headerView 属性添加到该部分。

在此处查看 TableViewSection 视图的文档： http://developer .appcelerator.com/apidoc/mobile/latest/Titanium.UI.TableViewSection-object

一个简短的示例 - 未经测试抱歉，我目前没有 Mac，但原则是合理的。您创建一个标题视图，创建一个部分，设置部分标题视图，向该部分添加一些单元格，并为您的表提供一个部分数组：

var tableView = Ti.UI.createTableView({
   style: Ti.UI.iPhone.TableViewStyle.GROUPED
});
var tableData = [];

var multiLineLabelView = Ti.UI.createView();
var line1 = Ti.UI.createLabel({
     text: 'Some text'
});
var line2 = Ti.UI.createLabel({
     text: 'More text',
     top: 20
});
multiLineLabelView.add(line1);
multiLineLabelView.add(line2);

var section = Ti.UI.createTableViewSection({
    headerView: multiLineLabelView,
    height: 40
});

var row1 = Ti.UI.createTableViewRow({
    title: 'Row 1'
});

var row2 = Ti.UI.createTableViewRow({
    title: 'Row 2'
});

section.add(row1);
section.add(row2);

tableData.push(section);
tableView.data = tableData;

需要注意的重要一点是，您只需要一个表 - 在示例中您给出的，行被分组为部分，其中一些具有标题。

You need to make your tableview grouped (when targetting an iOS device, at least). Then, you create a table view section to contain your rows, and your multi-line label is added to the section through its headerView property.

Check out the documentation for the TableViewSection view here: http://developer.appcelerator.com/apidoc/mobile/latest/Titanium.UI.TableViewSection-object

A brief example - it's untested sorry, I don't have a Mac around at the moment, but the principle is sound. You create a your header view, create a section, set the section header view, add some cells to the section, and give your table an array of sections:

var tableView = Ti.UI.createTableView({
   style: Ti.UI.iPhone.TableViewStyle.GROUPED
});
var tableData = [];

var multiLineLabelView = Ti.UI.createView();
var line1 = Ti.UI.createLabel({
     text: 'Some text'
});
var line2 = Ti.UI.createLabel({
     text: 'More text',
     top: 20
});
multiLineLabelView.add(line1);
multiLineLabelView.add(line2);

var section = Ti.UI.createTableViewSection({
    headerView: multiLineLabelView,
    height: 40
});

var row1 = Ti.UI.createTableViewRow({
    title: 'Row 1'
});

var row2 = Ti.UI.createTableViewRow({
    title: 'Row 2'
});

section.add(row1);
section.add(row2);

tableData.push(section);
tableView.data = tableData;

The important thing to note is that you only need a single table - in the example you gave, rows are instead grouped into sections, some of which have headers.

回复收藏 0 原文

林空鹿饮溪 2024-11-13 14:44:52

这实际上是通过创建一个 headerView 来完成的（至少在 Titanium 中）。

headerLabel = Ti.UI.createLabel({
    text: 'line 1'
});

headerView = Ti.UI.createView({
    height: 60
});

headerSection = Ti.UI.createTableViewSection();

headerView.add(headerLabel);
headerSection.add(headerView);
tableView.add(headerSection);

您可以向视图添加更多标签，并设置高度进行相应调整。您还需要使用data 填充您的headerSection。

That's actually done (in Titanium at least) by creating a headerView.

headerLabel = Ti.UI.createLabel({
    text: 'line 1'
});

headerView = Ti.UI.createView({
    height: 60
});

headerSection = Ti.UI.createTableViewSection();

headerView.add(headerLabel);
headerSection.add(headerView);
tableView.add(headerSection);

You could add more labels to the view and set the height to adjust accordingly. You will also need to populate your headerSection with data.

回复收藏 0 原文

~没有更多了~