Sine CAShapeLayer jako maską CALayer

Question

Próbuję realizować kolejną dziwną rzecz: Mam kilka kropek i chciałbym, aby połączyć je z sinusoidalnych

Następny metoda zwraca tablicę punktów dla podejmowania działki:

- (NSArray *)plotPointsBetweenPoint:(CGPoint)pointA andPoint:(CGPoint)pointB { 
    double H = fabs(pointB.y - pointA.y); 
    double L = fabs(pointB.x - pointA.x); 

    NSInteger granularity = 40; 
    NSMutableArray *array = [NSMutableArray arrayWithCapacity:granularity + 1]; 
    for (int i = 0; i <= granularity; ++i) { 
    CGFloat x = M_PI*(float)i/(granularity); 
    CGFloat y = -cosf(x); 
    CGFloat multiplier = pointA.y > pointB.y ? 1 : -1; 
    CGPoint newPoint = CGPointMake(pointA.x + L*(float)i/granularity, pointA.y - multiplier*H*(1.0 + y)/2.0); 
    [array addObject:[NSValue valueWithCGPoint:newPoint]]; 
    } 
    return array; 
} 

Po nim utworzyć specjalny UIBezierPath:

- (UIBezierPath *)sineWaveWithPoints:(NSArray *)points { 
    UIBezierPath *path = [[UIBezierPath alloc] init]; 
    NSMutableArray *array = [NSMutableArray array]; 

    for (int i = 0; i < points.count - 1; ++i) { 
    [array addObjectsFromArray:[self plotPointsBetweenPoint:[points[i] CGPointValue] andPoint:[points[i+1] CGPointValue]]]; 
    } 
    [path moveToPoint:[array[0] CGPointValue]]; 
    for (NSValue *value in array) { 
    CGPoint point = [value CGPointValue]; 
    [path addLineToPoint:point]; 
    } 
    [path closePath]; 
    path.lineWidth = 2.0; 
    [path stroke]; 
    return path; 
} 

Następny Dodaję tę ścieżkę przy użyciu CAShapeLayer:

CAGradientLayer *gradientLayer = [self gradientLayer]; 
CAShapeLayer *maskLine = [CAShapeLayer layer]; 
maskLine.path = [self sineWaveWithPoints:pointsArray].CGPath; 
maskLine.lineWidth = self.plotWidth; 
gradientLayer.mask = maskLine; 
[self.view.layer addSublayer:gradientLayer]; 

Więc chciałbym mieć gradientu sinusoidę między tych punktach. Co dokładnie jest nie tak w moich działaniach?

Idealny:

Answer 1

Program zachowuje się prawidłowo - to znaczy, że robi dokładnie to, co mówisz to zrobić. Problem polega na tym, że to, co mówisz, aby to zrobić (w twoim kodzie), nie jest tym, co mówisz, że chcesz (w twoich słowach i obrazie w twoim pytaniu).

Pierwsza rzecz, którą robisz źle: powiedziałeś closePath. Więc zamyka ścieżkę! Oznacza to, że po narysowaniu fali łączy ostatni punkt z pierwszym punktem z linią prostą, podając kształt, który pokazujesz.

Druga rzecz, którą robisz źle: nie możesz manipulować warstwą kształtu. Tworzysz wanilię CAShapeLayer i pozostawiasz ją domyślnie. Domyślnie jest to, że fillColor jest czarny (i nie ma strokeColor). Nie zmieniacie tego. Tak więc otrzymujesz swój (nieprawidłowy) kształt wypełniony kolorem czarnym i bez obrysu, a zatem wynikowa maska ​​jest kształtem wnętrza twojego (niewłaściwego) kształtu, podając kształt maski gradientu, który pokazujesz.