Borde alnetworkingedor de la sección UITableView

¿Cómo podemos tener el borde alnetworkingedor de cada sección de tableview? Adjunto está la image para mostrar lo que estoy buscando. Si miras la image, tiene un borde alnetworkingedor de cada sección de vista de tabla.

introduzca la descripción de la imagen aquí

Para este problema hice una adaptación de la respuesta de jvanmetre para networkingondear las vistas de las esquinas, simplemente agregue el tableView:willDisplayCell:forRowAtIndexPath: delegate con el siguiente código (una copy / pegado simple debería funcionar), también debería funcionar para tablas agrupadas. Le comenté dónde debería configurar el ancho y el color del borde.

 - (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath { if ([cell respondsToSelector:@selector(tintColor)]) { CGFloat cornerRadius = 5.f; cell.backgroundColor = UIColor.clearColor; CAShapeLayer *layer = [[CAShapeLayer alloc] init]; CGMutablePathRef pathRef = CGPathCreateMutable(); CGRect bounds = CGRectInset(cell.bounds, 10, 0); BOOL addLine = NO; if (indexPath.row == 0 && indexPath.row == [tableView numberOfRowsInSection:indexPath.section]-1) { CGPathAddRoundedRect(pathRef, nil, bounds, cornerRadius, cornerRadius); } else if (indexPath.row == 0) { CGPathMoveToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMaxY(bounds)); CGPathAddArcToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMinY(bounds), CGRectGetMidX(bounds), CGRectGetMinY(bounds), cornerRadius); CGPathAddArcToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMinY(bounds), CGRectGetMaxX(bounds), CGRectGetMidY(bounds), cornerRadius); CGPathAddLineToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMaxY(bounds)); addLine = YES; } else if (indexPath.row == [tableView numberOfRowsInSection:indexPath.section]-1) { CGPathMoveToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMinY(bounds)); CGPathAddArcToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMaxY(bounds), CGRectGetMidX(bounds), CGRectGetMaxY(bounds), cornerRadius); CGPathAddArcToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMaxY(bounds), CGRectGetMaxX(bounds), CGRectGetMidY(bounds), cornerRadius); CGPathAddLineToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMinY(bounds)); } else { CGPathAddRect(pathRef, nil, bounds); addLine = YES; } layer.path = pathRef; CFRelease(pathRef); //set the border color layer.strokeColor = [UIColor lightGrayColor].CGColor; //set the border width layer.lineWidth = 1; layer.fillColor = [UIColor colorWithWhite:1.f alpha:1.0f].CGColor; if (addLine == YES) { CALayer *lineLayer = [[CALayer alloc] init]; CGFloat lineHeight = (1.f / [UIScreen mainScreen].scale); lineLayer.frame = CGRectMake(CGRectGetMinX(bounds), bounds.size.height-lineHeight, bounds.size.width, lineHeight); lineLayer.backgroundColor = tableView.separatorColor.CGColor; [layer addSublayer:lineLayer]; } UIView *testView = [[UIView alloc] initWithFrame:bounds]; [testView.layer insertSublayer:layer atIndex:0]; testView.backgroundColor = UIColor.clearColor; cell.backgroundView = testView; } } 

Además, recuerde establecer la propiedad de separador de la tabla en none en el Generador de interfaces, (es por defecto una sola línea), si está creando la tabla mediante progtwigción, debe establecer la propiedad como esta

 yourTableView.separatorStyle = UITableViewCellSeparatorStyleNone 

Aquí está la respuesta de Asad actualizada a swift 3

 func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) { if (cell.responds(to: #selector(getter: UIView.tintColor))) { let cornerRadius: CGFloat = 5 cell.backgroundColor = UIColor.clear let layer: CAShapeLayer = CAShapeLayer() let pathRef: CGMutablePath = CGMutablePath() let bounds: CGRect = cell.bounds.insetBy(dx: 10, dy: 0) var addLine: Bool = false if (indexPath.row == 0 && indexPath.row == tableView.numberOfRows(inSection: indexPath.section)-1) { pathRef.__addRoundedRect(transform: nil, rect: bounds, cornerWidth: cornerRadius, cornerHeight: cornerRadius) } else if (indexPath.row == 0) { pathRef.move(to: CGPoint(x:bounds.minX,y:bounds.maxY)) pathRef.addArc(tangent1End: CGPoint(x:bounds.minX,y:bounds.minY), tangent2End: CGPoint(x:bounds.midX,y:bounds.minY), radius: cornerRadius) pathRef.addArc(tangent1End: CGPoint(x:bounds.maxX,y:bounds.minY), tangent2End: CGPoint(x:bounds.maxX,y:bounds.midY), radius: cornerRadius) pathRef.addLine(to: CGPoint(x:bounds.maxX,y:bounds.maxY)) addLine = true; } else if (indexPath.row == tableView.numberOfRows(inSection: indexPath.section)-1) { pathRef.move(to: CGPoint(x:bounds.minX,y:bounds.minY)) pathRef.addArc(tangent1End: CGPoint(x:bounds.minX,y:bounds.maxY), tangent2End: CGPoint(x:bounds.midX,y:bounds.maxY), radius: cornerRadius) pathRef.addArc(tangent1End: CGPoint(x:bounds.maxX,y:bounds.maxY), tangent2End: CGPoint(x:bounds.maxX,y:bounds.midY), radius: cornerRadius) pathRef.addLine(to: CGPoint(x:bounds.maxX,y:bounds.minY)) } else { pathRef.addRect(bounds) addLine = true } layer.path = pathRef //CFRelease(pathRef) //set the border color layer.strokeColor = UIColor.lightGray.cgColor; //set the border width layer.lineWidth = 1 layer.fillColor = UIColor(white: 1, alpha: 1.0).cgColor if (addLine == true) { let lineLayer: CALayer = CALayer() let lineHeight: CGFloat = (1 / UIScreen.main.scale) lineLayer.frame = CGRect(x:bounds.minX, y:bounds.size.height-lineHeight, width:bounds.size.width, height:lineHeight) lineLayer.backgroundColor = tableView.separatorColor!.cgColor layer.addSublayer(lineLayer) } let testView: UIView = UIView(frame:bounds) testView.layer.insertSublayer(layer, at: 0) testView.backgroundColor = UIColor.clear cell.backgroundView = testView } } 

Puede usar el estilo de sección de vista de UITableViewStyleGrouped UITableViewStyleGrouped.

Aquí está la versión rápida de la respuesta aceptada.

 func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) { if (cell.respondsToSelector("tintColor")) { var cornerRadius: CGFloat = 5; cell.backgroundColor = UIColor.clearColor() var layer: CAShapeLayer = CAShapeLayer() var pathRef: CGMutablePathRef = CGPathCreateMutable() var bounds: CGRect = CGRectInset(cell.bounds, 10, 0) var addLine: Bool = false if (indexPath.row == 0 && indexPath.row == tableView.numberOfRowsInSection(indexPath.section)-1) { CGPathAddRoundedRect(pathRef, nil, bounds, cornerRadius, cornerRadius); } else if (indexPath.row == 0) { CGPathMoveToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMaxY(bounds)); CGPathAddArcToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMinY(bounds), CGRectGetMidX(bounds), CGRectGetMinY(bounds), cornerRadius); CGPathAddArcToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMinY(bounds), CGRectGetMaxX(bounds), CGRectGetMidY(bounds), cornerRadius); CGPathAddLineToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMaxY(bounds)); addLine = true; } else if (indexPath.row == tableView.numberOfRowsInSection(indexPath.section)-1) { CGPathMoveToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMinY(bounds)); CGPathAddArcToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMaxY(bounds), CGRectGetMidX(bounds), CGRectGetMaxY(bounds), cornerRadius); CGPathAddArcToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMaxY(bounds), CGRectGetMaxX(bounds), CGRectGetMidY(bounds), cornerRadius); CGPathAddLineToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMinY(bounds)); } else { CGPathAddRect(pathRef, nil, bounds); addLine = true; } layer.path = pathRef; //CFRelease(pathRef); //set the border color layer.strokeColor = UIColor.lightGrayColor().CGColor; //set the border width layer.lineWidth = 1; layer.fillColor = UIColor(white: 1, alpha: 1.0).CGColor; if (addLine == true) { var lineLayer: CALayer = CALayer(); var lineHeight: CGFloat = (1 / UIScreen.mainScreen().scale); lineLayer.frame = CGRectMake(CGRectGetMinX(bounds), bounds.size.height-lineHeight, bounds.size.width, lineHeight); lineLayer.backgroundColor = tableView.separatorColor!.CGColor; layer.addSublayer(lineLayer); } var testView: UIView = UIView(frame:bounds) testView.layer.insertSublayer(layer, atIndex: 0) testView.backgroundColor = UIColor.clearColor() cell.backgroundView = testView } } 

Aquí hay otro enfoque que he terminado que puede ayudar a alguien. Dibuja el borde para cada sección con un color y ancho pnetworkingefinidos sin alterar otras properties de las celdas. No le da una sección networkingondeada (probablemente se puede modificar en consecuencia), pero da un buen grado de control de las líneas a dibujar. El enfoque también aborda la rotation del dispositivo.

 typedef enum CellBorderMask{ CellBorderMaskLeft = 1 << 0, CellBorderMaskRigth = 1 << 1, CellBorderMaskTop = 1 << 2, CellBorderMaskBottom = 1 << 3 }CellBorderMask; - (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath { CellBorderMask mask; if (indexPath.row == 0){ mask |= CellBorderMaskTop; } if(indexPath.row == [tableView numberOfRowsInSection:indexPath.section] - 1) { mask |= CellBorderMaskBottom; } mask |= CellBorderMaskRigth | CellBorderMaskLeft; [self addBorder:mask forView:cell.contentView]; } -(void)addBorder:(CellBorderMask)mask forView:(UIView *)view{ float onePixel = (1.f / [UIScreen mainScreen].scale); float lineWidth = 1 * onePixel; CGColorRef cgBorderColor = [UIColor networkingColor].CGColor; CALayer *topBorder = [CALayer layer]; CALayer *bottomBorder = [CALayer layer]; CALayer *leftBorder = [CALayer layer]; CALayer *rightBorder = [CALayer layer]; //tag layers so it's possible to find and remove them later topBorder.name = @"Border"; bottomBorder.name = @"Border"; leftBorder.name = @"Border"; rightBorder.name = @"Border"; //remove previously set border layers so they doesn't produce unwanted effect on orientation change [self cleanUpOldBorderLayers:view]; topBorder.frame = CGRectMake(0.0f, 0.0f, view.bounds.size.width, lineWidth); topBorder.backgroundColor = cgBorderColor; bottomBorder.frame = CGRectMake(0.0f, view.bounds.size.height - lineWidth, view.bounds.size.width, lineWidth); bottomBorder.backgroundColor = cgBorderColor; leftBorder.frame = CGRectMake(0.0f, 0.0f, lineWidth, view.bounds.size.height); leftBorder.backgroundColor = cgBorderColor; rightBorder.frame = CGRectMake(view.bounds.size.width - lineWidth, 0.0f, lineWidth, view.bounds.size.height); rightBorder.backgroundColor = cgBorderColor; if(mask & CellBorderMaskTop){ [view.layer addSublayer:topBorder]; } if(mask & CellBorderMaskBottom){ [view.layer addSublayer:bottomBorder]; } if(mask & CellBorderMaskLeft){ [view.layer addSublayer:leftBorder]; } if(mask & CellBorderMaskRigth){ [view.layer addSublayer:rightBorder]; } } -(void)cleanUpOldBorderLayers:(UIView *)view{ NSMutableArray *layerArray = [NSMutableArray new]; for (CALayer *layer in view.layer.sublayers) { if([@"Border" isEqualToString:layer.name]){ [layerArray addObject:layer]; } } for (CALayer *layer in layerArray) { [layer removeFromSuperlayer]; } } -(void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation{ //need to trigger tableView:willDisplayCell: method on orientation change. //Suggest a better method for this if there is one [self.tableView reloadData]; } 

Utilizo el método reloadData de reloadData para volver a dibujar las celdas, que creo que no es el mejor enfoque. Por favor, consejos sobre methods alternativos en los comentarios y actualizaré el código.

Para agregar borde al encabezado / pie de página simplemente cree una vista personalizada en los methods de delegado viewForHeaderInSection / viewForFooterInSection y pase la vista al método addBorder:forView anterior antes de devolverlo de su delegado.