CODEWITHSUNDEEP
objective-cuitableview
James D
James D

Reputation: 1

How to Place Text in three columns of Tableview

I have a tableview where I add a text string (of three NSStrings).

Because the three text strings are of similar length, I was wondering if there was a simple way to do this with a simple stringWithFormat

[NSString stringWithFormat:@"%@ %@ %@" , hours, days, months];

I've tried \t but that is not the best and wonder how it would work on different platforms. I I have alreay made the font smaller for iPhones.

Want

3       5       1 
12      6       7 
2       30      12

Upvotes: 0

Views: 132

Answers (2)

koen
koen

Reputation: 5729

I'd use a UIStackView inside each cell.

self.data = @[@[@"3", @"5", @"1"], @[@"12", @"6", @"7"], @[@"2", @"30", @"12"]];

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier: @"test" forIndexPath:indexPath];
    
    UILabel *label1 = [UILabel new];
    label1.text = self.data[indexPath.row][0];
    label1.textAlignment = NSTextAlignmentCenter;
    
    UILabel *label2 = [UILabel new];
    label2.text = self.data[indexPath.row][1];
    label2.textAlignment = NSTextAlignmentCenter;

    UILabel *label3 = [UILabel new];
    label3.text = self.data[indexPath.row][2];
    label3.textAlignment = NSTextAlignmentCenter;

    UIStackView *stackView = [[UIStackView alloc] initWithArrangedSubviews: @[label1, label2, label3]];
    stackView.tag = 1;
    
    stackView.axis = UILayoutConstraintAxisHorizontal;
    stackView.distribution = UIStackViewDistributionFillEqually;
    
    UIView *sub = [cell.contentView viewWithTag: 1];
    
    if (sub != nil ) {
        [sub removeFromSuperview];
    }
    
    [cell.contentView addSubview: stackView];
    
    stackView.translatesAutoresizingMaskIntoConstraints = NO;
    
    [stackView.centerYAnchor constraintEqualToAnchor: cell.contentView.centerYAnchor].active = YES;
    [stackView.leadingAnchor constraintEqualToAnchor: cell.contentView.leadingAnchor constant: 10].active = YES;
    [stackView.trailingAnchor constraintEqualToAnchor: cell.contentView.trailingAnchor constant: -10].active = YES;

    return cell;
}

EDIT: Added a tag to the stack view to prevent cells that are reused to have more than one stack view.

result:

enter image description here

Upvotes: 1

Ol Sen
Ol Sen

Reputation: 3368

Columns don't need to be UI Elements. This can be solved with attributed Strings since iOS 7.0

NSArray *tabs = @[
    [[NSTextTab alloc] initWithTextAlignment:NSTextAlignmentLeft location:72.0 options:@{}],
    [[NSTextTab alloc] initWithTextAlignment:NSTextAlignmentLeft location:144.0 options:@{}]
];
    
NSMutableParagraphStyle *style = [[NSParagraphStyle defaultParagraphStyle] mutableCopy];
style.defaultTabInterval = 72.0;
style.tabStops = tabs;
    
NSDictionary *attr = @{ NSFontAttributeName:[UIFont systemFontOfSize:18.0], NSParagraphStyleAttributeName:style };
    
NSString *hh = @"2";
NSString *dd = @"30";
NSString *mm = @"12";
NSAttributedString *tabbedString = [[NSAttributedString alloc] initWithString:[NSString stringWithFormat:@"%@\t%@\t%@", hh, dd, mm] attributes:attr];

but be aware of that tabstops can shift the strings layout when the space between them is not anouth to show the partly string in its fontsize.

Upvotes: 0

Related Questions