用于空单元格的UITableView自定义分隔符

Question

我想制作应该使用技术的样本，你可以在Reminders，ibooks，note apps中看到。

正如您在Reminders中看到的，app divider看起来像这样：

提醒有点线分隔线 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

在该方法的内部，您可以识别最顶层，最底层和所有其他单元格，并适当地设置它们的包裹图像。

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

所以要实现我在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

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

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];