空单元格的 UITableView 自定义分隔线

Question

我想制作应该使用您可以在提醒、ibooks、笔记应用程序中看到的技术的示例。

正如您在提醒应用程序分隔符中看到的那样：

提醒有点线分隔线。
iBook 有书架隔板。
所以问题是如何在示例应用程序中制作自定义分隔符？即使没有为表格视图设置数据，也应该绘制分隔线。

Answer 1

为什么不尝试使用部分标题来为您提供自定义视图？在 .m 文件中，尝试：

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView; {
  return [_cellArray count];
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section; {
  return 1;
}

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section; {
  CustomView * customView = [[CustomView alloc] init]; // This view is the custom view you want, like the dotted lines for example.
  return customView;
}

至于始终显示，您可能需要添加空白单元格才能获得此外观。希望有帮助！！！

Answer 2

基本上你实现了

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

在该方法中，您实现了对最顶部、最底部和所有其他单元格的识别，并适当地设置它们的袋子圆形图像。

在看书架的 tableview 的情况下，我将实现最顶部，底部有一个架子，一个书架的顶部。对于所有其他人，我会实现一个标准的中间架子，而对于最底部的人来说，我会实现一个看起来更底部的架子。

所以要实现我在 cellForRoatAtIndexPath 方法中谈论的内容，这样的一些代码应该可以工作

UIImage * rowBackground;
UIImage * selectionBackground;

if( 0 == [indexPath row] ){
    rowBackground       = [UIImage imageNamed:@"listBackingTop.png"];
    selectionBackground = [UIImage imageNamed:@"listBackingTopSelected.png"];
}else if( 217 == [indexPath row] ){
    rowBackground       = [UIImage imageNamed:@"listBackingBottom.png"];
    selectionBackground = [UIImage imageNamed:@"listBackingBottomSelected.png"];
}else{      
    rowBackground       = [UIImage imageNamed:@"listBackingMiddle.png"];
    selectionBackground = [UIImage imageNamed:@"listBackingMiddleSelected.png"];
}

((UIImageView *)cell.backgroundView).image         = rowBackground;
((UIImageView *)cell.selectedBackgroundView).image = selectionBackground;

在我上面的例子中，217 是我的最大行号。

请记住，您可以控制有多少行，因此您可以根据需要为每行实施不同的支持。我已经完成了表格视图，我为偶数行做了蓝色，为奇数行做了橙色，并且仍然有圆形顶部底部和方形中间看起来单元格。

这里有一些代码，用于更复杂的设置，橙色和蓝色，顶部和底部单元格与中间单元格不同。还具有更动态的单元格。

UIImage * rowBackground;
UIImage * selectionBackground;
UIImage * accessoryImage;
UIImage * backingImage;

if( 0 == [indexPath row] ){
    rowBackground       = [UIImage imageNamed:@"listTop.png"];
    selectionBackground = [UIImage imageNamed:@"listTopDown.png"];
}else if( (amountRows - 1) == [indexPath row] ){

    if( 0 == ([indexPath row] % 2) ){
        rowBackground       = [UIImage imageNamed:@"listBottomOrange.png"];
        selectionBackground = [UIImage imageNamed:@"listBottomOrangeDown.png"];
    }else{
        rowBackground       = [UIImage imageNamed:@"listBottomBlue.png"];
        selectionBackground = [UIImage imageNamed:@"listBottomBlueDown.png"];
    }

}else{      
    if( 0 == ([indexPath row] % 2) ){
        rowBackground       = [UIImage imageNamed:@"listMiddleOrange.png"];
        selectionBackground = [UIImage imageNamed:@"listMiddleOrangeDown.png"];
    }else{
        rowBackground       = [UIImage imageNamed:@"listMiddleBlue.png"];
        selectionBackground = [UIImage imageNamed:@"listMiddleBlueDown.png"];
    }
}

accessoryImage = [UIImage imageNamed:@"arrow.png"];
accessory.image = accessoryImage;

backingImage = [UIImage imageNamed:@"imageBacking.png"];
imageBack.image = backingImage;

((UIImageView *)cell.backgroundView).image         = rowBackground;
cell.backgroundView.alpha                          = 0.9;
((UIImageView *)cell.selectedBackgroundView).image = selectionBackground;
cell.selectedBackgroundView.alpha                  = 0.5;

我认为我试图说明的主要观点是不要将分隔器与电池分开，而是让它成为电池背衬的一部分。

Answer 3

需要在UITableView contentSize 下方添加UIView 和backgroundColor 作为patternWithColor:["your image with custom divider"]。

CGSize size = _tableView.contentSize;
UIView *footerImageView = [[UIView alloc] initWithFrame:CGRectMake(0.0f, size.height + 50, 320.0f, 600.0f)];
footerImageView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"Shelf.png"]];
[_tableView addSubview:footerImageView];