2011-04-18 14 views
8

¿cómo se podría proceder a sobreponer una especie de imagen de máscara encima de UIScrollView?Superposición de máscara en UIScrollView

Por ejemplo, tengo una imagen con negro en el desvanecimiento izquierdo y derecho en blanco en el centro. Me gustaría utilizar esto para que los elementos en mi vista de desplazamiento gradualmente se desvanezcan a los lados y el elemento central sea completamente opaco.

Además, el fondo de la vista en la que se coloca la vista de desplazamiento es una imagen (no un color sólido) que es dinámica y puede cambiar.

¿Alguna idea?

Respuesta

0

Si tiene un fondo de color sólido detrás de la vista de desplazamiento, obtendrá un mejor rendimiento simplemente superponiendo una imagen en la parte superior de la vista de desplazamiento en lugar de tratar de realizar una máscara dentro de ella.

+0

Sí, estaba pensando en eso. Lamentablemente, en este caso necesitaré una imagen como fondo, y la imagen de fondo también debe ser dinámica. – Nick

0

Probar algo en este sentido:

// I assume you are in a UIViewController and self.view is set to some kind of view 

UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, 320, 420)]; 
scrollView.backgroundColor = [UIColor redColor]; 
[self.view addSubview: scrollView]; 
[scrollView release]; 

// add img with gradient 
UIImageView *imgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"my-gradient.png"]; 
imgView.frame = CGRectMake(0, 0, 160, 420); 
[self.view addSubview: imgView]; 
[imgView release]; 

Esto le daría un gradiente que comienza a la izquierda y va todo el camino hasta el centro de toda la altura, en el supuesto de que "mi-gradient.png" es una imagen que en realidad contiene un degradado.

0

Este tipo de manipulaciones son grandes consumidores de recursos. El mejor enfoque sería (si tu caso lo permite) colocar una imagen de máscara SOBRE tu UIScrollView. El fondo de esta imagen debe ser transparente (por ejemplo, png32) y la imagen debe ser un gradiente alfa.

0

Uso insertView: YourView atIndex: 0

4

Su pregunta terminó siendo la mejor fuente que pude encontrar en el problema de fondo, por lo que decidí publicar mi solución aquí.

Si agrega la máscara directamente a la vista de desplazamiento, termina aplicando la máscara al contenido por alguna razón: i. mi. la transparencia no cambia a medida que se desplaza. De acuerdo con las sugerencias de otras publicaciones, pongo el degradado en una vista sobre (o más bien, que contiene) la vista de desplazamiento. Como resultado, scrollContainer es un UIViewObject cuya única subvista es la vista de desplazamiento en cuestión.

Esta máscara está configurada para desplazamiento de izquierda a derecha. Podrías cambiarlo de arriba a abajo manipulando las propiedades de inicio y fin del gradiente.

El único inconveniente es que esto también recorta el indicador de la barra de posición de desplazamiento de la vista de desplazamiento. Como mi escenario no necesita uno, es aceptable, pero su kilometraje puede variar.

CAGradientLayer *gradient = [CAGradientLayer layer]; 
gradient.frame = scrollView.bounds; 
gradient.colors = [NSArray arrayWithObjects: 
        (id)[[UIColor colorWithWhite:0 alpha:0] CGColor], 
        (id)[[UIColor colorWithWhite:0 alpha:1] CGColor], 
        (id)[[UIColor colorWithWhite:0 alpha:1] CGColor], 
        (id)[[UIColor colorWithWhite:0 alpha:0] CGColor], nil]; 
gradient.locations=[NSArray arrayWithObjects: 
        [NSNumber numberWithFloat:0], 
        [NSNumber numberWithFloat:.1], 
        [NSNumber numberWithFloat:.9], 
        [NSNumber numberWithFloat:1], nil]; 
gradient.startPoint=CGPointMake(0, .5); 
gradient.endPoint=CGPointMake(1, .5); 
[scrollContainer.layer setMask:gradient]; 
+0

asegúrate de tener QuartzCore en tus Linked Frameworks y bibliotecas –