CODEWITHSUNDEEP
iosswift
M A Russel
M A Russel

Reputation: 1557

My ViewController is getting really big due to UI coding

Currently I am working on a project which got all the task done in a singe viewController. As there are so many elements on the viewController I choose to do the UI with coding, like this: 

  let myButton: UIButton = {
    let button = UIButton(type: .system)
    button.addTarget(self, action: #selector(openFunction), for: .touchUpInside)
    button.translatesAutoresizingMaskIntoConstraints = false
    return button
}()

As there are so many button, view, texifield, label etc along with all their constraints written with code, my viewController class getting bigger and bigger. How can I keep all the UI code in separate file and integrate in on my viewController ? I don't know there might be really easy way to do that but I am actually struggling. Any suggestion would be really helpful.

Upvotes: 0

Views: 91

Answers (3)

user7014451
user7014451

Reputation:

A specific answer to your specific code would be to create a convenience initializer in an extension to UIButton.

extension UIButton {
    convenience init(_ target:Any, _ action:Selector) {
        self.init(CGRect.zero)
        self.addTarget(target, action:action)
        self.translatesAutoresizingMaskIntoConstraints = false
    }
}

Right there you are probably cutting back on things in your VC.

Next, consider moving this - and all - UI code out of your VC file and into other files. I typically move my extensions/subclasses into as many files as needed. (The build may take longer but the final binary should be the same size.) For large projects, this helps make things manageable.

At the same time consider making an extension to your VC specifically for auto layout (which I see you are using because you are setting your UIButton auto resizing mask). As long as you are declaring your objects in the main subclassed VC, this removes the "verbose" nature of auto layout into it's own file.

For multi-developer projects and/or true "reusable" code, a final thing you can do is move code into a Framework target.

Upvotes: 0

Martin Muldoon
Martin Muldoon

Reputation: 3438

An alternative to what carbonr has proposed is to leverage Interface Builder. With Interface Builder, you can create one or more StoryBoards and separate UI elements and constraints from the controller that contains your code. Obviously, if you are unfamiliar with Interface Builder there would be a learning curve.

Upvotes: 1

carbonr
carbonr

Reputation: 6067

Welcome to the world of design patterns and code architecture. They are various ways to accomplish what you are after. It's a good sign you are able to identify this problem early.

You can start looks at MVVM, VIPER, ReSwift among others. Research which fits your the requirements of your app.

Suggestions for Reducing UI Code in view controller:

In terms of reducing just the UI Code growing in the view controller, I suggest start creating subclasses of common elements and keey your code DRY. For instance, if a UIButton with same fonts and borders etc are being created many times then look at creating a subclass for it and move the configurations inside this subclass.

You can also create subview of logical elements on the screen, example you have a header with buttons and labels then move it into a subclass and start using this subclass from here on. This should improve your code readability and reuse.

You can also reduce a lot of the autlayout code by create extensions of commons layouts like pinning to all corners etc this way the repetition of boilerplate auto layout code is much less.

Upvotes: 1

Related Questions