"Overlay" o.ä. soll durchsicht auf Bild dahinter bieten

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Mir ist Dein Vorgehen nicht ganz klar. Grundsätzlich solltest Du zwischen der Darstellung des Bildes und der Blende trennen. Noch einmal die unterschiedlichen Lösungswege:
    1. Du legst die Blende auf das Bild. Dann zeichnest Du den Rahmen und lässt das Innere transparent.
    2. Du legst das Bild vor einen Hintergrund in der Farbe der Blende. Da maskierst Du den verdeckten Bereich durch eine Maske aus. Für die Maske verwendest Du einen Layer den Du an theImageView.layer.mask zuweist. Für dieses Vorgehen brauchst Du nur eine Klasse für den Layer. Die Views sind Standardviews. Für die Animation kannst Du dann CoreAnimation verwenden.
    „Meine Komplikation hatte eine Komplikation.“

  • Ok. mein imageview hat wieder die standardklasse.

    Wie muss die Klasse für solch einen Layer aussehen? Dynamische Properties für x, y, usw. der Mask, oder? Und welche Methode muss ich dann zum einstellen von x,y, usw. nutzen?
    Hast du evtl. n Link wo eine Layerklasse für eine Maske beschrieben ist? In dem onlinebuch ist das für mich nicht ganz klar beschrieben...

  • Ich glaube wir reden aneinander vorbei. Oder ich checks einfach nicht. Den Link hab ich gelesen ja. Die 1. Antwort dort zeigt mir wie animiert wird.

    Es soll wie ein Schlüsselloch sein, das sich vergrößert. Nur rund.

    Hab jetzt ein neues Projekt aufgemacht um von Anfang an mein problem sauber aufzubauen.

    imageview hat bild.
    imageview bekommt maske mit

    Quellcode

    1. theImage.layer.mask = [self maskWithRect:theImage.layer.bounds];


    Quellcode

    1. - (CALayer *)maskWithRect:(CGRect)inRect {
    2. int radius = 50;
    3. int centerX = inRect.origin.x;
    4. int centerY = inRect.origin.y;
    6. CGMutablePathRef thePath = CGPathCreateMutable();
    7. CAShapeLayer *theMask = [CAShapeLayer layer];
    9. theMask.frame = inRect;
    10. theMask.fillColor = [UIColor blackColor].CGColor;
    12. //CGPathAddEllipseInRect(thePath, NULL, inRect);
    13. CGPathAddEllipseInRect(thePath, NULL,
    14. CGRectMake(centerX , centerY, 2*radius, 2*radius));
    17. theMask.path = thePath;
    18. CGPathRelease(thePath);
    19. return theMask;
    20. }
    Alles anzeigen


    Animation dann mit

    Quellcode

    1. NSTimeInterval duration = 5.5;// match this to the value of the UIView animateWithDuration: call
    3. [CATransaction begin];
    4. [CATransaction setValue:[NSNumber numberWithFloat:duration] forKey:kCATransactionAnimationDuration];
    6. self.theImage.layer.mask.position = CGPointMake(260, 260);
    7. self.theImage.layer.mask.bounds = CGRectMake(0, 0, 200, 200);
    9. [CATransaction commit];


    So gehts nicht. Er animiert nicht. Ist klar.

    Wenn ich jetzt ne eigene Layerklasse schreib, muss dann die Animation irgendwo in dieser Klasse rein? Und ich setz im Viewcontroller einfach bounds der maske?

    Ich frage mich ob ich der 1. bin mit dem Problem. Irgendwo muss es doch n Beispielprojekt geben...:)

  • Naja, da sind ein paar Kniffe notwendig. Vom Prinzip her klappt's aber. Da sich die Größe des Kreises mit den Bounds ändert, muss auch needsDisplayForKey: entsprechend angepasst werden. Das ist die ganze Layer-Implementierung:

    Quellcode

    1. ​@implementation CircleLayer
    3. + (BOOL)needsDisplayForKey:(NSString *)inKey {
    4. return [inKey isEqualToString:@"bounds"] || [inKey isEqualToString:@"position"] || [super needsDisplayForKey:inKey];
    5. }
    7. - (void)drawInContext:(CGContextRef)inContext {
    8. CGContextSetFillColorWithColor(inContext, [UIColor blackColor].CGColor);
    9. CGContextFillEllipseInRect(inContext, self.bounds);
    10. }
    12. @end
    Alles anzeigen

    So fügst Du den (geschlossenen) Layer hinzu:

    Quellcode

    1. UIView *theView = self.imageView;
    2. CGRect theBounds = theView.bounds;
    3. CGPoint theCenter = CGPointMake(CGRectGetMidX(theBounds), CGRectGetMidY(theBounds));
    4. CALayer *theLayer = [CircleLayer layer];
    6. theView.layer.mask = theLayer;
    7. theLayer.bounds = CGRectZero;
    8. theLayer.position = theCenter;


    und so öffnest Du ihn:

    Quellcode

    1. UIView *theView = self.imageView;
    2. CALayer *theLayer = theView.layer.mask;
    4. [CATransaction begin];
    5. [CATransaction setAnimationDuration:5.0];
    6. theLayer.bounds = theView.bounds;
    7. [CATransaction commit];
    „Meine Komplikation hatte eine Komplikation.“

  • Danke das sieht gut aus. Er macht auch alles, nur leider nicht animiert? (Muss man bounds im Layer nicht als dynamische property definieren? <- hab ich auch schon probiert)

    In meinem ViewController ist diese Methode zum Starten:

    Quellcode

    1. - (IBAction)startClicked:(id)sender {
    2. UIView *theView = self.theImage;
    3. CGRect theBounds = theView.bounds;
    4. CGPoint theCenter = CGPointMake(CGRectGetMidX(theBounds), CGRectGetMidY(theBounds));
    5. CALayer *theLayer = [CircleMaskLayer layer];
    7. theView.layer.mask = theLayer;
    8. theLayer.bounds = CGRectZero;
    9. theLayer.position = theCenter;
    12. [CATransaction begin];
    13. [CATransaction setAnimationDuration:5.0];
    15. theLayer.bounds = theView.bounds;
    17. [CATransaction commit];
    19. }
    Alles anzeigen