Modifier le comportement de défilement par défaut de l'en-tête de section UITableView

J'ai un UITableView avec deux sections. C'est une vue de table simple. J'utilise viewForHeaderInSection pour créer des vues personnalisées pour ces en-têtes. Jusqu'ici tout va bien.

Le comportement de défilement par défaut est que lorsqu'une section est rencontrée, l'en-tête de section reste ancré sous la barre de navigation, jusqu'à ce que la section suivante défile dans la vue.

Ma question est la suivante: puis-je changer le comportement par défaut de sorte que les en-têtes de section ne restent PAS ancrés en haut, mais plutôt défilent sous la barre de navigation avec le reste des lignes de section?

Est-ce que je rate quelque chose d'évident?

Merci.

La façon dont j'ai résolu ce problème est d'ajuster le en contentOffsetfonction du contentInsetdans UITableViewControllerDelegate(étend UIScrollViewDelegate) comme ceci:

- (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);
   }
}

Le seul problème ici est qu'il perd un peu de rebond lors du défilement vers le haut.

{REMARQUE: Le "40" doit être la hauteur exacte de votre en-tête de section 0. Si vous utilisez un nombre plus grand que la hauteur de votre en-tête de section 0, vous verrez que la sensation du doigt est affectée (essayez comme "1000" et vous verrez que le comportement de rebond est un peu bizarre en haut). si le nombre correspond à la hauteur de l'en-tête de la section 0, la sensation du doigt semble parfaite ou presque parfaite.}

Vous pouvez également ajouter une section avec zéro ligne en haut et simplement utiliser le pied de page de la section précédente comme en-tête pour la suivante.

Si c'était moi qui faisais cela, je profiterais du fait que UITableViews dans le style Plain a les en-têtes collants et ceux dans le style Grouped n'en ont pas. J'essaierais probablement au moins d'utiliser une cellule de tableau personnalisée pour imiter l'apparence des cellules simples dans un tableau groupé.

Je n'ai pas vraiment essayé cela, donc cela peut ne pas fonctionner, mais c'est ce que je suggérerais de faire.

Je sais qu'il arrive tard, mais j'ai trouvé la solution définitive!

Ce que vous voulez faire est si vous avez 10 sections, laissez la source de données renvoyer 20. Utilisez des nombres pairs pour les en-têtes de section et des nombres impairs pour le contenu de section. quelque chose comme ça

- (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á! :RÉ

Il y a plusieurs choses à faire pour résoudre ce problème de manière non hacky:

1. Définissez le style de vue de table sur UITableViewStyleGrouped
2. Réglez l'affichage du tableau backgroundColorde[UIColor clearColor]
3. Définissez la backgroundViewcellule de chaque vue de tableau sur une vue vide avecbackgroundColor [UIColor clearColor]
4. Si nécessaire, définissez la vue de la table de rowHeightmanière appropriée ou remplacez-la tableView:heightForRowAtIndexPath:si les lignes individuelles ont des hauteurs différentes.

Publié à l'origine ici , une solution rapide utilisant l'IB. La même chose peut être faite par programme mais tout simplement.

Un moyen probablement plus simple d'y parvenir (en utilisant IB):

Faites glisser un UIView sur votre TableView pour en faire sa vue d'en-tête.

1. Définissez la hauteur de la vue d'en-tête sur 100 px
2. Définissez le paramètre tableview contentInset (top) sur -100
3. Les en-têtes de section défileront désormais comme n'importe quelle cellule normale.

Certaines personnes ont commenté en disant que cette solution cache le premier en-tête, mais je n'ai remarqué aucun problème de ce type. Cela a parfaitement fonctionné pour moi et était de loin la solution la plus simple que j'ai vue jusqu'à présent.

Je n'étais pas satisfait des solutions décrites ici jusqu'à présent, j'ai donc essayé de les combiner. Le résultat est le code suivant, inspiré de @awulf et @cescofry. Cela fonctionne pour moi car je n'ai pas d'en-tête de vue tableau réel. Si vous disposez déjà d'un en-tête de vue tableau, vous devrez peut-être ajuster la hauteur.

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

Changez simplement le style de TableView:

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

Documentation UITableViewStyle :

UITableViewStylePlain - Une vue de table simple. Tous les en-têtes ou pieds de page de section sont affichés sous forme de séparateurs en ligne et flottent lorsque la vue de tableau est défilée.

UITableViewStyleGrouped - Une vue de table dont les sections présentent des groupes distincts de lignes. Les en-têtes et pieds de page de section ne flottent pas.

Sélectionnez le style de vue de tableau groupé dans l'inspecteur d'attributs de votre tableView dans le storyboard.

Définissez l'en-têteView du tableau avec une vue transparente avec la même hauteur de l'en-tête en vue en coupe. Lancez également la vue de table avec une image à la hauteur.

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

J'ai trouvé une solution alternative, utilisez la première cellule de chaque section à la place d'une vraie section d'en-tête, cette solution ne semble pas si propre, mais fonctionne si bien, vous pouvez utiliser une cellule prototype définie pour votre section d'en-têtes, et dans la méthode cellForRowAtIndexPath demandez l'indexPath.row == 0, si vrai, utilisez la cellule prototype de la section d'en-tête, sinon utilisez votre cellule prototype par défaut.

Changez votre style TableView:

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

Selon la documentation Apple pour UITableView:

UITableViewStylePlain - Une vue de table simple. Tous les en-têtes ou pieds de page de section sont affichés sous forme de séparateurs en ligne et flottent lorsque la vue de tableau est défilée.

UITableViewStyleGrouped - Une vue de table dont les sections présentent des groupes distincts de lignes. Les en-têtes et pieds de page de section ne flottent pas. J'espère que ce petit changement vous aidera.

Maintenant que le style groupé ressemble fondamentalement au style simple dans iOS 7 (en termes de planéité et d'arrière-plan), pour nous, la solution la meilleure et la plus simple (c'est-à-dire la moins hacky) était de simplement changer le style de la vue de tableau en groupé. Jacking avec contentInsets a toujours été un problème lorsque nous avons intégré une barre de navigation déroulante en haut. Avec un style de vue tableau groupé, il a exactement la même apparence (avec nos cellules) et les en-têtes de section restent fixes. Aucune bizarrerie de défilement.

Attribuez un insert négatif à votre tableView. Si vous avez des en-têtes de section haute de 22 pixels et que vous ne voulez pas qu'ils soient collants, juste après avoir rechargé les données, ajoutez:

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

Fonctionne comme un charme pour moi. Fonctionne également pour les pieds de page, attribuez simplement l'encart négatif en bas à la place.

J'ajoute le tableau à une vue de défilement et cela semble bien fonctionner.

Vérifiez ma réponse ici . C'est le moyen le plus simple d'implémenter les en-têtes de section non flottants sans aucun piratage.

La réponse de @ LocoMike correspondait le mieux à ma tableView, mais elle a également cassé lors de l'utilisation des pieds de page. Voici donc la solution corrigée lors de l'utilisation d'en-têtes et de pieds de page:

- (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;
    ...
}

Version rapide de @awulf answer, qui fonctionne très bien!

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)
    }
}

J'ai appris qu'il suffit de définir la propriété tableHeaderView, c'est-à-dire:

 tableView.tableHeaderView = customView;

et c'est tout.