Wednesday, September 26, 2012

Change a View to a ScrollView in Xcode Interface Builder

I recently needed to change UIView to a UIScrollView, then embed that ScrollView into a View. I won't go into the underlying code required to manipulate scrollViews. I am interested here in getting the UI correct with InterfaceBuilder.

First, with Xcode IB, open the storyboard and locate the View you want to change. With the Utilities View (the rightmost button of the View group on the Xcode Toolbar), show the Identity Inspector.

Change the Class under Custom Class from UIView to UIScrollView.

Since you need to embed the scrollView into a View, you can manually add a View under into the parent View Controller visual object or wait and use the Xcode Menu > Editor > Embed In > View command later. If you do it now, you will need to adjust the ScrollView position in the View window.

The "View" is now a scrollView but the Attribute Inspector still indicates it is a View.

We want the Attribute Inspector to look like this:

To get this, in Xcode, use right-click on the storyboard, and Open As > Source Code. 

Now, in the XML source, search for UIScrollView. You will find something like this: (the !-- and -- are XML comments that I added)

Change that to the following: (the !-- and -- are XML comments that I added)

Note that the id is the same.

Also, change the associated /view to /scrollView at the bottom of this XML clause.

That's it.

If you want to now , use the Embed In command to embed the ScrollView in a View.

Monday, February 27, 2012

Using a Custom Prototype tableViewCell with an IOS Storyboard

I was having all sorts of issues (disappearing data, incorrect data showing up in table view cells) attempting to use a custom, prototype cell from a Storyboard in a sub-classed UITableViewController that pulls from Core Data. Using a technique found at StackOverflow and the following works:

1) Create a subclass of UITableViewCell, call it MyCustomTVCell

2) Create the custom xib (MyCustomTVCellXibFile) file, pull in a tableViewCell. Make it custom, and make sure to use a unique Reuse Identifier (My Unique Reuse ID).

3) In the Identity Inspector, assign it the MyCustomTVCell class

4) Pull in a label on the tableViewCell.

5) Control-drag from the label to the MyCustomTVCell.h file
to IBOutlets. (call it label01)

6) Use the method registerNib:forCellReuseIdentifier: in tableView:cellForRowAtIndexPath: (thanks @richard-venable)

static NSString *CellIdentifier = @"My Unique Reuse ID";

[tableView registerNib:[UINib nibWithNibName:@"MyCustomTVCellXibFile" bundle:nil] forCellReuseIdentifier:CellIdentifier];

7) Create a cell with the MyCustomTVCell subclass:

MyCustomTVCell *cell = (MyCustomTVCell *) [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

if (cell == nil) {
        cell = [[
MyCustomTVCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];

8) Assign CD data to the now extended properties of the cell, i.e.

cell.label01.text = "fetched data from CoreData";

It works.