Add text under table sections in UITableView - ios

Question

I was trying to mimic a view like the iOS 7 "Shortcut".
I used a UITableViewController with static cells, 1 section and 2 rows. For the text "Create a shortcut that ...", I tried UILabel as well as the section footer. The problem with footer was that I could not figure out a way to wrap the long text to multiple lines. So I am curious about what's the "standard" or preferred way to implement the text under sections? Thanks!

Answer 1

If you select the Table View Section in the storyboard and enter your text in the 'Footer' it will automatically wrap.
If you want more control over the font you can set a custom footer view using -[UITableViewDelegate tableView:viewForFooterInSection:]

Answer 2

The following code replicates what you've shown above. Instead of creating a label and returning it, I created a simple UIView that was some arbitrary hard-coded height (you may want to change that to suit your needs), and then created a label and added the label to the view, returning the view, so that you could center the label in the view as I did when I created the frame. By setting the number of lines to 0 you are effectively telling the label there will be multiple lines, and I set an autoresizing mask on the label so that if the view rotates the text will still remain centered in the view with 10 points padding on either side. You'll also want to make sure you are returning the appropriate heightForFooterInSection in case you decide to add something below it later it won't be overlapping your footer.
- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section {
UIView *footerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 80)];
UILabel *explanationLabel = [[UILabel alloc] initWithFrame:CGRectMake(10, 0, self.view.frame.size.width - 20, 80)];
explanationLabel.textColor = [UIColor darkGrayColor];
explanationLabel.numberOfLines = 0;
explanationLabel.autoresizingMask = UIViewAutoresizingFlexibleWidth;
explanationLabel.text = #"Create a shortcut that will automatically expand into the word or phrase as you type.";
[footerView addSubview:explanationLabel];
return footerView;
}
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section {
return 80;
}
Gave me this:

Answer 3

SWIFT 4 Version
func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
let footerView = UIView(frame: CGRect(x: 0, y: 0, width: view.frame.size.width, height: 80))
let explanationLabel = UILabel(frame: CGRect(x: 10, y: 0, width: view.frame.size.width - 20, height: 80))
explanationLabel.textColor = UIColor.darkGray
explanationLabel.numberOfLines = 0
explanationLabel.text = tableDataSectionFooters[section]
footerView.addSubview(explanationLabel as? UIView ?? UIView())
return footerView
}
func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
return 80
}

Answer 4

Use UILabel in the footer and set it to wrap lines (number of lines = 0)

Answer 5

all other answers are right in using the UILabel, but to achieve the 100% identical effect you must use the attributedText property of the label. Than you can also add the indention showed in the original shortcut screenshot.