2011-09-08 19 views
5

estoy desarrollando una aplicación en la que deseo crear un efecto de sombra similar al que se muestra en la imagen inferior en la parte inferior de la ventana uitableview.Cómo crear efecto de sombra en uitableviewcell?

enter image description here

¿Cómo puedo hacer eso? Cualquier código tutorial o muestra? He marcado http://cocoawithlove.com/2009/04/easy-custom-uitableview-drawing.html, y algunos otros.pero tienen sombra en la parte inferior de uitableview con la misma altura.y cómo agregar sombra en los bordes laterales de cada sección que contiene la fecha (no toda la tabla). Puedo crear la sombra desplegable en la parte inferior. Pero ¿qué pasa con los bordes laterales de la última celda uitableview de cada sección? y una forma es crear la imagen y establecerla como fondo de tableviewcell. Pero cómo cambiar el tamaño de la imagen y se verá bien porque cada sección tiene dinámica número de entradas. Una sección solo tiene 1 entrada y la otra puede contener 15 o más entradas. (Aquí la imagen es para la sección completa que contiene la fecha). Puedo tener una imagen separada para la última tabla de la vista de cada sección. Esto es lo que sé. ¿Hay algún mejor enfoque o hacerlo programáticamente?

Respuesta

0

puede vincular el siguiente enlace para efecto de sombra en UITableView que le ayudará a

try this

Una pieza fundamental de un punto de vista es que es una capa que es CALayer. Puede acceder a ella a través de la propiedad de capa de vistas:

myView.layer

En los CALayers documentación tienen varias propiedades que controlan la sombra. Debería poder decirle a la capa de la barra de navegación que proyecte una sombra. Junto con las capas de cualquier otro contenido que quiera proyectar una sombra.

myView.layer.shadowOffset 

myView.layer.shadowRadius 

Usted necesita estar seguro de añadir el marco QuartzCore a su proyecto para acceder a este inmueble

+0

Como ya he mencionado en duda de que esto no me está ayudando a – Bhoomi

+0

revisar mi código de actualización –

+0

sé todas estas cosas. pero lo que estoy diciendo es que con esto no puedo cargar la sombra según la imagen mostrada. – Bhoomi

0

¿Cada sección siempre será el mismo tamaño? Si es así, ¿por qué no subclasifica la UITableViewCell para dibujar el cuaderno como un elemento con la sombra paralela incluida?

También puede agregar un UIImageView transparente sobre el UITableView para obtener las esquinas oscuras.

EDIT:

Este efecto es un poco complicado, vas a querer mirar en cómo utilizar UIBezierPaths (http://developer.apple.com/library/IOS/#documentation/UIKit/ Reference/UIBezierPath_class/Reference/Reference.html).

La parte superior puede ser una imagen (los anillos y el efecto tabulador). Luego puede dibujar el resto de la celda en la función drawRect. (Esto es más eficiente que usar las propiedades de sombra en la capa que es importante en una UITableViewCell).

Deberá sobrescribir su clase UITableViewCell e implementar una función drawRect: personalizada.

Aquí hay algo de código para empezar:

// Only override drawRect: if you perform custom drawing. 
    // An empty implementation adversely affects performance during animation. 
    - (void)drawRect:(CGRect)rect 
    { 

     /* Draw top image here */ 

     //now draw the background of the cell. 
     UIBezierPath *path1 = [UIBezierPath bezierPathWithRect:CGRectMake(0, 0, 320, 50)]; 
     [[UIColor grayColor] set]; 
     [path1 fill]; 

     UIBezierPath *path2 = [UIBezierPath bezierPathWithRect:CGRectMake(0, 52, 320, 50)]; 
     [[UIColor whiteColor] set]; 
     [path2 fill]; 

     UIBezierPath *path3 = [UIBezierPath bezierPathWithRect:CGRectMake(0, 104, 320, 50)]; 
     [[UIColor grayColor] set]; 
     [path3 fill]; 

     UIBezierPath *path4 = [UIBezierPath bezierPathWithRect:CGRectMake(0, 156, 320, 50)]; 
     [[UIColor whiteColor] set]; 
     [path4 fill]; 

     //and so on... 

     //Let's draw the shadow behind the last portion of the cell. 
     UIBezierPath *shadow = [UIBezierPath bezierPathWithRect:CGRectMake(0, 208, 320, 52)]; 
     [[UIColor darkGrayColor] set]; 
     [shadow fill]; 

     //Finally, here's the last cell with a curved bottom 
     UIBezierPath *path5 = [UIBezierPath bezierPath]; 
     [path5 moveToPoint:CGPointMake(0, 208)]; 
     [path5 addLineToPoint:CGPointMake(320, 208)]; 
     [path5 addLineToPoint:CGPointMake(320, 258)]; 
     [path5 addCurveToPoint:CGPointMake(0, 258) controlPoint1:CGPointMake(160, 254) controlPoint2:CGPointMake(160, 254)]; 
     [[UIColor grayColor] set]; 
     [path5 fill]; 
    } 

El código no es arrastrar bastante y soltar, usted todavía tiene que añadir las líneas blancas, corregir algunos tamaños, y ajustar la última celda y la sombra de estar bien. Pero debería ser suficiente para comenzar.

¡Salud!

+0

aquí cada tamaño de sección no es lo mismo. También es diferente y dinámico. – Bhoomi

+0

ver la pregunta actualizada – Bhoomi

0

Eche un vistazo a mi answer a una pregunta similar, esta puede ser una posible solución a su problema! ¡Alterando la ruta de sombra, debería poder lograr el efecto de sombra deseado!

Cuestiones relacionadas