Éliminez les séparateurs supplémentaires sous UITableView


715

Lorsque je configure une vue de table avec 4 lignes, il y a encore des lignes de séparateurs supplémentaires (ou des cellules vides supplémentaires) sous les lignes remplies.

Comment retirer ces cellules?

image pour les lignes de séparation supplémentaires dans UITableView

Réponses:


1506

Constructeur d'interface (iOS 9+)

Faites simplement glisser une UIView sur la table. Dans le storyboard, il se trouvera en haut sous vos cellules personnalisées. Vous préférerez peut-être l'appeler "pied de page".

Ici, il est affiché en vert pour plus de clarté, vous voudrez probablement une couleur claire.

Notez qu'en ajustant la hauteur, vous pouvez affecter la façon dont le "rebond inférieur" de la table est géré, comme vous préférez. (La hauteur zéro est généralement bonne).

entrez la description de l'image ici


Pour le faire par programme:

Rapide

override func viewDidLoad() {
    super.viewDidLoad()
    self.tableView.tableFooterView = UIView()
}

Objectif c

iOS 6.1+

- (void)viewDidLoad 
{
    [super viewDidLoad];

    // This will remove extra separators from tableview
    self.tableView.tableFooterView = [UIView new];
}

ou si vous préférez,

    self.tableView.tableFooterView = [[UIView alloc] initWithFrame:CGRectZero];

Historiquement sous iOS:

Ajouter au contrôleur de vue de table ...

- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section {
     // This will create a "invisible" footer
     return CGFLOAT_MIN;
 }

et si nécessaire ...

- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section
{        
    return [UIView new];

    // If you are not using ARC:
    // return [[UIView new] autorelease];
}

Je pense que vos descriptions et votre code sont inversés. Quoi qu'il en soit, cela a très bien fonctionné pour moi. J'utilise uniquement des pieds de page "réels" avec des tables groupées, j'ai donc ajouté if (tableView.style! = UITableViewStyleGrouped) {} ​​autour de votre code. Maintenant, toutes mes tables non groupées perdent leurs cellules supplémentaires, tandis que mes tables groupées ne sont pas affectées.
arlomedia

Suite à ma note ci-dessus, je vais ajouter un avertissement que si vous mettez des conditions dans la méthode viewForFooterInSection, assurez-vous que la méthode retourne soit une UIView ou nil. Si vous retournez accidentellement nul, votre application se bloquera!
arlomedia

4
@Mathieu Cela fonctionnera parce que si le tableau a un pied de page personnalisé, il ne créera pas de lignes "fantom" pour remplir la vue du tableau. Ainsi, vous allez créer une vue vide à utiliser comme pied de page et définir la hauteur à près de 0 (elle ne peut pas être nulle ou l'iOS ne la rendra pas). Avec cette astuce simple, vous modifierez le comportement par défaut.
J. Costa

2
@ j.Costa: votre solution ne fonctionnera qu'une seule fois lors de la création de uitableview. après avoir cliqué sur la dernière cellule, votre solution n'est pas plus bonne. veuillez améliorer votre réponse.

3
L'utilisation tableFooterViewlaisse un séparateur sur la dernière cellule de la ligne, car le tableau anticipe toujours le contenu sous cette cellule. L'utilisation de la méthode historique éliminera ce dernier séparateur et sera meilleure dans l'ensemble.
James Kuang

128

Voici une autre façon de le faire sans le style de tableau groupé, et que vous ne devineriez probablement pas. L'ajout d' un en-tête et d'un pied de page au tableau (peut-être que l'un ou l'autre suffit, n'a pas été vérifié) entraîne la disparition des séparateurs des lignes de remplissage / vides.

Je suis tombé dessus parce que je voulais un peu d'espace en haut et en bas des tables pour diminuer le risque de toucher des boutons au lieu d'une cellule de table avec des doigts charnus. Voici une méthode pour coller une vue vide en tant qu'en-tête et pied de page. Utilisez la hauteur de votre choix, vous éliminez toujours les lignes de séparation supplémentaires.

- (void) addHeaderAndFooter
{
    UIView *v = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 10)];
    v.backgroundColor = [UIColor clearColor];
    [self.myTableView setTableHeaderView:v];
    [self.myTableView setTableFooterView:v];
    [v release];
}

En réponse à @Casebash, je suis retourné au code dans mon application ("AcmeLists" List Manager dans iTunes Store ...) et j'ai court-circuité la méthode addHeaderAndFooter pour vérifier. Sans cela , j'ai les séparateurs de lignes supplémentaires; avec le code, j'ai ce que vous voyez dans cet instantané de fenêtre: aucune image de séparateurs de ligne de table . Je ne sais donc pas pourquoi cela n'aurait pas fonctionné pour vous. De plus, il est logique pour moi que d'avoir un pied de page personnalisé dans une vue de table devrait nécessairement arrêter de dessiner des séparateurs de lignes pour les lignes vides en dessous. Ce serait hideux. Pour référence, j'ai regardé des tableaux où il y avait plus de lignes que ce qui pouvait être affiché à l'écran, puis un tableau avec deux lignes. Dans les deux cas, pas de séparateurs étrangers.

Vos vues personnalisées n'ont peut-être pas été réellement ajoutées. Pour vérifier cela, définissez la couleur d'arrière-plan sur autre chose que clearColor, par exemple [UIColor redColor]. Si vous ne voyez pas de barres rouges au bas du tableau, votre pied de page n'est pas défini.


1
Vous pouvez également le faire dans IB. Faites simplement glisser une UIView en bas de TableView et réglez la hauteur sur 1.
Ortwin Gentz

70

Suppression de lignes de séparation supplémentaires pour les lignes vides dans UITableView dans Swift

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.
    self.yourTableview.tableFooterView = UIView()
}

34

Je voudrais étendre la réponse de wkw :

Ajouter simplement le pied de page avec une hauteur de 0 fera l'affaire. (testé sur sdk 4.2, 4.4.1)

- (void) addFooter
{
    UIView *v = [[UIView alloc] initWithFrame:CGRectZero];

    [self.myTableView setTableFooterView:v];
}

ou encore plus simple - où vous configurez votre tableview, ajoutez cette ligne:

//change height value if extra space is needed at the bottom.
[_tableView setTableFooterView:[[UIView alloc] initWithFrame:CGRectMake(0,0,0,0)]];

ou encore plus simple - pour supprimer simplement les séparateurs:

[_tableView setTableFooterView:[UIView new]];

Merci encore à wkw :)


Ceci est la bonne réponse, car dans les autres méthodes, la dernière ligne reste sans séparateur de ligne
Ankush

22

Pour iOS 7+ à l'aide de Storyboards

UIViewFaites simplement glisser un dans votre UITableViewcomme pied de page. Définissez la hauteur de la vue de pied de page sur 0.


18

Essaye ça. Cela a fonctionné pour moi:

- (void) viewDidLoad
{
  [super viewDidLoad];

  // Without ARC
  //self.tableView.tableFooterView = [[[UIView alloc] init] autorelease];

  // With ARC, tried on Xcode 5
  self.tableView.tableFooterView = [UIView new];
}

14

Pour Swift:

    override func viewDidLoad() {
        super.viewDidLoad()
        tableView.tableFooterView = UIView()
    }

11

Si vous utilisez Swift, ajoutez le code suivant pour viewDidLoad du contrôleur qui gère la table view:

override func viewDidLoad() {
    super.viewDidLoad()

    //...

    // Remove extra separators
    tableView.tableFooterView = UIView()
}

8

Vous pouvez simplement ajouter un pied de page vide à la fin, puis il masquera les cellules vides, mais il sera également très laid:

tableView.tableFooterView = UIView()

entrez la description de l'image ici

Il y a une meilleure approche: ajoutez une ligne de 1 point à la fin de la vue du tableau car le pied de page et les cellules vides ne seront également plus affichés.

let footerView = UIView()
footerView.frame = CGRect(x: 0, y: 0, width: tableView.frame.size.width, height: 1)
footerView.backgroundColor = tableView.separatorColor
tableView.tableFooterView = footerView

entrez la description de l'image ici


Très belle entrée, mais pas besoin de faire votre dernière cellule avec une couleur de séparateur épaisse en bas, au lieu de cela, faites-lui simplement la même couleur de fond de la cellule et elle disparaît également.
Gustavo Baiocchi Costa

Mais vous préférez. Mais je pense que le séparateur un peu "incomplet" a l'air assez moche.
Darko

7

ajoutez simplement ce code ( Swift ). .

tableView.tableFooterView = UIView()

1
Duplicata de nombreuses réponses, y compris la meilleure réponse wiki et la réponse de Sebastian
Cœur

7

Faire progresser la solution de J. Costa: Vous pouvez apporter une modification globale à la table en mettant cette ligne de code:

[[UITableView appearance] setTableFooterView:[[UIView alloc] initWithFrame:CGRectZero]];

à l'intérieur de la première méthode possible (généralement dans AppDelegate, dans: application:didFinishLaunchingWithOptions:méthode).


2
Soyez prudent avec celui-ci, il y a des cas où votre pied de page prévu peut être remplacé et vous passerez un jour ou deux à remettre en question votre santé mentale. De plus, tableFooterView n'est pas marqué avec UI_APPEARANCE_SELECTOR donc le comportement réel peut changer à tout moment.
mwright

6

Je sais que cette question a été acceptée, mais j'ai mis ici différentes façons de masquer la ligne de séparation supplémentaire de UITableView.

Vous pouvez masquer tableViewla ligne de séparation standard de, et ajouter votre ligne personnalisée en haut de chaque cellule.

Mise à jour:

La façon la plus simple d'ajouter un séparateur personnalisé est d'ajouter un simple UIViewd'une hauteur de 1px:

UIView* separatorLineView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 1)];
separatorLineView.backgroundColor = [UIColor grayColor]; /// may be here is clearColor;
[cell.contentView addSubview:separatorLineView];

OU

    self.tblView=[[UITableView alloc] initWithFrame:CGRectMake(0,0,320,370) style:UITableViewStylePlain];
    self.tblView.delegate=self;
    self.tblView.dataSource=self;
    [self.view addSubview:self.tblView];

    UIView *v = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 10)];
    v.backgroundColor = [UIColor clearColor];
    [self.tblView setTableHeaderView:v];
    [self.tblView setTableFooterView:v];
    [v release];

OU

- (float)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section {
    // This will create a "invisible" footer
    return 0.01f;
}

- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section
{
    // To "clear" the footer view
    return [[UIView new] autorelease];
}

OU La meilleure et simple façon que j'aime est

self.tableView.tableFooterView = [[UIView alloc] init];

Essayez l'un d'entre eux;


6

Vous pouvez trouver beaucoup de réponses à cette question. La plupart d'entre eux concernent la manipulation avec UITableViewl' tableFooterViewattribut de et c'est la bonne façon de cacher les lignes vides. Pour plus de commodité, j'ai créé une extension simple qui permet d'activer / désactiver les lignes vides d'Interface Builder. Vous pouvez le vérifier à partir de ce fichier gist . J'espère que cela pourrait vous faire gagner un peu de temps.

extension UITableView {

  @IBInspectable
  var isEmptyRowsHidden: Bool {
        get {
          return tableFooterView != nil
        }
        set {
          if newValue {
              tableFooterView = UIView(frame: .zero)
          } else {
              tableFooterView = nil
          }
       }
    }
}

Usage:

tableView.isEmptyRowsHidden = true

entrez la description de l'image ici


5

uitableview ligne de séparateur supplémentaire masquer les lignes de séparateur supplémentaires masquer dans swift 3.0

 self.tbltableView.tableFooterView = UIView(frame: .zero)

5

Si vous ne voulez pas de séparateur après la dernière cellule, vous avez besoin d'une hauteur proche de zéro mais non nulle pour votre pied de page.

Dans votre UITableViewDelegate:

func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
    return .leastNormalMagnitude
}

1
superbe! A travaillé pour moi !!
Antony Raphel


3

Ajoutez simplement une vue avec la couleur de séparation souhaitée comme couleur de fond, 100% de largeur, 1px de hauteur à la position x0 y-1 à votre tableViewCell. Assurez-vous que la tableViewCell ne coupe pas les sous-vues, à la place la tableView le devrait.

Ainsi, vous obtenez un séparateur simple et fonctionnel absolu uniquement entre les cellules existantes sans aucun piratage par code ou IB.

Remarque: sur un rebond vertical supérieur, le 1er séparateur apparaît, mais cela ne devrait pas être un problème car c'est le comportement iOS par défaut.


3

J'utilisais une vue tabulaire pour afficher un nombre fixe de lignes à hauteur fixe, je l'ai donc simplement redimensionné et rendu non défilable.


3

Pour éliminer les lignes de séparateur supplémentaires du bas de UItableview par programme, écrivez simplement les deux lignes de code suivantes et il en supprimera le séparateur supplémentaire.

tableView.sectionFooterHeight = 0.f;
tableView.sectionHeaderHeight = 0.f;

Cette astuce fonctionne pour moi tout le temps, essayez-vous.


2

J'ai eu de la chance en mettant en œuvre un seul morceau de la réponse acceptée (iOS 9+, Swift 2.2). J'avais essayé d'implémenter:

self.tableView.tableFooterView = UIView(frame: .zero)

Cependant, il n'y a eu aucun effet sur mon tableView- je crois que cela peut avoir quelque chose à voir avec le fait que j'utilisais UITableViewController.

Au lieu de cela, je n'ai eu qu'à remplacer la viewForFooterInSectionméthode (je n'ai pas défini tableFooterViewailleurs):

override func tableView(tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
    return UIView(frame: .zero)
}

Cela a bien fonctionné pour un tableViewavec une seule section (si vous avez plusieurs sections, vous devez spécifier la dernière).


2

Si vous n'avez qu'une seule section, le moyen le plus rapide et le plus simple consiste à définir simplement le style d'affichage de la table de "Normal" à "Groupé". (voir image)

TableView Grouped

Si vous avez plus de sections, vous devrez peut-être définir la hauteur de l'en-tête à zéro (selon le goût de votre / votre client / votre chef de projet)

Si vous avez plus de sections et que vous ne voulez pas jouer avec les en-têtes (même s'il ne s'agit que d'une seule ligne dans le cas le plus simple), vous devez définir un UIView comme pied de page, comme cela a été expliqué dans les réponses précédentes)


2

Extension Swift 4.0

Juste une petite extension pour le storyboard:

entrez la description de l'image ici

extension UITableView {
    @IBInspectable
    var hideSeparatorForEmptyCells: Bool {
        set {
            tableFooterView = newValue ? UIView() : nil
        }
        get {
            return tableFooterView == nil
        }
    }
}

2

Swift 4 voies rapide et facile.

override func viewDidLoad() {
     tableView.tableFooterView = UIView(frame: .zero)
}

Si vous avez des cellules statiques. Vous pouvez également désactiver le séparateur à partir de la fenêtre Inspecteur. (cela ne sera pas souhaitable si vous avez besoin du séparateur. Dans ce cas, utilisez la méthode indiquée ci-dessus) fenêtre d'inspecteur


La définition d'une nouvelle UIView sur tableFooterView a déjà été répondue 10 fois, avec de meilleures explications concernant pourquoi, un meilleur code (vous manquez super.viewDidLoad()) et est inclus dans la réponse wiki en haut. En ce qui concerne la suppression de tous les séparateurs, ce n'est vraiment pas le sujet de cette question, alors mieux vaut annuler votre dernière modification et / ou supprimer complètement votre réponse.
Cœur

1

Si vous souhaitez supprimer l'espace indésirable dans UITableview, vous pouvez utiliser ci-dessous deux méthodes

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
    return 0.1;
}
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section
{
    return 0.1;
}

1

J'ai ajouté cette petite extension tableview qui aide tout au long

extension UITableView {
     func removeExtraCells() {
         tableFooterView = UIView(frame: .zero)
     }
}

1

Essayez avec ça

pour l' objectif C

- (void)viewDidLoad 
 {
  [super viewDidLoad];
  // This will remove extra separators from tableview
  self.yourTableView.tableFooterView = [UIView new];
}

pour Swift

override func viewDidLoad() {
 super.viewDidLoad()
 self.yourTableView.tableFooterView = UIView()
}

0

Essaye ça

self.tables.tableFooterView = [[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 320.0f, 10.0f)];

0

UIKitne crée pas de cellule vide lorsque le tableViewa tableFooterView. Nous pouvons donc faire un tour et attribuer un UIViewobjet de hauteur nulle comme pied de page du tableView.

tableView.tableFooterView = UIView()

0

Si vous avez searchbardans votre view(pour limiter le nombre de résultats par exemple), vous devez également ajouter les éléments suivants dans shouldReloadTableForSearchStringetshouldReloadTableForSearchScope:

controller.searchResultsTable.footerView = [ [ UIView alloc ] initWithFrame:CGRectZero ];

0

Dans Swift (j'utilise 4.0), vous pouvez accomplir cela en créant une UITableViewCellclasse personnalisée et overridingla setSelectedméthode. Puis le separator insetstout à 0 . (ma classe principale avec la vue de table a un fond clair) couleur.

override func setSelected(_ selected: Bool, animated: Bool) {
    super.setSelected(selected, animated: animated)

    // eliminate extra separators below UITableView
    self.separatorInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
}
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.