Tweening/Interpolacja między dwoma CGPaths/UIBeziers

Question

Mam CAShapeLayer, który zawiera CGPath. Korzystając z wbudowanej animacji systemu iOS, można łatwo przekształcić tę ścieżkę w inną za pomocą animacji:

CABasicAnimation *morph = [CABasicAnimation animationWithKeyPath:@"path"]; 
    morph.fromValue = (id)myLayer.path; 
    mayLayer.path = [self getNewPath]; 
    morph.toValue = (id)myLayer.path; 
    morph.duration = 0.3; 
    [myLayer addAnimation:morph forKey:nil]; 

To działa idealnie.

Chciałbym jednak stopniowo zmieniać się między tymi ścieżkami podczas operacji przeciągania. Aby to zrobić, muszę mieć możliwość pobrania interpolowanej ścieżki w dowolnym momencie przeciągania. Czy istnieje sposób, aby poprosić o to system iOS?

Answer 1

Jest to o wiele prostsze niż na początku pomyślałeś i używasz animacji z "nie" prędkością (pauza). Teraz, po dodaniu animacji zatrzymanej do warstwy, możesz zmienić przesunięcie czasu, aby przejść do określonego czasu w animacji.

Jeśli nie planujesz uruchomienia animacji samodzielnie (tzn. Steruj nią ręcznie) sugerowałbym zmianę czasu trwania animacji na 1. Oznacza to, że zmieniasz przesunięcie czasowe z 0 na 1 podczas przenoszenia od 0% do 100%. Jeśli twój czas trwania wynosił 0,3 (jak w twoim przykładzie), zamiast tego ustawiałbyś przesunięcie czasowe na wartość między 0 a 0.3.

Realizacja

Jak powiedziałem wyżej, jest bardzo mało kod zaangażowany w tej małej sztuczki.

1. (Opcjonalnie) Ustaw czas trwania do 1,0
2. Ustawianie speed warstwy (tak one zgodne CAMediaTiming) lub animację do 0,0
3. podczas gestu przeciągania lub suwaka (jak w moim przykładzie) ustaw timeOffset warstwy lub animacji (w zależności od tego, co zrobiłeś w kroku 2).

ten sposób skonfigurowałem mojego animacji + kształt warstwy

CABasicAnimation *morph = [CABasicAnimation animationWithKeyPath:@"path"]; 
morph.duration = 1.; // Step 1 
morph.fromValue = (__bridge id)fromPath; 
morph.toValue = (__bridge id)toPath; 
[self.shapeLayer addAnimation:morph forKey:@"morph shape back and forth"]; 

self.shapeLayer.speed = 0.0; // Step 2 

a akcja suwak:

- (IBAction)sliderChanged:(UISlider *)sender { 
    self.shapeLayer.timeOffset = sender.value; // Step 3 
} 

można zobaczyć wynik końcowy poniżej. Szczęśliwe kodowanie!