Angoli arrotondati su UITableView

Question

Qual è il modo migliore per arrotondare gli angoli su un intero UITableView come mostrato in Stock e Spotlight? Lo stile raggruppato non risolve il problema perché gli angoli arrotondati scorrono via con la cella. Sto provando a ritagliare la vista in modo che gli angoli siano sempre rotondi indipendentemente dalla posizione di scorrimento.

Ho visto un'altra discussione su come fare questo a un UIImage che suggeriva di mascherarlo con un'altra immagine. Non sono sicuro se questo funzionerebbe perché ho bisogno di rubinetti per passare al tavolo. Questo non è l'ideale per me perché voglio che il motivo di sfondo sia visibile attraverso gli angoli.

Answer 1

Hai provato lo stile di visualizzazione tabella "raggruppato"?

self.tableView.style = UITableViewStyleGrouped; 

Per ulteriori riferimenti, vedere Table View Programming Guide. Il capitolo "Informazioni sulle tabelle" contiene alcuni screenshot che descrivono i diversi stili.

Answer 2

Un altro modo sarebbe mascherare UITableView utilizzando Core Graphics. Un esempio di mascheramento di un UIView può essere trovato qui: http://iphonedevelopment.blogspot.com/2008/11/creating-transparent-uiviews-rounded.html

Answer 3

È una vecchia domanda ma forse vuoi ancora sapere come farlo.

Ho riprodotto una tabellaView come in Stock/Spotlight. Il trucco è

view.layer.cornerRadius = 10; 

Per farlo funzionare è necessario includere il QuartzCore nella classe che si chiama quella proprietà:

#import <QuartzCore/QuartzCore.h> 

ho sentito che questo funziona solo da OS 3.0. Ma dal momento che la mia applicazione utilizza i dati principali non era un problema perché era già per OS 3.0 e hight.

ho creato un'UIView personalizzato con una visualizzazione secondaria con cornerRadius 10 e con

view.backgroundColor = [UIColor clearColor]; 

Poi si deve inserire uno stile raggruppate UITableView in quella visualizzazione secondaria. È necessario impostare backgroundColor per clearColor e separatorColor per clearColor. Quindi devi posizionare la vista tabella all'interno della vista angolo arrotondata, ciò avviene impostando la dimensione e l'origine della cornice. La mia classe loadview della mia UIView personalizzato simile a questa:

self.view = [[UIView alloc] init]; 
self.view.backgroundColor = [UIColor clearColor]; 

CustomUIViewClass *scherm = [[CustomUIViewClass alloc] init]; 

CGRect frame; 
frame.origin.x = 10; 
frame.origin.y = 50; 
frame.size.width = 300; 
frame.size.height = 380; 

scherm.frame = frame; 
scherm.clipsToBounds = YES; 
scherm.layer.cornerRadius = 10; 

[self.view addSubview:scherm]; 

CustomUITableViewClass *table = [[CustomUITableViewClass alloc] initWithStyle:UITableViewStyleGrouped]; 

frame.origin.y = -10; 
frame.origin.x = -10; 
frame.size.width = 320; 
frame.size.height = 400; 

table.tableView.frame = frame; 
[scherm addSubview:table.tableView]; 

Spero che tu capisca il mio inglese, forse scriverò un breve post sul blog su questa tecnica con un progetto di esempio, vi posto il link qui quando sono pronto.

Answer 4

Recentemente mi sono imbattuto in questo problema e l'ho risolto in un modo diverso. Ho pensato di condividere i risultati con tutti.

Ho creato un UIView rettangolare con un interno chiaro e arrotondato, quindi posizionato sopra UITableView. Puoi trovare la descrizione completa al my programming blog.

Funziona esattamente come voglio io. Spero possa aiutare.

Answer 5

Ecco la soluzione che ho trovato. Combina una maschera di livello e un angolo di livelloRadius. Solo iPhone 3.x. Non ho perso tempo a cercare di far funzionare le barre di scorrimento, ma penso che non dovrebbe essere troppo difficile.

http://github.com/beetlebugorg/RoundedUITableView

Answer 6

Un modo più semplice per farlo è quello di importare semplicemente il quadro QuartzCore al progetto. #import <QuartzCore/QuartzCore.h> al vostro tableViewController e appena impostato

myTableView.layer.cornerRadius=5; 

Questo vi darà angoli arrotondati, senza dover aggiungere la Tableview a un Superview o clipping esso.

Answer 7

Bene, c'è un sacco di approccio per risolvere questo problema.

Tuttavia, nel mio caso, tutto non funziona correttamente. La mia tabella a volte è più piccola della dimensione della tabella.

Condividerò il modo in cui l'ho fatto. Credo che sia molto più facile e veloce di alcune opzioni sopra.

Crea il primo e l'ultimo elemento arrotondati.

• Creare CAShapeLayer per la parte superiore (left | destra) e inferiore (left | destra).

  shapeTop = [CAShapeLayer layer]; 
  shapeTop.path = [UIBezierPath 
  bezierPathWithRoundedRect:CGRectMake(0.0f, 0.0f, 306.0f, 58.0f) 
  byRoundingCorners:UIRectCornerTopLeft | UIRectCornerTopRight 
  cornerRadii:CGSizeMake(6.0f, 6.0f)].CGPath; 
  
  shapeBottom = [CAShapeLayer layer]; 
  shapeBottom.path = [UIBezierPath 
  bezierPathWithRoundedRect:CGRectMake(0.0f, 0.0f, 306.0f, 58.0f) 
  byRoundingCorners:UIRectCornerBottomLeft | UIRectCornerBottomRight 
  cornerRadii:CGSizeMake(6.0f, 6.0f)].CGPath; 
  

• La tabella deve essere backgroud clearColor;

• Le celle devono essere uno sfondo colorato;

• Impostare la layer.mask di esso

  UIView* backgroundView = [[UIView alloc] initWithFrame:CGRectZero]; 
  backgroundView.backgroundColor = [UIColor whiteColor]; 
  cell.backgroundView = backgroundView; 
  

• Non dimenticare #import <QuartzCore/QuartzCore.h>

Answer 8

Invece di violazione al sistema attraverso il codice, ecco un facile da imitare lo stile raggruppati. Funziona se tutto ciò che vuoi è una sezione.

In Interface Builder:

• Set stile UITableView a Pianura e rendere il telaio con un po 'imbottitura a sinistra ea destra, magari con x = 10 e width = 300.

Poi set il raggio d'angolo e il colore da soli:

#import <QuartzCore/QuartzCore.h> 

self.tableView.layer.borderColor = [UIColor colorWithWhite:0.6 alpha:1].CGColor; 
self.tableView.layer.borderWidth = 1; 
self.tableView.layer.cornerRadius = 4; 

Answer 9

di seguito il codice per la versione Swift:

012.351.

Assicurarsi di avere import QuartzCore nella sezione di importazione.