Alterar o comportamento de rolagem padrão do cabeçalho da seção UITableView

Eu tenho um UITableView com duas seções. É uma visão simples da tabela. Estou usando o viewForHeaderInSection para criar modos de exibição personalizados para esses cabeçalhos. Por enquanto, tudo bem.

O comportamento de rolagem padrão é que, quando uma seção é encontrada, o cabeçalho da seção permanece ancorado abaixo da barra de navegação até que a próxima seção seja exibida.

Minha pergunta é a seguinte: posso alterar o comportamento padrão para que os cabeçalhos da seção NÃO fiquem ancorados na parte superior, mas role pela barra de navegação com o restante das linhas da seção?

Estou perdendo algo óbvio?

Obrigado.

A maneira que resolvi esse problema é ajustar o contentOffsetacordo com o contentInsetno UITableViewControllerDelegate(estende UIScrollViewDelegate) assim:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
       CGFloat sectionHeaderHeight = 40;
   if (scrollView.contentOffset.y<=sectionHeaderHeight&&scrollView.contentOffset.y>=0) {
       scrollView.contentInset = UIEdgeInsetsMake(-scrollView.contentOffset.y, 0, 0, 0);
   } else if (scrollView.contentOffset.y>=sectionHeaderHeight) {
       scrollView.contentInset = UIEdgeInsetsMake(-sectionHeaderHeight, 0, 0, 0);
   }
}

O único problema aqui é que ele perde um pouco de força ao rolar de volta para o topo.

{OBSERVAÇÃO: O "40" deve ter a altura exata do SEU cabeçalho da seção 0. Se você usar um número maior que a altura do cabeçalho da seção 0, verá que a sensação do dedo é afetada (tente "1000" e verá que o comportamento do salto é meio estranho no topo). se o número corresponder à altura do cabeçalho da seção 0, a sensação do dedo parecerá perfeita ou quase perfeita.}

Você também pode adicionar uma seção com zero linhas na parte superior e simplesmente usar o rodapé da seção anterior como cabeçalho da próxima.

Se eu fizesse isso, aproveitaria o fato de que UITableViews no estilo Plain tem os cabeçalhos fixos e os no estilo Agrupado não. Provavelmente, pelo menos, tentaria usar uma célula de tabela personalizada para imitar a aparência de células simples em uma tabela agrupada.

Na verdade, eu não tentei isso, por isso pode não funcionar, mas é o que eu sugiro fazer.

Sei que chega tarde, mas encontrei a solução definitiva!

O que você deseja fazer é se você tiver 10 seções, deixe o dataSource retornar 20. Use números pares para cabeçalhos de seção e números ímpares para o conteúdo da seção. algo assim

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    if (section%2 == 0) {
        return 0;
    }else {
        return 5;
    }
}

-(NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section {
    if (section%2 == 0) {
        return [NSString stringWithFormat:@"%i", section+1];
    }else {
        return nil;
    }
}

Voilá! : D

Há várias coisas que precisam ser feitas para resolver esse problema de maneira não hacky:

1. Defina o estilo de exibição da tabela como UITableViewStyleGrouped
2. Defina a visualização da tabela backgroundColorcomo[UIColor clearColor]
3. Defina a backgroundViewcélula de exibição em cada tabela como uma exibição vazia combackgroundColor [UIColor clearColor]
4. Se necessário, defina a visualização da tabela rowHeightadequadamente ou substitua tableView:heightForRowAtIndexPath:se as linhas individuais tiverem alturas diferentes.

Originalmente publicado Aqui , uma solução rápida usando o IB. O mesmo pode ser feito programaticamente, embora de maneira simples.

Uma maneira provavelmente mais fácil de conseguir isso (usando o IB):

Arraste um UIView para o TableView para torná-lo sua visualização de cabeçalho.

1. Defina a altura da visualização do cabeçalho como 100px
2. Defina o contentInset (superior) da tableview para -100
3. Os cabeçalhos de seção agora rolam como qualquer célula normal.

Algumas pessoas comentaram dizendo que esta solução oculta o primeiro cabeçalho, no entanto, eu não percebi esse problema. Funcionou perfeitamente para mim e foi de longe a solução mais simples que vi até agora.

Eu não estava satisfeito com as soluções descritas aqui até agora, então tentei combiná-las. O resultado é o seguinte código, inspirado em @awulf e @cescofry. Funciona para mim porque não tenho cabeçalho de exibição de tabela real. Se você já possui um cabeçalho de exibição de tabela, pode ser necessário ajustar a altura.

// Set the edge inset
self.tableView.contentInset = UIEdgeInsetsMake(-23.0f, 0, 0, 0);

// Add a transparent UIView with the height of the section header (ARC enabled)
[self.tableView setTableHeaderView:[[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 100.0f, 23.0f)]];

Basta alterar o estilo do TableView:

self.tableview = [[UITableView alloc] initwithFrame:frame style:UITableViewStyleGrouped];

Documentação UITableViewStyle :

UITableViewStylePlain- Uma exibição de tabela simples. Quaisquer cabeçalhos ou rodapés de seção são exibidos como separadores em linha e flutuam quando a exibição da tabela é rolada.

UITableViewStyleGrouped- Uma exibição de tabela cujas seções apresentam grupos distintos de linhas. Os cabeçalhos e rodapés da seção não flutuam.

Selecione o estilo de Visualização de tabela agrupada no Inspetor de atributos do tableView no storyboard.

Defina o headerView da tabela com uma vista transparente com a mesma altura do cabeçalho na vista de seção. Também inicie a visualização da tabela com um quadro na altura.

self.tableview = [[UITableView alloc] initWithFrame:CGRectMake(0, - height, 300, 400)];

UIView *headerView = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, width, height)] autorelease];
[self.tableView setTableHeaderView:headerView];

Encontrei uma solução alternativa, use a primeira célula de cada seção em vez de uma seção de cabeçalho real; essa solução não parece tão limpa, mas funciona tão bem que você pode usar uma célula de protótipo definida para a seção de cabeçalhos e no método cellForRowAtIndexPath solicite o indexPath.row == 0, se verdadeiro, use a célula protótipo da seção do cabeçalho; caso contrário, use a célula protótipo padrão.

Altere seu estilo do TableView:

self.tableview = [[UITableView alloc] initwithFrame:frame style:UITableViewStyleGrouped];

De acordo com a documentação da Apple para o UITableView:

UITableViewStylePlain- Uma exibição de tabela simples. Quaisquer cabeçalhos ou rodapés de seção são exibidos como separadores em linha e flutuam quando a exibição da tabela é rolada.

UITableViewStyleGrouped- Uma exibição de tabela cujas seções apresentam grupos distintos de linhas. Os cabeçalhos e rodapés da seção não flutuam. Espero que esta pequena mudança o ajude.

Agora que o estilo agrupado parece basicamente o mesmo do iOS 7 (em termos de nivelamento e plano de fundo), para nós, a melhor e mais fácil (ou seja, menos hacky) correção foi simplesmente mudar o estilo da visualização da tabela para agrupado. Fazer jack com contentInsets sempre foi um problema quando integramos uma barra de navegação com rolagem na parte superior. Com um estilo de exibição de tabela agrupada, parece exatamente o mesmo (com nossas células) e os cabeçalhos de seção permanecem fixos. Sem estranheza de rolagem.

Atribua uma inserção negativa ao seu tableView. Se você tem cabeçalhos de seção alta de 22px e não deseja que eles fiquem presos, logo após recarregar os dados, adicione:

self.tableView.contentInset = UIEdgeInsetsMake(-22, 0, 0, 0); 
self.tableView.contentSize = CGSizeMake(self.tableView.contentSize.width, self.tableView.contentSize.height+22); 

Funciona como um encanto para mim. Também funciona para rodapés de seção, basta atribuir a inserção negativa na parte inferior.

Eu adiciono a tabela a uma exibição de rolagem e isso parece funcionar bem.

Confira minha resposta aqui . Essa é a maneira mais fácil de implementar os cabeçalhos de seção não flutuantes sem hacks.

A resposta da @ LocoMike melhor se ajustou ao meu tableView, no entanto, ela quebrou ao usar rodapés também. Portanto, esta é a solução corrigida ao usar cabeçalhos e rodapés:

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    return (self.sections.count + 1) * 3;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    if (section % 3 != 1) {
        return 0;
    }
    section = section / 3;
    ...
}

- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section
{
    if (section % 3 != 0) {
        return nil;
    }
    section = section / 3;
    ...
}

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
    if (section % 3 != 0) {
        return 0;
    }
    section = section / 3;
    ...
}

- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section
{
    if (section % 3 != 2) {
        return 0;
    }
    section = section / 3;
    ...
}

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
    if (section % 3 != 0) {
        return nil;
    }
    section = section / 3;
    ...
}

- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section
{
    if (section % 3 != 2) {
        return nil;
    }
    section = section / 3;
    ...
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    int section = indexPath.section;
    section = section / 3;
    ...
}

Versão rápida da resposta @awulf, que funciona muito bem!

func scrollViewDidScroll(scrollView: UIScrollView) {
    let sectionHeight: CGFloat = 80
    if scrollView.contentOffset.y <= sectionHeight {
        scrollView.contentInset = UIEdgeInsetsMake( -scrollView.contentOffset.y, 0, 0, 0)
    }else if scrollView.contentOffset.y >= sectionHeight {
        scrollView.contentInset = UIEdgeInsetsMake(-sectionHeight, 0, 0, 0)
    }
}

Aprendi que apenas a configuração da propriedade tableHeaderView faz isso, ou seja:

 tableView.tableHeaderView = customView;

e é isso.