Chapter 7 FAIL

Whilst working through the book Learn Cocoa on the Mac, I hit a stumbling block when I hit Chapter 7 – Core Data Basics. The reason that I stumbled was that the book is written for XCode 3, but I was using XCode 4 and, although everything had been fine up to this point, I found that Apple had decided to remove a huge piece of functionality from XCode 4: Core Data Entity Interface Assistant.

This excellent tool allows you drag an entity from the Data Model editor and drop it into Interface Builder to automatically generate you a database GUI. Yey! But now it’s gone. Boo!

Yes, Apple, for whatever reason, have decided to pull the plug on this wonderful piece of magic. Will it be coming back? Who knows. Does the XCode 3 to XCode 4 Transition Guide point you in the right direction? It’s as if this functionality never existed.

Anyway, how do you move forward? After finding virtually nothing via Google (other than “unlucky, Apple have shafted you,” I decided to go it alone. Using the knowledge I gained from the previous Chapters and a bit of common sense, I was able to work most of it out. However, to get every bell and whistle working, I decided to fire up XCode 3 on a different machine, go through the motions in the chapter, and start pulling apart what the assistant generated.

After achieving my goal, I decided to write this guide. If you also have hit this same problem, then read the text below and you should be on track to get through chapter 7.

I had two thoughts on where this guide should get you to; to the point where the assistant gets you or to the point where the book corrects stuff that the assistant generates incorrectly. I decided to go for the second option. Why? Well what’s the point of the first option? You’ll build an interface and then change half of it. You don’t need to reproduce what XCode 3 creates because you’re using XCode 4.

So, once you’ve completed this guide you should be able to pick up from the section entitled Exploring the Template Code. However, you should still read the Creating MythBase section, as it does explain how a lot of stuff works, which you’ll need to understand when using Core Data.

So, here goes…

The Data Model

Before using this guide, please ensure that you have created your Data Model, which should include an entity named MythicalPerson with the attributes name, details, depiction, power, divinity and goodness. Refer to chapter 7 of the book on how to do this before commencing.

Build The UI

The first thing to do is build the user interface in Interface Builder. First, as stated in chapter 7 of the book, set the size of your main window to 500 x 600. Next, drag out a Box from the object library, stretch it to the blue dotted margins, and set the title to ‘Mythical Person’.

Next, drag out a Search Field from the library and position it in the top right corner of the box. Stretch it until it is about a third the width of the box.

Now drag a Table View out of the library, position it under the search field and stretch it to the left and right margins of the box. You don’t need to change the height. Once it’s positioned correctly, click it until the inner table view is selected and use the Attributes Inspector to set the number of columns to 5. After making this change, you’ll only see 2 columns, so select the Table Header View and shrink the second column so that you can see the other three. Double click each column header, from left to right, and set the titles to Name, Power, Divinity, Goodness and Depiction. Shrink the last four columns so that the titles just fit and then expand the Name column to use up all the remaining space.

Drag out a label and position it under the bottom left corner of the Table View. Set the title to ‘# out of #’. Stretch the width so that it’s about a quarter of the size of the surrounding box.

Next, drag out three buttons and place them in a row under the right corner of the table view. Entitle them, from left to right, ‘Fetch’, ‘Remove’ and ‘Add’.

Drag out a text box and position it under the buttons. Make it just wider than half the size of surrounding box.

Then, drag out a label and align it just to the left of the text box. Stretch the left sizing handle until it touches the left blue margin of the surrounding box. Use the Attributes Inspector to set the Title to ‘Name:’ and the Alignment to right justified.

Now, drag out a label and place it under the bottom right of the text field. Use the Attributes Inspector to set the Alignment to right justified and the Title to ’100′. Then, using the left sizing handle, shrink the label so that the ’100′ just fits.

Drag out a slider and align it to the left of the ’100′ label. Grab the slider’s left sizing handle and stretch it until it’s aligned with the left edge of the text box. In the Attributes Inspector, set the minimum, maximum and current values to 0, 100 and 50, respectively. Also, set the State to Continuous.

Select the ‘Name’ label and duplicate it by pressing CMD+D. Align the duplicated label directly under the ‘Name’ label and to the left of the slider. Change the Title to ‘Power:’.

We now need to duplicate the last three controls twice, once for Divinity and once for Goodness. The best way to do this is to select all three by first selecting the ‘Power:’ label and then CMD+Clicking the slider, followed by the ’100′ label. Once all three are selected, press CMD+D to duplicate them and then position the duplicates under the original. Repeat this and, once you have your three sliders, change the ‘Power:’ labels on the two duplicates to ‘Divinity:’ and ‘Goodness:’. Your window should now look something like this:

Now drag out another label and place it to the bottom left of the last slider. Set the Title to ‘Details:’. Drag out another label an place it against the left margin of the box, vertically aligned with the ‘Details:’ label. Set the Title to ‘Depiction’.

Next, drag out a TextView and place it under the ‘Details:’ label. Resize the TextView so that the top-left corner is under the bottom-left corner of the ‘Details:’ label and the bottom-right corner touches the right and bottom margins of the box. Once positioned, select the TextView (you’ll need to click within the top half of the TextView to select the actual TextView and not the ScrollView) and un-tick the Rich Text box within the Attributes Inspector.

Now, drag out an Image Well and place it under the ‘Depiction:’ label. The top-left should be aligned with the left box margin, just under the label. The bottom-right should be snapped to the box’s bottom margin and just to the left of the TextView. In the Attributes Inspector, tick the editable box.

All the numeric values (slider value labels and associated columns) and the Depiction column of the Table View are currently set to display text values, so we need to change these so that they display the correct data types. So, for each of the slider values, drag out a Number Formatter from the library and drop it onto the slider label (entitled ’100′). This will configure each slider label to display an integer instead of a crazy floating point number. Repeat this for each of the numeric table columns, Power, Divinity and Goodness. For the Depiction column, drag out an Image Cell and drop it onto the column.

One last thing for the Table View, select it and tick the ‘Multiple’ tick-box under Selection within the Attributes Inspector.

You’ve now completed the GUI and it should look something like this:

Bind it!

Now it’s time make the bindings!

First, you’ll need an Array Controller. Drag one out of the library and drop it into the Objects section of your nib.

Change the name of your Array Controller to Mythical Person Array Controller. Then, with the Array Controller selected, select the Attributes Inspector, change the Mode within the Object Controller from Class to Entity Name and set the Entity Name to ‘MythicalPerson’. This fuses your Array Controller with the MythicalPerson entity that you created in the model editor.

Next, select the Bindings Inspector, expand Managed Object Context in the Parameters section and select Myth Base App Delegate from the ‘Bind to’ pulldown. Tick ‘Bind to’ and enter managedObjectContext into the Model Key Path. This binds your Array Controller to the managedObjectContext instance variable of your Application Delegate class, allowing data to flow between your Array Controller and your Applications Delegate’s data store which, by default, is just a file on your hard disk (don’t worry, the book will elaborate on this later.)

Now you can bind all your controls to your [Mythical Person] Entity via the Array Controller. Start with the Name text box; select it and open the Bindings Inspector. In the Inspector, expand Value and select Mythical Person Array Controller in the pulldown. Tick ‘Bind to:’ and enter ‘name’ into the Model Key Path. The Controller Key field should be set to ‘selection’.

Do the same for the Power slider, but set the Model Key Path to ‘power’. Do exactly the same for the Power value label (the one that’s title is ’100′). Repeat these two actions for the Divinity and Goodness sliders and value labels, setting the Model Key Path values to ‘divinity’ and ‘goodness’ respectively.

Now do the same for the details Text View, but remember you may need to click a couple of times in the upper half of the view to get to the actual Text View and not the Scroll View. Set the Model Key Path to ‘details’.

Do the same with the Image Well, setting the Model Key Path to ‘depiction’ and setting the Value Transformer to ‘NSKeyedUnarchiveFromData’.

Now for the TableView. Select the first column, for ‘Name’. You’ll have to click a few times until just the column is selected. In the Bindings Inspector, you should expand Value and ‘Bind to:’ Mythical Person Array Controller, set the Controller Key to ‘arrangedObjects’ and set the Model Key Path to ‘name’. Repeat this for the ‘Power’, ‘Divinity’ and ‘Goodness’ columns, setting the Model Key Path to ‘power’, ‘divinity’ and ‘goodness’, respectively.

With the Depiction column selected, like the other columns, bind it to the Mythical Person Array Controller, using ‘depiction’ as the Model Key Path, but, also, set Value Transformer to ‘NSKeyedUnarchiveFromData’. Also, un-tick the Editable box in the Attributes Inspector, as you won’t be editing this value from within the Table View.

Now select the label entitled ‘# out of #’ and, in the Bindings Inspector, expand ‘Display Pattern Value1′, ‘Bind to:’ Mythical Person Array Controller, set the Controller Key to ‘selection’, the Model Key Path to ‘@count’ and Display Pattern to ‘%{value1}@ out of %{value2}@’. Repeat this for ‘Display Pattern Value2′, but set the Controller Key to ‘arrangedObjects’.

Button Actions

It’s now time to attach the button actions and states!

CTRL+drag from the Add button to the Mythical Person Array Controller and select the ‘add:’ action. Repeat this for the Remove and Fetch buttons, attaching them to the ‘remove:’ and ‘fetch:’ actions, respectively.

You also need to disable the Add and Remove buttons whenever you’re not allowed to perform these actions. To do this, select the Add button and open the Bindings Inspector. Expand Enabled, under Availability. Tick ‘Bind to’ against Mythical Person Array Controller and delete the contents of the Controller Key field. You should now be prompted with a list of possible values. Choose canAdd: by double-clicking it.

Repeat this for the Remove button, but choose canRemove: for the Controller Key.

You don’t need to do anything for the Fetch button, as the Array Controller doesn’t have a canFetch method.

Save It!

In order to save your data to your application’s data store, you need to bind your Save menu option to your Application Delegate’s saveAction: method. To do this, make sure you have the Main Menu visible in Interface Builder and click on the File menu. Now, CTRL+drag from the Save menu item to the App Delegate in your nib. When you release the mouse button, you should be able to choose saveAction: from the popup.

Search Predicates

The last thing that you need to get working in your GUI is the search field, in the top right corner. This field will allow you to select one of six search predicates and filter your data against a given value.

Add the first Predicate, ‘All’, which will search all fields (except Depiction) for the specified value and filter the results in the Table View. Start by selecting the search field in the window and selecting the Bindings Inspector. Expand Predicate, under Search, and ‘Bind to:’ the Mythical Person Array Controller. Set the Controller Key to ‘filterPredicate’, Display Name to ‘All’ and Predicate Format to ‘(name contains[c] $value) or (power.description contains[c] $value) or (divinity.description contains[c] $value) or (goodness.description contains[c] $value) or (details contains[c] $value)’.

After adding the ‘All’ predicate, you should notice that a Predicate 2 has appeared in the Binding Inspector. Every time you add a predicate XCode will add a further empty one for you to use. Like the ‘All’ predicate, add five more with the following values;

Predicate	Display Name	Predicate Format
2	Name	name contains[c] $value
3	Power	power.description contains[c] $value
4	Divinity	divinity.description contains[c] $value
5	Goodness	goodness.description contains[c] $value
6	Details	details contains[c] $value

Once you’ve added these predicates, you should be able to filter your Table View by selecting a predicate from the search field’s pulldown and filter on the value you enter into the field.

Book Errata

At this point, you should be at the point where you can carry on with the book, however there is a problem with the book.  A section is missing where it tells you to add a sub-class of NSManagedObject to perform field validation.  The book tells you to add code to MythicalPerson.m, which doesn’t exist!  Don’t worry, this is really easy with Xcode 4, which I’ll now explain.

From the Xcode menu, select New->New File…, choose Core Data from the Mac OS X types on the left, select NSManagedObject subclass on the right and click Next.

In the table view that appears, tick MythBase and click Next.

Then tick MythicalPerson in the next table view and click Next.

You should then be prompted for where you’d like your file created.  Just leave it in the default location, which is the MythBase folder within your project.

That’s it, you should now have a MythicalPerson.m file and associated .h file ready for your business logic.

Run it!

That’s it, you’ve done it! Fire up the app and take it for a spin. Add some data, remove some data, save, close, open, fetch, search – try it all. If some of it doesn’t work then go back over the guide and see if you’ve missed something. If you get really stuck, write a comment below and I’ll try and help.
If it’s all working, go pour yourself a glass of whiskey (preferably single malt), add a chunk of ice and enjoy your handiwork.
Once you’ve drank your whiskey, feel to carry on with the rest of chapter 7.

The End

Well, I hope you enjoyed that and everything worked out well. If not, please comment below and I’ll see what I can do.

If you feel that this guide has really helped you and you’d like to make a small donation, then you can help my local Church by donating to their restoration fund here (or at the direct PayPal link here). All donations are gratefully excepted.