UIView Maskierung zweier Layer führt zu unscharfer View

  • UIView Maskierung zweier Layer führt zu unscharfer View

    Hallo,

    ich habe mit Hilfe zweier Layer in einer UIView eine Maskierung realisiert.

    backgroundLayer erhält eine Textur
    maskLayer erhält eine primitive geometrische Form

    Wenn ich nun die Maske auf den BackgroundLayer lege erhalte ich zwar die gewünschte geometrische Form in ihrer Textur aber die Ränder sind unscharf - unabhängig davon ob ich nun eine Textur wähle oder eine Farbe für den BackgroundLayer.

    Nachfolgend poste ich mal den Code:

    PHP-Quellcode

    1. - (id)initWithFrame:(CGRect)frame {
    2. if ((self = [super initWithFrame:frame])) {
    3. UIImage *image = TEXTUR;
    5. // Initialize layers
    6. backgroundLayer = [[CALayer layer] retain];
    7. backgroundLayer.frame =
    8. CGRectMake(-(image.size.width - self.bounds.size.width) / 2.f,
    9. -(image.size.width - self.bounds.size.width) / 2.f,
    10. image.size.width,
    11. image.size.width);
    13. maskLayer = [[CALayer layer] retain];
    14. maskLayer.frame =
    15. CGRectMake((image.size.width - self.bounds.size.width) / 2.f,
    16. (image.size.width - self.bounds.size.width) / 2.f,
    17. self.bounds.size.width,
    18. self.bounds.size.height);
    20. // Create mask bitmap
    21. maskBitmapImage = [self createMaskBitmapImage];
    22. [self setMaskLayerContents];
    24. CGImageRef markerImage = image.CGImage;
    25. backgroundLayer.contents = (id)markerImage;
    27. [backgroundLayer setMask:maskLayer]; // Maskierung
    29. [self.layer addSublayer:backgroundLayer];
    30. }
    31. return self;
    32. }
    34. - (CGContextRef) createMaskBitmapImage {
    36. CGRect theBounds = self.bounds;
    37. CGFloat theRadius = CGRectGetWidth(theBounds) / 2.0;
    39. theBounds.size.width = 28;
    40. theBounds.size.height = 28;
    41. theBounds.origin.x = theRadius - (theBounds.size.width / 2.0);
    42. theBounds.origin.y = 24.;
    44. UIGraphicsBeginImageContext(self.bounds.size);
    45. CGContextRef theContext = UIGraphicsGetCurrentContext();
    46. CGContextSetFillColorWithColor(theContext, [UIColor colorWithWhite:1.0f alpha:1.0f].CGColor);
    47. CGContextSetLineWidth(theContext, 3.0);
    48. CGContextStrokeEllipseInRect(theContext, theBounds); // Scheibe
    49. CGContextSetShouldAntialias(theContext, YES);
    51. CGContextRetain(theContext);
    52. UIGraphicsEndImageContext();
    54. return theContext;
    55. }
    57. - (void) setMaskLayerContents {
    58. CGImageRef maskImage = CGBitmapContextCreateImage(maskBitmapImage);
    59. maskLayer.contents = (id)maskImage;
    60. [maskLayer needsDisplay];
    61. CGImageRelease(maskImage);
    62. }
    Alles anzeigen


    Das Ergebnis ist wirklich nicht zufridenstellen - man hat das gefühlt einen Schleier vor den Augen zu haben wenn man es sich anschaut.


    Wie kann ich das besser umsetzen?
    Oder was könnte die Ursache der Kantenunschärfe sein?


    Vielen Danke für eure Hilfe ;)

  • Thallius schrieb:

    Meistens kommt das wenn man bei seiner Koordinaten Berechnung auf halbe Koordinaten (oder eben nicht Ganzzahlige) kommt.

    Gruß

    Claus

    Naja, es sieht auf dem Retina Display unscharf aus.

    Zudem handelt es sich um einen Ring, den ich texturiert habe. Die Linienstärke beträgt 3 Pixel.

    Ich habe ganzzahlige Koordinaten.

    Bei jeder Maskierung habe ich diesen Effekt. Das sieht eher aus wie ein weicher Übergang der Rante - obwohl das ja eher scharfkantig sein sollte.

  • Okay,

    es ist wohl so das setMask: zwar eine dynamische Maskierung erlaubt aber ein etwas unsauberes Ergebnis liefert.

    Ich werde diese Technik etwas modifizieren bzw. zu setMask: eine eigene extension schreiben.


    Vielen Dank für eure Unterstützung ;)

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von OsnaTiger ()