How To Add Subview In iOS Programmatically

When you develop an iOS application, sometimes you may need to create a SubView and add it into the iOS root view object programmatically. This article will just show you an example about how to do it.

1. Add iOS SubView Example.

First, let us look at the example demo video on youtube https://youtu.be/xpnZdYVqCe0. There are two buttons in this example. The first button implement addsubview function, when you click the first button it will add a subview object to the screen. The second button implement removes the subview function,  when you click the second button it will remove the added subview by the first button.

ios-add-sub-view-example

2. Add iOS SubView Code Steps.

  1. Create an instance of UIKit.UIView.
  2. Invoke self.vew.addSubview() method to add the above instance to the main screen.
  3. Call the subview object’s removeFromSuperview() method to remove the child view.

3. Example Code.

Below are the example project files, the only files that we need to edit are the Main.storyboard and ViewController.swift.

3.1 Main.storyboard

Add two buttons in the main storyboard view object. Set button text, and background color to green. You can read iOS Add Click Event To UIButton Swift Example to learn how to add button click event function in the iOS application.

3.2 ViewController.swift

//
//  ViewController.swift
//  AddSubViewByCodeExample
//

import UIKit

class ViewController: UIViewController {

       // Create the subview object.
       private let childView = UIView();

       // When click the second button will invoke this method.
       @IBAction func removeSubView(_ sender: UIButton, forEvent event: UIEvent) {
             // Remove the child view.
             childView.removeFromSuperview();
       }

       // Invoked when click the first button.
       @IBAction func addSubView(_ sender: UIButton, forEvent event: UIEvent) {
             // Add the child view.
             self.view.addSubview(childView);
       }
        
       override func viewDidLoad() {
             super.viewDidLoad()

             // Set child view x y cordinate and size.
             childView.frame = CGRect(x: 80, y: 100, width: 200, height: 100)

             // Set child view background color.
             childView.backgroundColor = UIColor.green
       }
}

Reference

  1. iOS Swift Hello World Example
  2. iOS Add Click Event To UIButton Swift Example
0 0 votes
Article Rating
Subscribe
Notify of
guest

This site uses Akismet to reduce spam. Learn how your comment data is processed.

4 Comments
Newest
Oldest Most Voted
Inline Feedbacks
View all comments
David
David

My iOS app’s top most parent view is a ScrollView, it contains a UIView which is a wrapper view. The wrapper UIView contains a UIButton, UITextView and a UIImageView in vertical layout. And when the button is clicked, it will programatically add a UIView under the ImageView in the wrapper view.

So I add a onclick listener to the UIButton object, when the button is clicked, it invoke the wrapperViewObject.addSubview(targetView) method to add the target view object to the wrapperViewObject, but when I run the app, it shows an error message that is Unable to simultaneously satisfy constraints, how can I fix this? Thanks.

Lane
Lane

I have a parent UIView object in my iOS app, and I want to add a UIButton view object to the parent UIView. But when I run my app, the UIButton can not be shown.

// Below is the UIButton definition.
let btn : UIButton = {
   let retBtn = UIButton()
   …
   …
   return retBtn
}()

// Below is the method that add the above UIButton to the parent UIView object.
 override init(frame: CGRect) {
   super.init(frame: frame)

   addSubview(btn)

}

linda
linda
Reply to  Lane

Does your viewController show any other view object, you can add a label to the parent UIView to make a test. If you are sure the problem is because of the UIButton, you can create and add the UIButton in the ViewController’s viewDidLoad() method.

final class ViewController: UIViewController {

let btn = UIButton()

override func viewDidLoad() {
   
super.viewDidLoad()
   
// Add the button to the parent view object.
view.addSubview(btn)
  }
}

4
0
Would love your thoughts, please comment.x
()
x