web-dev-qa-db-fra.com

Séparation entre l'en-tête et la première cellule - en clair UITableView

J'ai une table avec un style simple et une seule section. J'ai implémenté un viewForHeaderInSection: pour ajouter une vue personnalisée dans l'en-tête de section.

Je ne suis pas en mesure de voir une ligne de séparation entre ma vue d'en-tête de section de tableau et ma première cellule. [Voir l'image ci-jointe]

alt text

Qu'est-ce que je fais mal?

iosuitableviewcocoa-touchuikit
30
Abhinav

Les en-têtes et pieds de page personnalisés ne contiennent pas de séparateurs en dessous/au-dessus d'eux. Vous devrez implémenter le séparateur vous-même dans la vue personnalisée (ou basculer vers un style groupé, qui affichera le contour du groupe au-dessus et en dessous, même avec un en-tête/pied de page personnalisé).

33
Jeremy Fuller

Comme Jeremy le note dans sa réponse, iOS n'ajoute pas de séparateurs au-dessus/en dessous des en-têtes/pieds de page; vous pouvez simplement utiliser une UIView pour créer vous-même une ligne.

Voici le code pour ajouter une vue de séparation standard à une vue d'en-tête:

CGRect sepFrame = CGRectMake(0, headerView.frame.size.height-1, 320, 1);
seperatorView = [[[UIView alloc] initWithFrame:sepFrame] autorelease];
seperatorView.backgroundColor = [UIColor colorWithWhite:224.0/255.0 alpha:1.0];
[headerView addSubview:seperatorView];

Si vous essayez de la faire ressembler à une cellule de vue de table normale, vous devrez probablement en ajouter une en haut de la vue d'en-tête également.

41
JosephH

si vous souhaitez donner de l'espace uniquement entre l'en-tête du tableau et la première ligne du tableau, vous pouvez utiliser

Dans la méthode de tableView:heightForHeaderInSection:(NSInteger)section

if(section ==0)
    return 3; // (space u want to give between header and first row);

return 10; //(ur section header height)

Dans la méthode de tableView:viewForHeaderInSection:(NSInteger)section

  UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 3)];
  headerView.backgroundColor = [UIColor clearColor];   // use your own design

  return headerView;
11
Usman Nisar

Ajoutez une ligne supplémentaire "masquée" à la section à laquelle vous souhaitez ajouter le séparateur en retournant +1 le nombre de lignes existant dans tableView:numberOfRowsInSection:. Ajoutez ensuite la méthode suivante:

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    if ( indexPath.section == sectionOfHiddenRow && indexPath.row == indexOfHiddenRow )
        return 0.f;
    else
        return [super tableView:tableView heightForRowAtIndexPath:indexPath];
}

Si vous voulez que le séparateur soit en haut d'une section (après un en-tête), indexOfHiddenRow sera 0. Si vous le voulez au bas d'une section (avant un pied de page) ce sera [self tableView:tableView numberOfRowsInSection:sectionOfHiddenRow] - 1.

Maintenant à l'intérieur tableView:cellForRowAtIndexPath:, renvoyez simplement [UITableViewCell new] pour la ligne cachée (elle ne sera pas affichée, donc pas besoin de définir un cadre ou quoi que ce soit). Vous devrez peut-être faire quelques -1 ajustements d'index dans vos méthodes UITableViewDataSource et UITableViewDelegate, mais cela fonctionne (testé dans iOS 7), et garantit un style cohérent (pas besoin de dessiner le vôtre " faux "séparateur - c'est un vrai séparateur UITableView dessiné par le système).

5
devios1

J'ai étendu UITableViewCell avec quelques méthodes de séparation (dans Swift). Avec eux, je peux ajouter des séparateurs aux en-têtes ou les supprimer des cellules normales. J'espère que cela peut aider certaines personnes.

public extension UITableViewCell
{
    func addSeparator(y: CGFloat, margin: CGFloat, color: UIColor)
    {
        let sepFrame = CGRectMake(margin, y, self.frame.width - margin, 0.7);
        let seperatorView = UIView(frame: sepFrame);
        seperatorView.backgroundColor = color;
        self.addSubview(seperatorView);
    }

    public func addTopSeparator(tableView: UITableView)
    {
        let margin = tableView.separatorInset.left;

        self.addSeparator(0, margin: margin, color: tableView.separatorColor!);
    }

    public func addBottomSeparator(tableView: UITableView, cellHeight: CGFloat)
    {
        let margin = tableView.separatorInset.left;

        self.addSeparator(cellHeight-2, margin: margin, color: tableView.separatorColor!);
    }

    public func removeSeparator(width: CGFloat)
    {
        self.separatorInset = UIEdgeInsetsMake(0.0, width, 0.0, 0.0);
    }

}
2
Jorg B Jorge

Ajoutez un séparateur entre la vue d'en-tête et la première ligne: - En vue d'en-tête dans la méthode déléguée de la section, ajoutez une sous-vue self.separator // @ propriété (non anatomique, forte) UIImageView * séparateur;

- (CGFloat)tableView:(UITableView *)tableView
heightForHeaderInSection:(NSInteger)section {

return 41; 
}


- (UIView *)tableView:(UITableView *)tableView
viewForHeaderInSection:(NSInteger)section {

self.headerView = [[UIView alloc] init];
self.headerView.backgroundColor = [UIUtils colorForRGBColor:TIMESHEET_HEADERVIEW_COLOR];

self.separator = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"seperator.png"]];
self.separator.frame = CGRectMake(0,40,self.view.frame.size.width,1);
[self.headerView addSubview:self.separator];
return self.headerView;

}
1
YaBoiSandeep