2012-05-13 8 views
5

Come posso modificare myLayer.contents con un insieme di immagini (ad esempio, il passaggio da img1 a img2) durante la traduzione? Grazie!modifica dell'immagine durante la traduzione

UIImage *myImage = [UIImage imageNamed:@"img1.png"]; 
CALayer *myLayer = [CALayer layer]; 
myLayer.contents = (id)myImage.CGImage; 
myLayer.Position = CGPointMake(0,0); 
myLayer.Bounds=CGRectMake(0.0, 0.0, 50, 50); 
[self.view.layer addSublayer:myLayer]; 

//translation1 
CGPoint startPt = CGPointMake(10,10); 
CGPoint endPt = CGPointMake(100,100);  
CABasicAnimation *transl1 = [CABasicAnimation animationWithKeyPath:@"position"]; 
transl1.removedOnCompletion = FALSE; 
transl1.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear]; 
transl1.fromValue = [NSValue valueWithCGPoint:startPt]; 
transl1.toValue = [NSValue valueWithCGPoint:endPt]; 
transl1.duration = 3; 
transl1.fillMode = kCAFillModeForwards; 
transl1.beginTime = 0; 
[myLayer addAnimation: transl1 forKey: nil]; 
+1

in realtà penso che intendesse la traduzione, in traduzione matematica si sta spostando un oggetto in una diversa coordinata – MCKapur

risposta

2

L'uomo a piedi esempio:

ho affrontato esattamente lo stesso compito, ma ho dovuto fare un ragno in esecuzione che è 6 gambe a piedi e ha 12 fotogrammi. In realtà era molto difficile da fare e mi ci sono voluti alcuni mesi per perfezionare. Il fatto è che l'esempio di uomo di veglia è di solito fatto impostando una serie di fotogrammi dell'immagine (prima gamba, ultima gamba) in una proprietà animationImages di UIImageView. Quindi si attiva e disattiva l'animazione insieme al movimento del personaggio a destra ea sinistra e creando così un'illusione di camminare. Ora il grande problema sorge quando vuoi creare un'illusione di accelerazione. Non c'è modo di modificare la durata dell'animazione DURANTE la riproduzione dell'animazione e questa è una battuta d'arresto importante che è molto difficile da superare.

Ecco il codice che ho prodotto per superare questo problema:

Qui si può definire un array con i telai delle gambe a piedi, cornice per passo.

animationImagesSpider = [NSArray arrayWithObjects: 
[UIImage imageNamed:@"[email protected]"], [UIImage imageNamed:@"[email protected]"], [UIImage imageNamed:@"[email protected]"], [UIImage imageNamed:@"[email protected]"], [UIImage imageNamed:@"[email protected]"], [UIImage imageNamed:@"[email protected]"], [UIImage imageNamed:@"[email protected]"], [UIImage imageNamed:@"[email protected]"], [UIImage imageNamed:@"[email protected]"], [UIImage imageNamed:@"[email protected]"], [UIImage imageNamed:@"[email protected]"], [UIImage imageNamed:@"[email protected]"], nil]; 

Qui si collega la matrice alla UIImageView:

imgViewSpider = [[UIImageView alloc] initWithFrame:CGRectMake(200,410,100,145)]; 
imgViewSpider.animationImages = animationImagesSpider; 

Ora, se è sufficiente chiamare [imgViewSpider startAnimating]; questo avvierà l'animazione ad una velocità costante fino a quando non la fermerai. Per superare questo ho usato una ricorsione che svolge una breve animazione per ogni passo e questo permette di regolare la durata tra ogni passi:

- (void) spiderRun { 

    imgViewSpider.animationDuration= 0.51-(accSp/3.5); 
    [imgViewSpider setAnimationRepeatCount:222]; /// this is a dummy value that has no effect because animtion ends after the first frame 
    [imgViewSpider startAnimating]; 
    [self performSelector:@selector(spiderRun) withObject:nil afterDelay: 0.5-(accSp/3.5)]; 

} 

Cambiando costantemente il valore accSp, posso controllare la velocità di passeggiata durante la camminata .

+0

grazie, ci proverò! ciao, Giuseppe – Beppino66

0

Sarà necessario creare una seconda animazione trasl2, questa animazione renderà lo scambio di immagini. Dovrai impostare la durata a metà della durata di transl1 in modo che cada nel mezzo dell'animazione transl1.

transl1.duration = 3

transl2.duration = 1,5

+0

grazie, è ok. Vorrei anche tornare a img1, e poi tornare a img2 .... per simulare un movimento ..... in quale parte del codice potrei dire questo? ciao – Beppino66

+0

Non è chiaro come cambiando le immagini si stimoli un movimento. –

+0

Scusami per la mia confusione ...ora so come spostare un livello sullo schermo, con traduzioni, rotazioni, ecc ... il problema è che il contenuto dell'ayer è la stessa immagine e vorrei cambiarlo durante l'animazione (ad esempio un uomo che cammina), quindi ho bisogno di passare da una serie di immagini: img1, img2, img1, img2 .... durante la traduzione ... – Beppino66

1

Come detto l'altro poster, creare una seconda animazione che anima la proprietà contenuti dello strato di una nuova immagine.

Suggerirei di inserire entrambe le animazioni in un gruppo di animazioni e di aggiungere il gruppo di animazioni al livello. Quindi puoi facilmente controllare sia la durata che l'ora di inizio di entrambe le animazioni. Puoi fare in modo che lo scambio di immagini avvenga su una parte della durata totale, programmato per essere eseguito nel mezzo dell'animazione.

Si imposta l'inizio dell'animazione utilizzando la proprietà beginTime e la durata con la proprietà duration.

+0

grazie mille Duncan! ciao – Beppino66