Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Add UITableView with dynamic content in an XIB file

Is there a way to add a UITableView (not a Table View Controller, but a TableView within another view) and set its content to "Dynamic Prototype" in an XIB file?

This works fine when adding a UITableView in a view controller within the storyboard. However, when I try to do the same in an XIB file, I cannot set its content to "Dynamic Prototype".

like image 408
itsame69 Avatar asked Jan 04 '13 10:01

itsame69


2 Answers

Update

In thinking about this recently, there is a fairly straightforward solution to the problem, which is to use the container view pattern.

  1. Basically, add a container view to your xib (or storyboard).
  2. Select the view controller attached by default to the container view.
  3. Delete the selected view controller and drag in a normal uitableviewcontroller onto the IB canvas.
  4. Next, control-drag from the container view to the uitableviewcontroller and select 'Embed' from the available segues types.
  5. Resize the container view to your liking and create the appropriate code file for the table view controller.
  6. Refactor the uitableviewcontroller to a separate storyboard/xib.

Note - The table view controller will be accessible as a child view controller of the view controller that holds the container view in code.

Why is this the correct pattern? 1 Storyboard, 1 Controller. The TableView has it's own controller because it is complex enough to warrant a separate controller. Using the container view pattern allows you to maintain a single responsibility pattern. Avoids controller bloat.

Workaround for original answer

Please be aware of a gotcha where if you resize the tableview; the xml will be regenerated by Xcode and require you to re-add the attribute. I have confirmed that this edit still works in version 9.3+. A sample stub is available at https://github.com/mingsai/test-stub-tableviewdynamic-inxib.git.

Original Answer

  1. Open the file navigator
  2. Right-click on the YourCustomView.xib file
  3. Open As > Source Code

openas

  1. Find the XML beginning with

tableview-xml

  1. Within the XML tableview tag locate the style attribute
  2. Leaving an empty space before the style tag, paste in dataMode="prototypes"
like image 131
Tommie C. Avatar answered Oct 22 '22 04:10

Tommie C.


Not 100% sure on this, but I don't think there is a way to set the UITableView content to "Dynamic Prototype" in a XIB file.

However you can achieve the same functionality by creating another XIB file, called something like "MyTableViewCell.xib", that only contains a UITableViewCell, give the cell an identifier, go to File's Owner and in the identity inspector set it to the same view controller class as your table view xib, then create an IBOutlet in your view controller like this:

 @property (nonatomic, assign) IBOutlet UITableViewCell *customCell;

then in the XIB, click on the File's Owner and control-drag to the uitableviewcell and set the cell's outlet to the "customCell" property.

(This might be done a lot easier if you find the button that looks like a play button inside a circle in the bottom left hand corner of the graphic editor, click on it, then do your dragging in that column).

After all that, in cellForRowAtIndexPath use code similar to this:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath 
{

    static NSString *CellIdentifier = @"CustomCell";

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

    if (cell == nil) {
        [[NSBundle mainBundle] loadNibNamed:@"MyTableViewCell" owner:self options:nil];

        cell = customCell;
    }

    // Other cell configurations....
}

Hope that makes sense and suits your needs!

like image 41
starryVere Avatar answered Oct 22 '22 05:10

starryVere