2011-05-28 12 views
6

He visto bastantes tutoriales sobre cómo desvanecer imágenes dentro y fuera del iPhone simplemente cambiando sus valores alfa (por ejemplo, here).iPhone - ¿es posible crear una animación que muestre una imagen desde el centro hacia afuera?

Eso está bien, sin embargo, estoy tratando de lograr algo ligeramente diferente; en lugar de que toda la imagen se desvanezca, la imagen se animará para que, con el tiempo, se muestre desde el centro de la imagen hasta el borde (y viceversa).

Por lo tanto, al comienzo de la animación me gustaría que la imagen no se muestre en la pantalla y luego durante la animación comenzando desde el centro, la imagen se muestra gradualmente hasta que llegamos al final y el todo la imagen se muestra en la pantalla.

No encuentro nada en ese sentido, ¿alguien sabe si eso sería posible en el iPhone? ¿Alguna idea/enlace que pueda ser útil?

Respuesta

4

Debería ser lo suficientemente fácil de lograr: cree un UIImageView que contenga la cosa, establezca contentMode en UIViewContentModeCenter y utilice un bloque CoreAnimation para animar un cambio en el fotograma de ser de ancho/alto cero centrado en ser el área completa quieres cubrir

E.g.

/* coming into here, imageView is a suitable UIImageView, 
    frameToFill is a CGRect describing the area the image 
    view should cover when fully unfurled */ 

// set up image view: content mode is centre so that the current 
// frame doesn't affect image sizing, and we'll be keeping the same 
// centre throughout so it won't move. The initial frame is on the 
// centre and of zero size. The view contents are clipped to the view's 
// bounds so that the changing frame does actually cut off the image 
imageView.contentMode = UIViewContentModeCenter; 
imageView.frame = CGRectMake(frameToFill.origin.x + frameToFill.size.width*0.5f, 
          frameToFill.origin.y + frameToFill.size.height*0.5f, 
          0.0f, 0.0f); 
imageView.clipsToBounds = YES; 

// set up an animation block, lasting 3 seconds, in which the 
// only thing animated is the view's frame, expanding back out 
// to the original 
[UIView beginAnimations:nil context:nil]; 
[UIView setAnimationDuration:3.0f]; 
    imageView.frame = frameToFill; 
[UIView commitAnimations]; 

El borde de la vista será duro y rectangular. Si quieres algo más sutil, probablemente no puedas lograrlo con CoreAnimation; bajar al nivel CoreGraphics es probablemente el orden del día.

+0

Hola Tommy, suena bien, cuando implemento lo anterior no hay ninguna animación, la imagen se muestra en el estado final (es decir, el cuadro está lleno de la imagen). He intentado agregar [UIView setAnimationDuration: 5]; a la animación en vano ¿Qué estoy haciendo mal? ¡Gracias por tu ayuda! – MattStacey

+3

@MattStacey Intenta establecer las propiedades 'imageView.clipsToBounds' y/o' imageView.layer.masksToBounds'. Por defecto, las subcapas no están recortadas. – benzado

+0

@benzado usando imageView.ClipsToBounds funcionó para mí, gracias. – MattStacey

2

Un simple (y, posiblemente, no el mejor) que hay que intentar (sin garantiza funciona) es crear un imageView y redondear las esquinas hasta que es circular, algo como esto:

[imageView.layer setCornerRadius:60.0f]; 
    [imageView.layer setMasksToBounds:YES]; 
    [imageView.layer setBorderWidth:0.0f]; 

Ajuste el imageView inicial pequeño (1px por 1px). A continuación, utilice un código de animación simple:

[UIView beginAnimations:nil context:NULL]; { 
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut]; 
    [UIView setAnimationDelay:2.0]; 
    [UIView setAnimationDuration:1.0]; 
    [UIView setAnimationDelegate:self]; 
    // set the imageView to the size you want here 
} [UIView commitAnimations]; 
0

Pruebe este código.

Crear una imageView.

UIImageView *imgv = [[UIImageView alloc]initWithFrame: 
              CGRectMake(0, 0, 0, 0)]; 
imgv.image = [UIImage imageNamed:@"black.png"]; 

//position the imageview to the center of the screen. 
imgv.center = self.view.center; 
    [self.view addSubview:imgv]; 
    [imgv release]; 

//now give the imageview a new frame of full size with an animation 

[UIView beginAnimations:nil context:nil]; 
[UIView setAnimationDuration:1.0]; 

//i am assuming that your full frame is 320x480 
    imgv.frame = CGRectMake(0, 0, 320, 480); 

[UIView commitAnimations]; 

Ahora la vista de la imagen parecerá estar escalando desde el centro de la pantalla para llenarla.

Cuestiones relacionadas