Palestra sobre UITableView na MobileConf 2013

Palestra sobre UITableView na MobileConf 2013

Focando em boas práticas e performance, customizando da melhor maneira possível.

B2f7ffcd1c6fc9b6943b42b6e7572abb?s=128

Diego Chohfi

April 05, 2013
Tweet

Transcript

  1. @dchohfi 1 UITableView

  2. @dchohfi 2 Die o Chohfi Turini Instutor na Caelum Desenvolvedor

    na MakeYou @dchohfi
  3. @dchohfi 3 BusaoSP EpicLyrics

  4. @dchohfi 4 UITableView UITableViewStylePlain UITableViewStyleGrouped

  5. @dchohfi 5 UITableView UITableViewStylePlain muito rápido customizável UIScrollView

  6. @dchohfi 6 section } rows section } rows }NSIndexPath }NSIndexPath

  7. @dchohfi 7 UITableViewCell Header (UIView) Tudo é classe! Lembre-se que

    é orientado a objetos!
  8. @dchohfi 8 NSIndexPath informação UITableViewCell UITableViewCellStyle initWithStyle:reuseIdentifier:

  9. @dchohfi 9 <UITableViewDataSource> UITableView @interface DCViewController : UIViewController <UITableViewDataSource> self.tableView.dataSource

    = self;
  10. @dchohfi 10 - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section; - (UITableViewCell *)tableView:(UITableView *)tableView

    cellForRowAtIndexPath:(NSIndexPath *)indexPath; - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView;
  11. @dchohfi 11 100 linhas = 100 UITableViewCell UITableViewCell *cell =

    [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:@"Cell"];
  12. @dchohfi 12 UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Cell"]; dequeueReusableCellWithIdentifier: if(!cell){ cell

    = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:@"Cell"]; }
  13. @dchohfi 13 Ok, mas como sair disso:

  14. @dchohfi 14 Pra isso:

  15. @dchohfi 15

  16. @dchohfi 16 Primeiro de tudo: precisamos aprender a customizar uma

    célula @interface DCCustomCell : UITableViewCell @end
  17. @dchohfi 17 Podemos até criar um XIB pra ela :D

    desenhamos a tela alteramos a classe ta interface principal para a nossa customizada temos que LEMBRAR do identifier e para acessar os elementos visuais, criamos IBOutlet
  18. @dchohfi 18 e a API evoluiu bastante :D - (void)registerNib:(UINib

    *)nib forCellReuseIdentifier:(NSString *)identifier iOS > 5 e podemos remover um if! \o/ UINib *customNib = [UINib nibWithNibName:@"DCCustomCell" bundle:[NSBundle mainBundle]]; [self.tableView registerNib:customNib forCellReuseIdentifier:@"DCCustomCell"]; - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { DCCustomCell *cell = (DCCustomCell *)[tableView dequeueReusableCellWithIdentifier:@"DCCustomCell"]; ri istramos o novo xib na tabela
  19. @dchohfi 19

  20. @dchohfi 20 A ora precisamos melhorar a performance. Primeira re

    ra: NUNCA FAÇA DOWNLOAD SÍNCRONO NSURL *avatarURL = [NSURL URLWithString:user[@"profile_image_url"]]; self.avatar.image = [UIImage imageWithData:[NSData dataWithContentsOfURL:avatarURL]]; a cada download da imagem, tudo trava, inclusive seu usuário..
  21. @dchohfi 21 open source FTW!

  22. @dchohfi 22 SDWebIma e

  23. @dchohfi 23 Muito simples! [self.avatar setImageWithURL:[NSURL URLWithString:user[@"profile_image_url"]]];

  24. @dchohfi 24 Mas, ainda temos problema de performance cada subview

    é desenhada separadamente e a ora? temos que desenhar tudo de uma vez! sem xib :(
  25. @dchohfi 25 Podemos desenhar todos os conteúdos estáticos de uma

    vez só! NSString - (CGSize)drawAtPoint:(CGPoint)point forWidth:(CGFloat)width withFont:(UIFont *)font lineBreakMode:(NSLineBreakMode)lineBreakMode; - (void)drawRect:(CGRect)rect; quando a célula for desenhada UIImage - (void)drawInRect:(CGRect)rect;
  26. @dchohfi 26 Porém sempre que o conteúdo da célula mudar,

    precisamos mandar ela se redesenhar. - (void) setTweetData: (NSDictionary *) tweet { self.twitterData = tweet; NSURL *userAvatarUrl = [NSURL URLWithString:self.twitterData[@"user"][@"profile_image_url"]]; [self.avatar setImageWithURL:userAvatarUrl]; [self setNeedsDisplay]; } setNeedsDisplay
  27. @dchohfi 27

  28. @dchohfi 28 E quando queremos celulas com alturas variaveis? podemos

    saber o tamanho de um texto, com uma fonte, de maneira simples: - (CGSize)sizeWithFont:(UIFont *)font constrainedToSize:(CGSize)size; a ora nós temos o controle :D - (CGFloat) tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath NSString
  29. @dchohfi 29 Cuidados que precisamos tomar evitar desenhar elementos com

    coordenadas quebradas evitar desenhar todas as subviews, drawRect: FTW! reutilizar as celulas sempre que possível evitar sombras e bordas arredondas deixar tudo calculado antes
  30. @dchohfi 30 CUIDADO MANO!

  31. @dchohfi 31 10% de desconto nos livros da Cupom: MOBILECONF

    no site 10% de desconto nos cursos da Caelum também \o/
  32. @dchohfi 32 valeu galera :D