CODEWITHSUNDEEP
iosxcodeibactioniboutlet
Suragch
Suragch

Reputation: 511538

How to connect an IBOutlet and IBAction to a View Controller without using the Assistant editor

I know the second button here shows the Assistant editor:

enter image description here

And I know how to make an Outlet and Action by Control dragging from an object in the Interface Builder to the View Controller code. Ideally it should be as easy as the documentation makes it look:

enter image description here

But this is usually what Xcode actually looks like for me when I press the "Assistant" editor:

enter image description here

A mess. I have to minimize lots of things, try to get the storyboard object in view, and then go find the right View Controller. All this before I can do the Control-drag.

Is there a way to make the connection without using the Assistant editor? (And preferably without having to type a lot of code in myself.)

Upvotes: 10

Views: 5620

Answers (2)

Suragch
Suragch

Reputation: 511538

Yes, you can do it without the Assistant editor and without writing lots of code. It requires learning to do two things:

  1. Use code snippets
  2. Use the Connections inspector

Create code snippets for the IBOutlet and IBAction

Normally when you create an IBOutlet and IBAction with the Assistant editor it automatically adds code like this to your View Controller:

@IBOutlet weak var myOutletName: UIButton!

@IBAction func myActionName(sender: AnyObject) {
}

You could type this all yourself and then add the connection in the Connection inspector, but why do all that typing? Just make a code snippet that will autocomplete. Drag the code to the Code Snippets library in the Utility panel.

enter image description here

Give it a title and most importantly, a Completion Shortcut. I called mine "ibaction" for the @IBAction code.

enter image description here

Now all I have to do is start typing "ibaction" and I can autocomplete the code snippet. I only have to edit the name of the action. It is a similar process for the Outlet.

Read more about creating code snippets:

Now all you have to do is connect the IB object to the code.

Make the connection with the Connections inspector

First, click the object in the storyboard that you want to connect. For me, I am using a Button.

Then select the Connections inspector. It is on the far right.

enter image description here

Alternatively, you can right click or control click the object to get a menu.

enter image description here

Then click the New Referencing Outlet to connect it to your Outlet or the Touch Up Inside under Sent Events to connect it to your Action.

enter image description here

For whatever reason I find that sometimes I need to drag just a little bit after clicking the "+" button to get the menu of available connections to show up.

Upvotes: 6

noobsmcgoobs
noobsmcgoobs

Reputation: 2746

Don't press the assistant editor button. Sometimes it opens a random file instead of the one you want.

When you are in Storyboard, Option click on the .h file that you want to open in the Project Navigator. This will open the proper .h file to add the outlets or actions.

When you're done, close the Assistant editor right pane (which is displaying the .h file) and you will be back in Storyboard.

Upvotes: 10

Related Questions