web-dev-qa-db-fra.com

Comment personnaliser la couleur de fond d'un UITableViewCell?

J'aimerais personnaliser l'arrière-plan (et peut-être aussi la bordure) de tous les UITableViewCells dans mon UITableView. Jusqu'à présent, je n'ai pas été en mesure de personnaliser ces éléments. J'ai donc un groupe de cellules d'arrière-plan blanches qui est la valeur par défaut.

Y at-il un moyen de faire cela avec le SDK iPhone?

186
jpm

Vous devez définir la couleur d'arrière-plan de la propriété contentView de la cellule. Si vous utilisez des accessoires (tels que des flèches de révélation, etc.), ils apparaîtront en blanc. Vous devrez peut-être en créer une version personnalisée.

191
Ben Gottlieb

Voici le moyen le plus efficace que j'ai rencontré pour résoudre ce problème, utilisez la méthode déléguée willDisplayCell (elle gère également la couleur blanche pour l'arrière-plan de l'étiquette de texte lors de l'utilisation de cell.textLabel.text et/ou cell.detailTextLabel.text ):

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath { ... }

Lorsque cette méthode de délégation est appelée, la couleur de la cellule est contrôlée via la cellule plutôt que par la vue tableau, comme lorsque vous utilisez:

- (UITableViewCell *) tableView: (UITableView *) tableView cellForRowAtIndexPath: (NSIndexPath *) indexPath { ... }

Ainsi, dans le corps de la méthode de délégation de cellule, ajoutez le code suivant pour alterner les couleurs des cellules ou utilisez simplement l'appel de fonction pour que toutes les cellules du tableau aient la même couleur.

if (indexPath.row % 2)
{
    [cell setBackgroundColor:[UIColor colorWithRed:.8 green:.8 blue:1 alpha:1]];
}
else [cell setBackgroundColor:[UIColor clearColor]];

Cette solution a bien fonctionné dans mon cas ...

205
N.Berendt

C'est très simple, car OS 3.0 vient de définir la couleur d'arrière-plan de la cellule dans la méthode willDisplayCell. Vous ne devez pas définir la couleur dans cellForRowAtIndexPath.

Cela fonctionne à la fois pour le style simple et le style groupé:

Code:

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
    cell.backgroundColor = [UIColor redColor];
}

P.S: Voici l'extrait de documentation pour willDisplayCell:

"Une vue tabulaire envoie ce message à son délégué juste avant l’utilisation de la cellule pour dessiner une ligne, permettant ainsi au délégué de personnaliser l’objet cellule avant son affichage. Cette méthode permet au délégué de remplacer les propriétés basées sur l’état définies précédemment par la vue tabulaire, telle que la sélection et la couleur d'arrière-plan. Après le renvoi du délégué, la vue tabulaire définit uniquement les propriétés alpha et frame, puis uniquement lors de l'animation de lignes lors de l'insertion ou de la déconnexion de lignes. "

J'ai trouvé cette information dans ce post de colionel . Le remercier!

104
Seba

La meilleure approche que j'ai trouvée jusqu'à présent consiste à définir une vue d'arrière-plan de la cellule et à effacer l'arrière-plan des sous-vues de cellule. Bien sûr, cela a l'air bien sur des tables avec un style indexé seulement, peu importe avec ou sans accessoires.

Voici un exemple où le fond de la cellule est haché en jaune:

UIView* backgroundView = [ [ [ UIView alloc ] initWithFrame:CGRectZero ] autorelease ];
backgroundView.backgroundColor = [ UIColor yellowColor ];
cell.backgroundView = backgroundView;
for ( UIView* view in cell.contentView.subviews ) 
{
    view.backgroundColor = [ UIColor clearColor ];
}
58
Vladimir Grigorov

Mettez simplement ceci dans votre fichier de classe de délégué UITableView (.m):

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell  forRowAtIndexPath:(NSIndexPath *)indexPath 
{
    UIColor *color = ((indexPath.row % 2) == 0) ? [UIColor colorWithRed:255.0/255 green:255.0/255 blue:145.0/255 alpha:1] : [UIColor clearColor];
    cell.backgroundColor = color;
}
19
JAG

Je suis d'accord avec Seba, j'ai essayé de définir la couleur de ma ligne en alternance dans la méthode de délégué rowForIndexPath, mais les résultats étaient incohérents entre 3.2 et 4.2. Ce qui suit a très bien fonctionné pour moi.

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {

    if ((indexPath.row % 2) == 1) {
        cell.backgroundColor = UIColorFromRGB(0xEDEDED);
        cell.textLabel.backgroundColor = UIColorFromRGB(0xEDEDED);
        cell.selectionStyle = UITableViewCellSelectionStyleGray;
    }
    else
    {
        cell.backgroundColor = [UIColor whiteColor];
        cell.selectionStyle = UITableViewCellSelectionStyleGray;
    }

}
7
cipherz

Après avoir essayé toutes les solutions, la méthode suivante est la plus élégante. Changez la couleur dans la méthode déléguée suivante:

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
    if (...){
        cell.backgroundColor = [UIColor blueColor];
    } else {
        cell.backgroundColor = [UIColor whiteColor];
    }
}
6
Jim Huang

vlado.grigorov a quelques bons conseils - le meilleur moyen est de créer un backgroundView et de lui attribuer une couleur, en définissant tout le reste sur clearColor. De plus, je pense que c'est la seule façon de supprimer correctement la couleur (essayez son échantillon - mais définissez 'clearColor' au lieu de 'yellowColor'), ce que j'essayais de faire.

4
William Denniss

La personnalisation de l’arrière-plan d’une cellule de la table devient finalement une approche "tout ou rien". Il est très difficile de changer la couleur ou l'image utilisée pour l'arrière-plan d'une cellule de contenu d'une manière qui ne semble pas étrange.

La raison en est que la cellule couvre réellement la largeur de la vue. Les coins arrondis ne sont qu’une partie de son style de dessin et la vue du contenu se trouve dans cette zone.

Si vous modifiez la couleur de la cellule de contenu, vous obtiendrez des bits blancs visibles aux coins. Si vous changez la couleur de la cellule entière, vous aurez un bloc de couleur couvrant la largeur de la vue.

Vous pouvez certainement personnaliser une cellule, mais ce n’est pas aussi simple que vous pouvez le penser au début.

3
Andrew Grant

Pour prolonger la réponse de N.Berendt - Si vous souhaitez définir la couleur de la cellule en fonction d'un état dans l'objet de données de la cellule, vous configurez le reste des informations pour la cellule du tableau, qui correspond généralement au moment où vous vous trouvez. méthode cellForRowAtIndexPath, vous pouvez le faire en remplaçant la méthode willDisplayCell pour définir la couleur d’arrière-plan de la cellule à partir de la couleur d’arrière-plan de la vue contenu. où vous effectuez toute la personnalisation de votre autre cellule.

Donc: Si vous ajoutez cette méthode à votre délégué de vue table:

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
    cell.backgroundColor = cell.contentView.backgroundColor;
}

Ensuite, dans votre méthode cellForRowAtIndexPath, vous pouvez faire:

if (myCellDataObject.hasSomeStateThatMeansItShouldShowAsBlue) {
    cell.contentView.backgroundColor = [UIColor blueColor];
}

Cela évite d'avoir à récupérer vos objets de données à nouveau dans la méthode willDisplayCell et également d'avoir deux emplacements où vous personnalisez/personnalisez votre cellule de tableau - toute personnalisation peut aller à la méthode cellForRowAtIndexPath.

3
gamozzii

Créer une vue et la définir comme vue d'arrière-plan de la cellule

UIView *lab = [[UIView alloc] initWithFrame:cell.frame];
            [lab setBackgroundColor:[UIColor grayColor]];
            cell.backgroundView = lab;
            [lab release];
3
Senthil

Créez une image à utiliser comme arrière-plan avec Photoshop ou gimp et nommez-la myimage. Ajoutez ensuite cette méthode à votre classe tableViewController:

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
    UIImage *cellImage = [UIImage imageNamed:@"myimage.png"];//myimage is a 20x50 px with  gradient  color created with gimp
    UIImageView *cellView = [[UIImageView alloc] initWithImage:cellImage];
    cellView.contentMode = UIContentViewModeScaleToFill;
    cell.backgroundView = cellView;
    //set the background label to clear
    cell.titleLabel.backgroundColor= [UIColor clearColor];
}

Cela fonctionnera également si vous avez défini UITableView sur custom dans l'inspecteur d'attributs.

3
Davide

Ma solution consiste à ajouter le code suivant à l'événement cellForRowAtIndexPath:

UIView *solidColor = [cell viewWithTag:100];
if (!solidColor) {

    solidColor = [[UIView alloc] initWithFrame:cell.bounds];
    solidColor.tag = 100; //Big tag to access the view afterwards
    [cell addSubview:solidColor];
    [cell sendSubviewToBack:solidColor];
    [solidColor release];
}
solidColor.backgroundColor = [UIColor colorWithRed:254.0/255.0
                                             green:233.0/255.0
                                              blue:233.0/255.0
                                             alpha:1.0];

Fonctionne dans toutes les circonstances, même avec des boutons de divulgation, et il est préférable que votre logique agisse sur l'état de la couleur des cellules dans cellForRowAtIndexPath que dans l'événement cellWillShow, je pense.

2

Cela fonctionnera dans le dernier Xcode.

-(UITableViewCell *) tableView: (UITableView *) tableView cellForRowAtIndexPath: (NSIndexPath *) indexPath {
    cell.backgroundColor = [UIColor grayColor];
}
1
Sameera R.
    UIView *bg = [[UIView alloc] initWithFrame:cell.frame];
    bg.backgroundColor = [UIColor colorWithRed:175.0/255.0 green:220.0/255.0 blue:186.0/255.0 alpha:1]; 
    cell.backgroundView = bg;
    [bg release];
1
Bhavesh Nayi

Sous-classe UITableViewCell et ajoutez ceci dans l'implémentation:

-(void)layoutSubviews
{
    [super layoutSubviews];
    self.backgroundColor = [UIColor blueColor];
}
1
JonahGabriel

Essaye ça:

- (void)tableView:(UITableView *)tableView1 willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
    [cell setBackgroundColor:[UIColor clearColor]];
    tableView1.backgroundColor = [UIColor colorWithPatternImage: [UIImage imageNamed: @"Cream.jpg"]];
}
0
user4919266