ios - ¿Celular de UITableView color seleccionado?

objective-c selection-color

Question

He creado un UITableViewCell personalizado. La vista de tabla muestra bien los datos. En lo que estoy atascado es cuando el usuario toca la celda de la vista de tabla, luego quiero mostrar el color de fondo de la celda distinto de los valores predeterminados [color azul] para resaltar la selección de la celda. Yo uso este código pero no pasa nada:

cell.selectedBackgroundView.backgroundColor=[UIColor blackColor];

Answer 1

Swift 3.0 extension

extension UITableViewCell {
    var selectionColor: UIColor {
        set {
            let view = UIView()
            view.backgroundColor = newValue
            self.selectedBackgroundView = view
        }
        get {
            return self.selectedBackgroundView?.backgroundColor ?? UIColor.clear
        }
    }
}

cell.selectionColor = UIColor.FormaCar.blue

Answer 2

Aquí están las partes importantes del código necesario para una tabla agrupada. Cuando se selecciona una de las celdas de una sección, la primera fila cambia de color. Sin establecer inicialmente el estilo de selección de celda en ninguno, se produce una doble recarga anónima cuando el usuario hace clic en fila0, donde la celda cambia a bgColorView, luego se desvanece y vuelve a cargar bgColorView de nuevo. Buena suerte y avísame si hay una forma más sencilla de hacerlo.

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

    static NSString *CellIdentifier = @"Cell";

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
    }

    if ([indexPath row] == 0) 
    {
        cell.selectionStyle = UITableViewCellSelectionStyleNone;

        UIView *bgColorView = [[UIView alloc] init];
        bgColorView.layer.cornerRadius = 7;
        bgColorView.layer.masksToBounds = YES;
        [bgColorView setBackgroundColor:[UIColor colorWithRed:.85 green:0 blue:0 alpha:1]];
        [cell setSelectedBackgroundView:bgColorView];

        UIColor *backColor = [UIColor colorWithRed:0 green:0 blue:1 alpha:1];
        cell.backgroundColor = backColor;
        UIColor *foreColor = [UIColor colorWithWhite:1 alpha:1];
        cell.textLabel.textColor = foreColor;

        cell.textLabel.text = @"row0";
    }
    else if ([indexPath row] == 1) 
    {
        cell.selectionStyle = UITableViewCellSelectionStyleNone;

        UIColor *backColor = [UIColor colorWithRed:1 green:1 blue:1 alpha:1];
        cell.backgroundColor = backColor;
        UIColor *foreColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:1];
        cell.textLabel.textColor = foreColor;

        cell.textLabel.text = @"row1";
    }
    else if ([indexPath row] == 2) 
    {
        cell.selectionStyle = UITableViewCellSelectionStyleNone;

        UIColor *backColor = [UIColor colorWithRed:1 green:1 blue:1 alpha:1];
        cell.backgroundColor = backColor;
        UIColor *foreColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:1];
        cell.textLabel.textColor = foreColor;

        cell.textLabel.text = @"row2";
    }
    return cell;
}

#pragma mark Table view delegate

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    NSIndexPath *path = [NSIndexPath indexPathForRow:0 inSection:[indexPath section]];
    UITableViewCell *cell = [tableView cellForRowAtIndexPath:path];
    [cell setSelectionStyle:UITableViewCellSelectionStyleBlue];

    [tableView selectRowAtIndexPath:path animated:YES scrollPosition:UITableViewScrollPositionNone];

}

- (void)tableView:(UITableView *)tableView didDeselectRowAtIndexPath:(NSIndexPath *)indexPath
{
    UITableViewCell *cell = [tvStat cellForRowAtIndexPath:indexPath];
    [cell setSelectionStyle:UITableViewCellSelectionStyleNone];
}

#pragma mark Table view Gestures

-(IBAction)singleTapFrom:(UIGestureRecognizer *)tapRecog
{

    CGPoint tapLoc = [tapRecog locationInView:tvStat];
    NSIndexPath *tapPath = [tvStat indexPathForRowAtPoint:tapLoc];

    NSIndexPath *seleRow = [tvStat indexPathForSelectedRow];
    if([seleRow section] != [tapPath section])
        [self tableView:tvStat didDeselectRowAtIndexPath:seleRow];
    else if (seleRow == nil )
        {}
    else if([seleRow section] == [tapPath section] || [seleRow length] != 0)
        return;

    if(!tapPath)
        [self.view endEditing:YES];

    [self tableView:tvStat didSelectRowAtIndexPath:tapPath];
}

Answer 3

Cree una celda personalizada para su celda de tabla y en la clase de celda personalizada. Coloque el código a continuación, funcionará bien. Debe colocar la imagen de color deseada en selectionBackground UIImage.

- (void)setSelected:(BOOL)selected animated:(BOOL)animated
{
    UIImage *selectionBackground = [UIImage imageNamed:@"yellow_bar.png"];
    UIImageView *iview=[[UIImageView alloc] initWithImage:selectionBackground];
    self.selectedBackgroundView=iview;
}

Answer 4

Creo que estaba en el camino correcto, pero de acuerdo con la definición de clase para selectedBackgroundView :

El valor predeterminado es nil para celdas en tablas de estilo simple (UITableViewStylePlain) y no nulo para las tablas de grupo de sección UITableViewStyleGrouped).

Por lo tanto, si está utilizando una tabla de estilo plano, deberá asignar-iniciar una nueva UIView tenga el color de fondo que desee y luego asignarlo a selectedBackgroundView .

Alternativamente, podrías usar:

cell.selectionStyle = UITableViewCellSelectionStyleGray;

si todo lo que querías era un fondo gris cuando se selecciona la celda. Espero que esto ayude.

Answer 5

El color de fondo de la selección de la celda de la vista de tabla se puede configurar a través del guión gráfico:

Answer 6

En Swift 4, también puede establecer el color de fondo de la celda de su tabla globalmente (tomado de here ):

let backgroundColorView = UIView()
backgroundColorView.backgroundColor = UIColor.red
UITableViewCell.appearance().selectedBackgroundView = backgroundColorView

Answer 7

En caso de clase celular personalizada. Sólo anular

- (void)setSelected:(BOOL)selected animated:(BOOL)animated {
    [super setSelected:selected animated:animated];

    // Configure the view for the selected state

    if (selected) {
        [self setBackgroundColor: CELL_SELECTED_BG_COLOR];
        [self.contentView setBackgroundColor: CELL_SELECTED_BG_COLOR];
    }else{
        [self setBackgroundColor: [UIColor clearColor]];
        [self.contentView setBackgroundColor: [UIColor clearColor]];
    }
}

Answer 8

Es fácil cuando el estilo de vista de tabla es simple, pero en estilo de grupo, es un pequeño problema, lo resuelvo mediante:

CGFloat cellHeight = [self tableView:tableView heightForRowAtIndexPath:indexPath];
UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, kGroupTableViewCellWidth+2, cellHeight)];
view.backgroundColor = kCommonHighlightedColor;
cell.selectedBackgroundView = view;
[view release];
UIRectCorner cornerFlag = 0;
CGSize radii = CGSizeMake(0, 0);
NSInteger theLastRow = --> (yourDataSourceArray.count - 1);
if (indexPath.row == 0) {
    cornerFlag = UIRectCornerTopLeft | UIRectCornerTopRight;
    radii = CGSizeMake(10, 10);
} else if (indexPath.row == theLastRow) {
    cornerFlag = UIRectCornerBottomLeft | UIRectCornerBottomRight;
    radii = CGSizeMake(10, 10);
}
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:view.bounds byRoundingCorners:cornerFlag cornerRadii:radii];
CAShapeLayer *shapeLayer = [CAShapeLayer layer];
shapeLayer.path = maskPath.CGPath;
view.layer.mask = shapeLayer;

noté el kGroupTableViewCellWidth, lo definí como 300, es el ancho del ancho de celda de vista de tabla de grupo en iPhone

Answer 9

Estoy usando iOS 9.3 y configurando el color a través del Storyboard o configurando cell.selectionStyle no funcionó para mí, pero el siguiente código funcionó:

UIView *customColorView = [[UIView alloc] init];
customColorView.backgroundColor = [UIColor colorWithRed:55 / 255.0 
                                                  green:141 / 255.0 
                                                   blue:211 / 255.0 
                                                  alpha:1.0];
cell.selectedBackgroundView = customColorView;

return cell;

Encontré esta solución here .

Answer 10

Lo siguiente funciona para mí en iOS 8.

Tengo que configurar el estilo de selección en UITableViewCellSelectionStyleDefault para que el color de fondo personalizado funcione. Si cualquier otro estilo, el color de fondo personalizado será ignorado. Parece que hay un cambio en los comportamientos ya que las respuestas anteriores deben establecer el estilo en ninguno en su lugar.

El código completo para la celda de la siguiente manera:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    static NSString *CellIdentifier = @"MyCell";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
    }

    // This is how you change the background color
    cell.selectionStyle = UITableViewCellSelectionStyleDefault;
    UIView *bgColorView = [[UIView alloc] init];
    bgColorView.backgroundColor = [UIColor redColor];
    [cell setSelectedBackgroundView:bgColorView];        
    return cell;
}

Answer 11

No hay necesidad de celdas personalizadas. Si solo desea cambiar el color seleccionado de la celda, puede hacer esto:

C objetivo:

UIView *bgColorView = [[UIView alloc] init];
bgColorView.backgroundColor = [UIColor redColor];
[cell setSelectedBackgroundView:bgColorView];

Rápido:

let bgColorView = UIView()
bgColorView.backgroundColor = UIColor.redColor()
cell.selectedBackgroundView = bgColorView

Swift 3:

let bgColorView = UIView()
bgColorView.backgroundColor = UIColor.red
cell.selectedBackgroundView = bgColorView

Edición: Actualizado para ARC

Editar: Agrega Swift 3

Answer 12

Para agregar el fondo para todas las celdas (usando la respuesta de Maciej):

for (int section = 0; section < [self.tableView numberOfSections]; section++) {
        for (int row = 0; row < [self.tableView numberOfRowsInSection:section]; row++) {
            NSIndexPath* cellPath = [NSIndexPath indexPathForRow:row inSection:section];
            UITableViewCell* cell = [self.tableView cellForRowAtIndexPath:cellPath];

            //stuff to do with each cell
            UIView *bgColorView = [[UIView alloc] init];
            bgColorView.backgroundColor = [UIColor redColor];
            [cell setSelectedBackgroundView:bgColorView];
        }
    } 

Answer 13

Para anular el UITableViewCell de setSelected también funciona.

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

    // Set background color
    let view = UIView()
    view.backgroundColor = UIColor.redColor()
    selectedBackgroundView = view
}

Answer 14

Para aquellos que solo quieren deshacerse del fondo gris seleccionado predeterminado, coloque esta línea de código en su función cellForRowAtIndexPath:

yourCell.selectionStyle = .None

Answer 15

Quiero señalar que el editor XIB le ofrece las siguientes opciones estándar:

Sección: azul / gris / ninguno

(La columna de la derecha con opciones, 4ª pestaña, primer grupo "Célula de vista de tabla", 4º subgrupo, el 1er de 3 elementos lee "Selección")

Probablemente, lo que desea hacer puede lograrse seleccionando la opción estándar correcta.

Answer 16

Según el color personalizado para una celda seleccionada en UITableView , excelente solución según la answer Maciej Swic

Solo para agregar a eso, usted declara la answer de Swic en la configuración de la celda generalmente en:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

Y para un efecto agregado, en lugar de los colores del sistema, puede usar valores RGB para una apariencia de color personalizada. En mi código así es como lo logré:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath 

} 

 static NSString *CellIdentifier = @"YourCustomCellName";
 MakanTableCell *cell = [self.tableView dequeueReusableCellWithIdentifier:CellIdentifier forIndexPath:indexPath];

// Configure the cell...

if (cell == nil) {

cell = [[[NSBundle mainBundle]loadNibNamed:@"YourCustomCellClassName" owner:self options:nil]objectAtIndex:0];
                    } 

UIView *bgColorView = [[UIView alloc] init];
bgColorView.backgroundColor = [UIColor colorWithRed:255.0/256.0 green:239.0/256.0 blue:49.0/256.0 alpha:1];
bgColorView.layer.cornerRadius = 7;
bgColorView.layer.masksToBounds = YES;
[cell setSelectedBackgroundView:bgColorView];


return cell;

}

Déjame saber si eso también funciona para ti. Puede meterse con el número de cornerRadius para los efectos en las esquinas de la celda seleccionada.

Answer 17

Si desea agregar un color resaltado personalizado a su celda (y su celda contiene botones, etiquetas, imágenes, etc.), seguí los siguientes pasos:

Por ejemplo, si quieres un color amarillo seleccionado:

1) Cree una vista que se ajuste a todas las celdas con un 20% de opacidad (con color amarillo) llamada, por ejemplo, backgroundselectedView

2) En el controlador de celda escribe esto:

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
     self.backgroundselectedView.alpha=1;
    [super touchesBegan:touches withEvent:event];
}

- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
{
    self.backgroundselectedView.alpha=0;
    [super touchesEnded:touches withEvent:event];
}

- (void)touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event
{
    self.backgroundSelectedImage.alpha=0;
    [super touchesCancelled:touches withEvent:event];
}

Answer 18

Si está utilizando un TableViewCell personalizado, también puede anular awakeFromNib :

override func awakeFromNib() {
    super.awakeFromNib()

    // Set background color
    let view = UIView()
    view.backgroundColor = UIColor.redColor()
    selectedBackgroundView = view
}

Answer 19

Si tiene una tabla agrupada con solo una celda por sección, solo agregue esta línea adicional al código: bgColorView.layer.cornerRadius = 10;

UIView *bgColorView = [[UIView alloc] init];
[bgColorView setBackgroundColor:[UIColor redColor]];
bgColorView.layer.cornerRadius = 10;
[cell setSelectedBackgroundView:bgColorView];
[bgColorView release]; 

No te olvides de importar QuartzCore.

Answer 20

Swift 3: para mí funcionó cuando lo pusiste en el método cellForRowAtIndexPath:

let view = UIView()
view.backgroundColor = UIColor.red
cell.selectedBackgroundView = view

Answer 21

Tengo un enfoque ligeramente diferente al de todos los demás, que refleja la selección al tacto en lugar de ser seleccionado. Tengo un UITableViewCell subclasificado. Todo lo que tiene que hacer es configurar el color de fondo en los eventos táctiles, que simula la selección al tocar, y luego configurar el color de fondo en la función setSelected. Establecer el color de fondo en la función selSelected permite deseleccionar la celda. Asegúrese de pasar el evento táctil al super, de lo contrario, la celda no actuará como si estuviera seleccionada.

override func touchesBegan(touches: NSSet, withEvent event: UIEvent) {
    self.backgroundColor = UIColor(white: 0.0, alpha: 0.1)
    super.touchesBegan(touches, withEvent: event)
}

override func touchesCancelled(touches: NSSet!, withEvent event: UIEvent!) {
    self.backgroundColor = UIColor.clearColor()
    super.touchesCancelled(touches, withEvent: event)
}

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

    // Configure the view for the selected state
    self.backgroundColor = selected ? UIColor(white: 0.0, alpha: 0.1) : UIColor.clearColor()
}

Answer 22

Trate de seguir el código.

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

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:[cellIdArray objectAtIndex:indexPath.row] forIndexPath:indexPath];

    // Configure the cell...
    cell.backgroundView =
    [[UIImageView alloc] init] ;
    cell.selectedBackgroundView =[[UIImageView alloc] init];

    UIImage *rowBackground;
    UIImage *selectionBackground;


    rowBackground = [UIImage imageNamed:@"cellBackgroundDarkGrey.png"];
    selectionBackground = [UIImage imageNamed:@"selectedMenu.png"];

    ((UIImageView *)cell.backgroundView).image = rowBackground;
    ((UIImageView *)cell.selectedBackgroundView).image = selectionBackground;



    return cell;
}

// Versión Swift:

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {


        let cell = tableView.dequeueReusableCell(withIdentifier: "cell")! as UITableViewCell


        cell.selectedBackgroundView = UIImageView()
        cell.backgroundView=UIImageView()

        let selectedBackground : UIImageView = cell.selectedBackgroundView as! UIImageView
        selectedBackground.image = UIImage.init(named:"selected.png");

        let backGround : UIImageView = cell.backgroundView as! UIImageView
        backGround.image = UIImage.init(named:"defaultimage.png");

        return cell


    } 

Answer 23

Un consejo más a la manera de Christian de mostrar el fondo de la esquina redondeada para la mesa agrupada.

Si uso cornerRadius = 10 para celda, muestra el fondo de selección redondeado de cuatro esquinas. No es lo mismo con la interfaz de usuario predeterminada de la vista de tabla.

Entonces, pienso en una manera fácil de resolverlo con cornerRadius . Como puede ver en los códigos de abajo, verifique la ubicación de la celda (parte superior, inferior, central o superior) y agregue una subcapa más para ocultar la esquina superior o inferior. Esto muestra exactamente el mismo aspecto con el fondo de selección de la vista de tabla predeterminada.

He probado este código con iPad splitterview . Puede cambiar la posición del cuadro de patchLayer como lo necesite.

Por favor, avíseme si hay una manera más fácil de lograr el mismo resultado.

if (tableView.style == UITableViewStyleGrouped) 
{
    if (indexPath.row == 0) 
    {
        cellPosition = CellGroupPositionAtTop;
    }    
    else 
    {
        cellPosition = CellGroupPositionAtMiddle;
    }

    NSInteger numberOfRows = [tableView numberOfRowsInSection:indexPath.section];
    if (indexPath.row == numberOfRows - 1) 
    {
        if (cellPosition == CellGroupPositionAtTop) 
        {
            cellPosition = CellGroupPositionAtTopAndBottom;
        } 
        else 
        {
            cellPosition = CellGroupPositionAtBottom;
        }
    }

    if (cellPosition != CellGroupPositionAtMiddle) 
    {
        bgColorView.layer.cornerRadius = 10;
        CALayer *patchLayer;
        if (cellPosition == CellGroupPositionAtTop) 
        {
            patchLayer = [CALayer layer];
            patchLayer.frame = CGRectMake(0, 10, 302, 35);
            patchLayer.backgroundColor = YOUR_BACKGROUND_COLOR;
            [bgColorView.layer addSublayer:patchLayer];
        } 
        else if (cellPosition == CellGroupPositionAtBottom) 
        {
            patchLayer = [CALayer layer];
            patchLayer.frame = CGRectMake(0, 0, 302, 35);
            patchLayer.backgroundColor = YOUR_BACKGROUND_COLOR;
            [bgColorView.layer addSublayer:patchLayer];
        }
    }
}

Answer 24

Yo uso el enfoque de abajo y funciona bien para mí,

class MyTableViewCell : UITableViewCell {

                var defaultStateColor:UIColor?
                var hitStateColor:UIColor?

                 override func awakeFromNib(){
                     super.awakeFromNib()
                     self.selectionStyle = .None
                 }

// if you are overriding init you should set selectionStyle = .None

                override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {
                    if let hitColor = hitStateColor {
                        self.contentView.backgroundColor = hitColor
                    }
                }

                override func touchesEnded(touches: Set<UITouch>, withEvent event: UIEvent?) {
                    if let defaultColor = defaultStateColor {
                        self.contentView.backgroundColor = defaultColor
                    }
                }

                override func touchesCancelled(touches: Set<UITouch>?, withEvent event: UIEvent?) {
                    if let defaultColor = defaultStateColor {
                        self.contentView.backgroundColor = defaultColor
                    }
                }
            }

Answer 25

para Swift 3.0:

override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
    let cell = super.tableView(tableView, cellForRowAt: indexPath)

    cell.contentView.backgroundColor = UIColor.red
}

Answer 26

Swift 4.x

Para cambiar el color de fondo de selección a cualquier color use Swift Extension

Cree la extensión de celda UITableView como se muestra abajo

extension UITableViewCell{

    func removeCellSelectionColour(){
        let clearView = UIView()
        clearView.backgroundColor = UIColor.clear
        UITableViewCell.appearance().selectedBackgroundView = clearView
    } 

}

Luego llame a removeCellSelectionColour () con una instancia de celda.

Answer 27

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    [tableView reloadData];
    UITableViewCell *cell=(UITableViewCell*)[tableView cellForRowAtIndexPath:indexPath];
    [cell setBackgroundColor:[UIColor orangeColor]];
}

Answer 28

-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
    UIView *view = [[UIView alloc] init];
    [view setBackgroundColor:[UIColor redColor]];
    [cell setSelectedBackgroundView:view];
}

Necesitamos configurar la vista de fondo seleccionada en este método.

Answer 29

[cell setSelectionStyle:UITableViewCellSelectionStyleGray];

Asegúrese de haber usado la línea anterior para usar el efecto de selección

Answer 30

override func setSelected(selected: Bool, animated: Bool) {
    // Configure the view for the selected state

    super.setSelected(selected, animated: animated)
    let selView = UIView()

    selView.backgroundColor = UIColor( red: 5/255, green: 159/255, blue:223/255, alpha: 1.0 )
    self.selectedBackgroundView = selView
}