3

I'd like to use a UItableView to show a day Calendar. Each row corresponds to one hour. I need to show the hour between 2 cell of my tableview.

Like this :

a
(source: free.fr)

And this is my UITableViewCell :

a
(source: free.fr)

In the first screenshot, it works perfectly but if I scroll down then scroll up, my time label is cut like this :

a
(source: free.fr)

Have you any tips to figure out this problem using a tableView ?

Glorfindel
  • 21,988
  • 13
  • 81
  • 109
booker
  • 1,256
  • 1
  • 12
  • 18

2 Answers2

1

The way you lay out your cell now is fragile, because the order of painting the cells on screen matters a lot. Try moving the content up so that your buttons are flush with the top of the cell, and the time label fits into the cell entirely. Add a thin header view to your table to make the top cell appear normal. Keeping the content of a cell entirely within its bounds should help you maintain reasonable scrolling speeds.

EDIT : You could also put a second clipped label at the top of your cell, and make its content identical to that of the label in the prior row. You would need to take special care to hide that label in the top row, but otherwise this should make your table immune to changes in the rendering order of its cells.

Sergey Kalinichenko
  • 714,442
  • 84
  • 1,110
  • 1,523
  • @user731379 If you move everything up, the buttons should still fit, but the label would fit too. – Sergey Kalinichenko May 03 '12 at 17:47
  • The picture was an example, my buttons a and b will be bigger – booker May 03 '12 at 17:49
  • @user731379 Will there be any space in the cell above the buttons? – Sergey Kalinichenko May 03 '12 at 17:50
  • No, its will take all the space – booker May 03 '12 at 17:52
  • Fine, adding a custom header is the best way I think – booker May 03 '12 at 17:57
  • @user731379 You can put separators into their own cell type, and use [the trick described in this answer](http://stackoverflow.com/q/494562/335858) to set row height dynamically. This will help you avoid clipping. Of course your delegate will become more complex (you'll need to return `2*N-1` rows instead of `N`, return different cell types for odd and even rows, etc.) but the layout will remain stable regardless of the rendering order. – Sergey Kalinichenko May 03 '12 at 17:58
  • @user731379 I edited the answer to suggest an utter hack that, nevertheless, has a decent chance of working. – Sergey Kalinichenko May 03 '12 at 18:03
  • The header solution is simplier to implement. I'll show a header for each row (converted to section) – booker May 03 '12 at 18:03
  • I tried with a header and it takes to much place :/ I think I'll giveup using tableview. A static Scrollview will do the job, not very optimized... – booker May 03 '12 at 18:40
  • @user731379 Unless you are under severe time constraints, I would still try the idea outlined in the long comment about making cells of two types - two-buttoned ones, and labeled separators. It should be reasonably straightforward to wire up, has a very good chance of working out, and should give you a crisp-looking layout that you can control. – Sergey Kalinichenko May 03 '12 at 18:45
0

Make the background color of your cell clear. As you scroll up the z ordering of your cells get reversed and the lower cells overlap the higher ones causing this clipping.

Dave.B
  • 6,632
  • 1
  • 19
  • 20
  • I need to keep enough place for my 2 buttons, that's why I pushed my label over the limits – booker May 03 '12 at 17:46
  • @user731379 if you make the background of the cell clear the label should still show regardless of the overlap – Dave.B May 03 '12 at 17:50
  • I've already tried but It doesn't work. a bit weard. It should work :/ – booker May 03 '12 at 17:54
  • @user731379 is ClipSubviews set to yes on the cell? If not then I apologise for an incorrect answer and recommend dasblinkenlights answer – Dave.B May 03 '12 at 18:02
  • No ClipSubviews is unchecked. Otherwise, my label will always appear cut. – booker May 03 '12 at 18:12