2013-08-22 12 views
6

mogę utworzyć maskę tak:Animowanie maski dla UIView

CALayer *mask = [CALayer layer]; 
    mask.contents = (id)[[UIImage imageNamed:@"mask.png"] CGImage]; 
    mask.frame = CGRectMake(0, 0, 10, 10); 
    self.content.layer.mask = mask; 

I to będzie poprawnie odsłonić górny lewy 10 pikseli mojego treści (bo mask.png jest tylko czarny obraz). Jednak chcę animowanie maskę, aby odsłonić resztę zawartości:

[UIView animateWithDuration:3.0 
        animations:^{ 
         mask.frame = self.content.bounds; 
        } 
        completion:^(BOOL finished){ 

        }]; 

Problem polega na tym, że nie ma animacji. Cała zawartość zostanie natychmiast wyświetlona. Dlaczego tak się dzieje i jak mogę animować maskę tak, aby zawartość została odsłonięta od lewej górnej strony?

Odpowiedz

14

Ramka jest właściwością pochodną różnych innych właściwości, takich jak położenie, ograniczenia, anchorPoint i wszelkie przekształcenia zastosowane do niego. Nie zaleca się bezpośredniego animowania tej właściwości, szczególnie w przypadku warstw o ​​niższym poziomie CoreAnimation.

W tym przypadku, zakładam, że chcesz animować granice. Możesz użyć powyższej metody animacji UIView, ale kiedy mam do czynienia bezpośrednio z CALayers wolę korzystać z metod animacji CoreAnimation.

CGRect oldBounds = mask.bounds; 
CGRect newBounds = self.content.bounds; 

CABasicAnimation* revealAnimation = [CABasicAnimation animationWithKeyPath:@"bounds"]; 
revealAnimation.fromValue = [NSValue valueWithCGRect:oldBounds]; 
revealAnimation.toValue = [NSValue valueWithCGRect:newBounds]; 
revealAnimation.duration = 3.0; 

// Update the bounds so the layer doesn't snap back when the animation completes. 
mask.bounds = newBounds; 

[mask addAnimation:revealAnimation forKey:@"revealAnimation"]; 
+0

To działa, częściowo. Teraz widzę animację. Jednak zatrzymuje się mniej więcej w połowie, zamiast ujawniać cały widok zawartości. Czy wiesz, dlaczego tak się dzieje? – soleil

+0

Nie jestem pewien, aby być szczerym; dwukrotnie sprawdź, czy wartość w granicach treści jest prawidłowa. Wypełnię odpowiedź, aby być nieco bardziej odporną. – WDUK

+0

Właściwie było to z powodu punktu kontrolnego (domyślnie 0.5, 0.5 z jakiegoś powodu). To naprawia: mask.anchorPoint = CGPointMake (0, 0); – soleil