tobhae_dev
tobhae_dev

Reputation: 364

How to resize an custom UIView from NIB inside of a UITableViewCell with Swift?

I want to load a custom view to a static UITableViewCell and resize the view to the horizontal bounds of the UITableViewCell.

I achieved the loading, but I stuck with the resizing. Maybe some genius will help me :)

For this problem, I created a sample project, which can be checked out here: GitHub Repository of project

Here are the steps that I did:

UITableView:

  1. Created a Single View App

  2. In StoryBoard deleted the View and dragged a TableViewController (TVC) to the Storyboard. Embedded it in an UINavigationController.

  3. Created a class "MasterTableViewController" (MTVC) as subclass of UITableViewController.
  4. Connected TVC with the MTVC at the identity inspector.
  5. Set the UITableView Content to "Static Cells" at the Attributes Inspector
  6. The UITableView has two sections, each with a row. The first section and row can be ignored. The second section and row is the place where the uiview from nib will be loaded.
  7. I created a Outlet from the UITableViewCell where the view will be loaded.

UIView:

  1. I created a custom view as a nib FirstDetailView.xib(FDV) with the InterfaceBuilder.
  2. Added some Labels and Textfields. Set suggested constraints.
  3. Then I created a subclass from UIView FirstDetailView.swift connected it at the Identity Inspector with the FDV at the nib. At this point there only IBOutlet for the TextFields.

Loading:

  1. The following code shows the MTVC with the code to load the view to the UITableViewCell:

import UIKit

class MasterTableViewController: UITableViewController {

@IBOutlet weak var detailCell: UITableViewCell!

override func viewDidLoad() {
    super.viewDidLoad()

    // loading customized tableViewCell
    let nib = UINib(nibName: "FirstDetailView", bundle: nil)
    let nibs = nib.instantiateWithOwner(self, options:nil)
    let firstDetailView = nibs.first as? FirstDetailView
    if let firstView = firstDetailView {
        detailCell.contentView.addSubview(firstView)
    }
}

When I hit Play. The view will be loaded to the UITableViewCell. But the textfields go over the view bounds. What do I have to do, to fix the UIView bounds? (The vertical size of the row is not the problem. Sorry but I cant post images due to few reputations. Please see the sample project at github)

UPDATE or new Question If I write content in the textfields. How can I access them or get the content from the tableViews ViewController?

Upvotes: 1

Views: 1917

Answers (1)

gabbler
gabbler

Reputation: 13766

A view is loaded from a nib and added to the cell's contentView, you should add constraints to it to make it position properly inside the cell. Try again with the following code.

// do not translate autoresizingMask to constraints, create our own
firstView.setTranslatesAutoresizingMaskIntoConstraints(false)
detailCell.contentView.addSubview(firstView)

// pin firstView edges to its superview
let constraint1 = NSLayoutConstraint(item: firstView, attribute: .Right, relatedBy: .Equal, toItem: detailCell.contentView, attribute: .Right, multiplier: 1, constant: 0)
let constraint2 = NSLayoutConstraint(item: firstView, attribute: .Bottom, relatedBy: .Equal, toItem: detailCell.contentView, attribute: .Bottom, multiplier: 1, constant: 0)
let constraint3 = NSLayoutConstraint(item: firstView, attribute: .Left, relatedBy: .Equal, toItem: detailCell.contentView, attribute: .Left, multiplier: 1, constant: 0)
let constraint4 = NSLayoutConstraint(item: firstView, attribute: .Top, relatedBy: .Equal, toItem: detailCell.contentView, attribute: .Top, multiplier: 1, constant: 0)

detailCell.contentView.addConstraints([constraint1,constraint2,constraint3,constraint4])

Upvotes: 1

Related Questions