2017-02-10 21 views
0

У меня есть UITableView со следующими клетками макет:Некоторые визуальные ошибка с CALayer

• UIView

•• UIImageView

••• Полупрозрачные наложения UIView, как подвид из UIImageView

Есть также значок, имитирующий кнопку «play» и UILabel, но они, похоже, не связаны с этой ошибкой.

И у меня есть следующий код:

override func layoutSubviews() { 
     super.layoutSubviews() 

     createPath() 
    } 

    private func createPath() { 
     let padding = CGFloat(16) 
     let bottomLineLength = CGFloat(64) 
     let arcPadding = CGFloat(8) 

     let width = self.contentView.frame.width 
     let height = self.contentView.frame.height 

     if pathLayer != nil { 
      pathLayer?.removeFromSuperlayer() 
     } 

     pathLayer = CAShapeLayer() 

     let path = UIBezierPath() 

     path.move(to: CGPoint(x: padding + arcPadding, y: padding)) 
     path.addLine(to: CGPoint(x: width - padding - arcPadding, y: padding)) 

     // Top-Right arc 
     path.addArc(withCenter: CGPoint(x: width - padding - arcPadding, y: padding + arcPadding), 
        radius: arcPadding, 
        startAngle: CGFloat(3 * M_PI/2), 
        endAngle: CGFloat(M_PI * 2), 
        clockwise: true) 

     path.move(to: CGPoint(x: width - padding, y: padding + arcPadding)) 
     path.addLine(to: CGPoint(x: width - padding, y: height - padding - arcPadding)) 

     // Bottom-Right arc 
     path.addArc(withCenter: CGPoint(x: width - padding - arcPadding, y: height - padding - arcPadding), 
        radius: arcPadding, 
        startAngle: CGFloat(M_PI * 2), 
        endAngle: CGFloat(M_PI/2), 
        clockwise: true) 
     path.move(to: CGPoint(x: width - padding - arcPadding, y: height - padding)) 
     path.addLine(to: CGPoint(x: width - padding - bottomLineLength, y: height - padding)) 

     path.move(to: CGPoint(x: padding + bottomLineLength, y: height - padding)) 
     path.addLine(to: CGPoint(x: padding + arcPadding, y: height - padding)) 

     // Bottom-Left arc 
     path.addArc(withCenter: CGPoint(x: padding + arcPadding, y: height - padding - arcPadding), 
        radius: arcPadding, 
        startAngle: CGFloat(M_PI/2), 
        endAngle: CGFloat(M_PI), 
        clockwise: true) 

     path.move(to: CGPoint(x: padding, y: height - padding - arcPadding)) 
     path.addLine(to: CGPoint(x: padding, y: padding + arcPadding)) 

     // Top-Left arc 
     path.addArc(withCenter: CGPoint(x: padding + arcPadding, y: padding + arcPadding), 
        radius: arcPadding, 
        startAngle: CGFloat(M_PI), 
        endAngle: CGFloat(3 * M_PI/2), 
        clockwise: true) 

     pathLayer?.rasterizationScale = 2 * UIScreen.main.scale 
     pathLayer?.shouldRasterize = true 
     pathLayer?.strokeColor = UIColor(red: 0xFF/255, green: 0xFF/255, blue: 0xFF/255, alpha: 0.5).cgColor 
     pathLayer?.lineWidth = 2.0 
     pathLayer?.path = path.cgPath 

     contentView.layer.addSublayer(pathLayer!) 
    } 

Я звоню его в layoutSubviews для повторного создания пути на вращении устройства.

И если вы посмотрите на скриншот, есть некоторые черные и повернутые немного черные «дыры» рядом с дорожкой. Все они выглядят одинаково, и они, безусловно, не присутствуют на изображении в UIImageView.

Screenshot

Я думаю, что это связано с моей CALayer. Как это исправить?

+0

Там является черный клин вдоль внутреннего левого края каждого закругленного прямоугольника. Это видно, если вы приближаетесь. Также есть клины вдоль верхнего, правого и нижнего левого краев. –

+0

@robmayoff Я рад, что вы видите, что он имеет в виду! – matt

ответ

2

Ваша проблема заключается в эти черные клинья:

black wedges

Основной причиной является то, что по умолчанию fillColor из CAShapeLayer непрозрачный черный. Установите его в ноль, чтобы избежать начинку:

pathLayer?.fillColor = nil 

Это сделано, позвольте мне показать вам более короткий путь, чтобы построить свой путь:

let cgPath = CGMutablePath() 
let start = CGPoint(x: padding + bottomLineLength, y: height - padding) 
let blCorner = CGPoint(x: padding, y: height - padding) 
let tlCorner = CGPoint(x: padding, y: padding) 
let trCorner = CGPoint(x: width - padding, y: padding) 
let brCorner = CGPoint(x: width - padding, y: height - padding) 
let end = CGPoint(x: width - padding - bottomLineLength, y: height - padding) 

cgPath.move(to: start) 
cgPath.addArc(tangent1End: blCorner, tangent2End: tlCorner, radius: arcPadding) 
cgPath.addArc(tangent1End: tlCorner, tangent2End: trCorner, radius: arcPadding) 
cgPath.addArc(tangent1End: trCorner, tangent2End: brCorner, radius: arcPadding) 
cgPath.addArc(tangent1End: brCorner, tangent2End: end, radius: arcPadding) 
cgPath.addLine(to: end) 

shapeLayer.path = cgPath 

Результат:

no wedges