2011-09-08 17 views
5

Sto sviluppando un'applicazione in cui voglio creare un effetto ombra simile a quello mostrato nell'immagine in basso in uitableviewcell.Come creare un effetto ombra in uitableviewcell?

enter image description here

come posso farlo? Alcun codice tutorial o campione? Ho controllato http://cocoawithlove.com/2009/04/easy-custom-uitableview-drawing.html, e alcuni altri.ma hanno ombra in fondo a uitableview con stessa altezza.e come aggiungere ai bordi laterali di ogni sezione contenente la data (non l'intera vista tabella). Posso creare l'ombra del dropdown in fondo. Ma per quanto riguarda i bordi laterali dell'ultima cella Uitableview di ogni sezione. E un modo è creare l'immagine e impostarla come sfondo di tableviewcell.Ma come ridimensionare l'immagine e apparirà corretta perché ogni sezione ha dinamica numero di voci. Una sezione ha solo 1 entrata e altre può contenere 15 o più voci (qui l'immagine è per l'intera sezione che contiene la data) .i può avere un'immagine separata solo per l'ultima tableviewcell di ogni sezione. Questo è so.ma c'è un approccio migliore o programmaticamente?

risposta

0

è possibile consultare la seguente link per effetto ombra in UITableView che vi aiuterà a

try this

Un pezzo fondamentale di una vista è che è strato che è un CALayer. È possibile accedervi tramite la proprietà strato di vista:

myView.layer

Negli CALayers documentazione hanno diverse proprietà che controllano l'ombra. Dovresti essere in grado di dire allo strato della barra di navigazione di proiettare un'ombra. Insieme agli strati di qualsiasi altro contenuto che vuoi gettare un'ombra.

myView.layer.shadowOffset 

myView.layer.shadowRadius 

Sarà necessario assicurarsi di aggiungere il quadro QuartzCore al progetto per accedere a questa proprietà

+0

Come ho già accennato in questione che questo non mi sta aiutando – Bhoomi

+0

controllare il mio codice di aggiornamento –

+0

so tutte queste cose. ma quello che sto dicendo è che con questo non sono in grado di crare l'ombra come mostrato nell'immagine. – Bhoomi

0

Sarà ciascuna sezione essere sempre della stessa dimensione? In caso affermativo, perché non si sottoclasse UITableViewCell per disegnare il notebook come elemento con l'ombreggiatura inclusa?

È inoltre possibile aggiungere una UIImageView trasparente su UITableView per ottenere gli angoli oscurati.

EDIT:

Questo effetto è un po 'complicato, si sta andando a voler esaminare come utilizzare UIBezierPaths (http://developer.apple.com/library/IOS/#documentation/UIKit/ Riferimento/UIBezierPath_class/Riferimento/Reference.html).

La parte superiore può essere un'immagine (gli anelli e l'effetto tabulazione). È quindi possibile disegnare il resto della cella nella funzione drawRect. (Questo è più efficiente dell'uso delle proprietà shadow nel layer che è importante in un UITableViewCell).

È necessario sovrascrivere la classe UITableViewCell e implementare una funzione drawRect: personalizzata.

Ecco po 'di codice per iniziare:

// 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]; 
    } 

Il codice non è il drag abbastanza and drop, è ancora necessario aggiungere le linee bianche, correggere alcuni formati, e modificare l'ultima cella e ombre per essere giusto Ma dovrebbe essere sufficiente per iniziare.

Cheers!

+0

qui ogni dimensione di sezione non è uguale.it è diversa e anche dinamica. – Bhoomi

+0

vedere la domanda aggiornata – Bhoomi

0

Dai un'occhiata al mio answer per una domanda simile, questa potrebbe essere una possibile soluzione al tuo problema! Modificando il percorso dell'ombra dovresti essere in grado di ottenere l'effetto ombra desiderato!

Problemi correlati