Bordure autour de UITableView Section

Pour cette question j'ai fait une adaptation de jvanmetre réponse pour l'arrondissement tableviews coins, il suffit d'ajouter le tableView:willDisplayCell:forRowAtIndexPath: délégué méthode avec le code suivant (un simple copier/coller de travail), il doit travailler pour regroupés les tables de trop. Je lui ai dit où vous devez définir la largeur et la couleur de la bordure.

- (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;
}
}

Aussi, n'oubliez pas de définir le séparateur de propriété de la table à aucun dans Interface Builder, (il est par défaut à une seule ligne), si vous êtes à la création de la table par programmation, vous devez définir la propriété comme cela

yourTableView.separatorStyle = UITableViewCellSeparatorStyleNone

OriginalL'auteur Boris

Ici est une autre approche que j'ai fini qui peut aider quelqu'un. Il dessine la frontière pour chaque section avec une couleur prédéfinie et la largeur, sans modifier les autres propriétés des cellules. Il ne vous donne pas une section arrondie (probablement, il peut être modifié en conséquence), mais il donne un bon degré de contrôle sur les lignes de tirage. L'approche aborde également le dispositif de rotation.

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 redColor].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];
}

- Je utiliser tableView de reloadData méthode pour redessiner les cellules qui je crois n'est pas la meilleure approche. S'il vous plaît conseils sur la méthode alternative dans les commentaires et je vais mis à jour le code.

Pour ajouter une bordure à en-tête/pied de page il suffit de créer un affichage personnalisé dans viewForHeaderInSection/viewForFooterInSection délégué de méthodes et de passer de la vue de la addBorder:forView méthode ci-dessus avant de retourner auprès de votre délégué.

OriginalL'auteur vir us

Ici est la swift version de accepté de répondre.

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
}
}

OriginalL'auteur Asad

J'ai modifié ci-dessus posté code, ce code créer frontière de la section.
Testé dans swift4.2

func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) {
let cornerRadius: CGFloat = 24
cell.backgroundColor = .clear
let layer = CAShapeLayer()
let pathRef = CGMutablePath()
let bounds = cell.bounds.insetBy(dx: 10, dy: 0)
var addLine = 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: .init(x: bounds.minX, y: bounds.maxY))
pathRef.addArc(tangent1End: .init(x: bounds.minX, y: bounds.minY), tangent2End: .init(x: bounds.midX, y: bounds.minY), radius: cornerRadius)
pathRef.addArc(tangent1End: .init(x: bounds.maxX, y: bounds.minY), tangent2End: .init(x: bounds.maxX, y: bounds.midY), radius: cornerRadius)
pathRef.addLine(to: .init(x: bounds.maxX, y: bounds.maxY))
addLine = true
} else if indexPath.row == tableView.numberOfRows(inSection: indexPath.section) - 1 {
pathRef.move(to: .init(x: bounds.minX, y: bounds.minY))
pathRef.addArc(tangent1End: .init(x: bounds.minX, y: bounds.maxY), tangent2End: .init(x: bounds.midX, y: bounds.maxY), radius: cornerRadius)
pathRef.addArc(tangent1End: .init(x: bounds.maxX, y: bounds.maxY), tangent2End: .init(x: bounds.maxX, y: bounds.midY), radius: cornerRadius)
pathRef.addLine(to: .init(x: bounds.maxX, y: bounds.minY))
} else {
//pathRef.addRect(bounds)
let pathInnerRef = CGMutablePath()
pathInnerRef.move(to: .init(x: bounds.minX, y: bounds.minY))
pathInnerRef.addLine(to: .init(x: bounds.minX, y: bounds.maxY))
pathInnerRef.move(to: .init(x: bounds.maxX, y: bounds.minY))
pathInnerRef.addLine(to: .init(x: bounds.maxX, y: bounds.maxY))
pathRef.addPath(pathInnerRef)
addLine = true
}
layer.path = pathRef
layer.fillColor = UIColor.clear.cgColor
layer.strokeColor = UIColor.black.cgColor
if (addLine == true) {
let lineLayer = CALayer()
let lineHeight = 1.0 / UIScreen.main.scale
lineLayer.frame = CGRect(x: bounds.minX + 10, y: bounds.size.height - lineHeight, width: bounds.size.width - 10, height: lineHeight)
lineLayer.backgroundColor = UIColor.clear.cgColor//tableView.separatorColor?.cgColor
lineLayer.addBorder(edge: .left, color: UIColor.black, thickness: 2.0)
lineLayer.addBorder(edge: .right, color: UIColor.black, thickness: 2.0)
layer.addSublayer(lineLayer)
}
let testView = UIView(frame: bounds)
testView.layer.insertSublayer(layer, at: 0)
testView.backgroundColor = .clear
cell.backgroundView = testView   
}

OriginalL'auteur sanjay bhangade