StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POBackground Texture of a grouped UITableView won't scroll with the table
text
Body
copied!<p>I'm working on an app that has lots of UITableViews and I'm trying to give them a textured background color. I need to use the Grouped style because I don't want the section headers to float over the text fields when the user scrolls. </p> <p><strong>The problem I'm having is that when I use the Grouped style, the background texture doesn't scroll with the table;</strong> it stays in place while the table scrolls above it. I feel like this is kind of weird and I would rather have the background scroll with the table, the way it does in the Plain style. Unfortunately, because I can't have the header views floating on top of everything, that doesn't appear to be an option.</p> <p>Has anyone been able to accomplish this?</p> <p>Here's some relevant code:</p> <pre><code>- (void)loadView { [super loadView]; self.view.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight; self.tableView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"texturedPattern.png"]]; // this prevents the cells from replicating the background texture self.tableView.backgroundView = [[UIView alloc] initWithFrame:self.view.bounds]; self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone; } - (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath { // disable the default grouped border since we're doing it manually with the textField cell.backgroundView = nil; cell.backgroundColor = [UIColor clearColor]; } </code></pre> <p>And my table view currently looks like this: <img src="https://i.stack.imgur.com/i49Ij.png" alt="Just to give you an idea..."></p> <p><strong>UPDATE</strong></p> <p>As Amit Vyawahare suggested, I tried applying the background texture to the background of the headers and each cell. There are two problems that are both much more obvious when you see it in motion, but I'll do my best.</p> <ul> <li>First, the background is always visible. <em>I've removed the background color from the table to make it more obvious</em>:</li> </ul> <p><img src="https://i.stack.imgur.com/DHNSh.png" alt="Scrolling areas vs. non-scrolling areas"></p> <p>Everywhere you see black, the background texture of the tableView would be visible and it <em>will not scroll with the tableView</em>. The Grouped tableView style inserts the 5 pixel border on either side of every cell and can't be changed. Additionally, there is no footer beneath the Staff ID section, and I've even implemented <code>-tableView:heightForFooterInSection:</code> to return 0.0, but there's still a gap there.</p> <ul> <li>Second, even if I were able to get rid of these gaps, the textures don't line up anyway. Again, this is difficult to see, so I've uploaded a retina screen shot to make it a little easier:</li> </ul> <p><img src="https://i.stack.imgur.com/LCN59.png" alt="if you squint, you'll see a totally rad 3d image!"></p> <p>This is most obvious above the Password section, you can see the textures don't align properly and it looks kind of like a "fold" in the paper. Which would be cool, I guess, if that's what the client wanted. It's visible, but less obvious on just about every edge from the second screen shot. This is because the texture is actually quite large: 200x200 (400x400@2x), and there are slight variations in color that aren't noticeable <em>unless</em> this sort of misalignment happens.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload