如何在Xcode中创build多个列的UI TableView?

我正在使用Xcode处理iOS 8应用程序。 我需要在一个视图中显示包含许多列和数据行的表。

例:

Name Time In Time Out ETA Johnnys Supplies 8:30AM 9:00AM 10:15AM Franks Company 8:45AM 9:05AM 9:45AM Another Inc. 10:12AM 11:00AM 12:04PM 

所有的数据将被读入JSON / PHP。

我需要它像一个用户可以垂直滚动的tableview,并select一个索引。 一旦选定该索引,用户可以单击一个button,根据所选单元格中的数据(等)运行其他查询。

什么是最简单的方法来实现呢? 必须有一种方式xcode允许你做到这一点原生? 我错过了什么吗?

所有的编码例子欢迎!

我发现了两个select,但都需要许可费:

http://www.ioscomponents.com/Home/IOSDataGrid < – $ 400

http://www.binpress.com/app/ios-data-grid-table-view/586 < – $ 130

任何人都熟悉这些组件?

iOS表格视图始终是单列。 在Mac OS上,您可以直接创build自己的内容。

也就是说,您可以创build自定义表格视图单元格来显示所需的内容。 事实上,这将是很容易的。 你所要做的就是对UITableViewCell进行子类化,并为每个列定义视图(可能是UILabels),然后将它们作为单元中的出口属性进行连接。 然后钻取您的表格视图,为您使用的单元格标识符注册该单元格类别。

然后编写您的cellForRowAtIndexPath方法,将数据安装到不同的出口属性中。

你也可以使用UICollectionView,但是在我看来,像自定义单元格的表格视图更适合这个应用程序。

两列和两个标签之间有什么区别? 一个分隔符?

在这里输入图像说明

这是一个多列表视图?

因为这是一个普通的UITableViewCell ,它有3个UILabels和2个UIViews 。 观点假装是1分宽的分隔符。

代码应该是自我解释的。

。H

 @interface MultiColumnTableViewCell : UITableViewCell @property (strong, nonatomic) UILabel *label1; @property (strong, nonatomic) UILabel *label2; @property (strong, nonatomic) UILabel *label3; @end 

.M

 @interface MultiColumnTableViewCell () @property (strong, nonatomic) UIView *divider1; @property (strong, nonatomic) UIView *divider2; @end @implementation MultiColumnTableViewCell - (UILabel *)label { UILabel *label = [[UILabel alloc] init]; label.translatesAutoresizingMaskIntoConstraints = NO; [self.contentView addSubview:label]; return label; } - (UIView *)divider { UIView *view = [[UIView alloc] init]; view.translatesAutoresizingMaskIntoConstraints = NO; [view addConstraint:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:1 constant:1.0/[[UIScreen mainScreen] scale]]]; view.backgroundColor = [UIColor lightGrayColor]; [self.contentView addSubview:view]; return view; } - (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier { self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]; self.separatorInset = UIEdgeInsetsZero; self.layoutMargins = UIEdgeInsetsZero; self.preservesSuperviewLayoutMargins = NO; self.divider1 = [self divider]; self.divider2 = [self divider]; self.label1 = [self label]; self.label2 = [self label]; self.label3 = [self label]; NSDictionary *views = NSDictionaryOfVariableBindings(_label1, _label2, _label3, _divider1, _divider2); NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-5-[_label1]-2-[_divider1]-2-[_label2(==_label1)]-2-[_divider2]-2-[_label3(==_label1)]-5-|" options:NSLayoutFormatAlignAllCenterY metrics:nil views:views]; [self.contentView addConstraints:constraints]; NSArray *horizontalConstraints1 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|[_divider1]|" options:0 metrics:nil views:views]; [self.contentView addConstraints:horizontalConstraints1]; NSArray *horizontalConstraints2 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|[_divider2]|" options:0 metrics:nil views:views]; [self.contentView addConstraints:horizontalConstraints2]; return self; } @end 

TableViewController:

 @implementation MasterViewController - (void)viewDidLoad { [super viewDidLoad]; [self.tableView registerClass:[MultiColumnTableViewCell class] forCellReuseIdentifier:@"Cell"]; self.tableView.separatorColor = [UIColor lightGrayColor]; } - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { return 10; } - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { MultiColumnTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Cell" forIndexPath:indexPath]; cell.label1.text = [NSString stringWithFormat:@"Name %ld", (long)indexPath.row]; cell.label2.text = [NSString stringWithFormat:@"Start %ld", (long)indexPath.row]; cell.label3.text = [NSString stringWithFormat:@"End %ld", (long)indexPath.row]; return cell; } @end 

使用UICollectionView,检查Apple WWDC 2012会话

  • 引入集合视图
  • 高级集合视图和构build自定义布局

https://developer.apple.com/videos/wwdc/2012/