Background gradient

Question

Background gradient

Navigation

#1 by (2 votes)

2

I have a table which has custom cells,

Like the image, I have the background is gray, but my goal is that the gray is in gradients, I mean have a stronger gray from the right to the clear on the left, example image:

so far I have

I leave the class code of the cell:

    class PanelHomeTableViewCell: UITableViewCell {

    @IBOutlet weak var strLblTitleOptionsMenu: UILabel!
    @IBOutlet weak var imgOptionsMenu: UIImageView!
    override func awakeFromNib() {
        super.awakeFromNib()
        // Initialization code
    }

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

        // Configure the view for the selected state
    }



}

The Method where you set the gray background

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

    let mainCell = Bundle.main.loadNibNamed("PanelHomeTableViewCell", owner: self, options: nil)?.first as! PanelHomeTableViewCell
    mainCell.selectionStyle = .none
    // SETEO GRIS ; QUIERO DEGRADES
    mainCell.backgroundColor = Utils.Color.COLOR_E8E8E8

    mainCell.strLblTitleOptionsMenu.textColor = Utils.Color.COLOR_2B5034
    switch (indexPath.section)
    {

    case 0:

        mainCell.strLblTitleOptionsMenu.text=NSLocalizedString("strLblOption1",comment:"")
        mainCell.imgOptionsMenu.image = UIImage.init(named:"PagarMenu")
        return mainCell
    case 1:
        mainCell.strLblTitleOptionsMenu.text = NSLocalizedString("strLblOption2",comment:"")
        mainCell.imgOptionsMenu.image = UIImage.init(named:"BillingMenu")
        return mainCell
    case 2:
        mainCell.strLblTitleOptionsMenu.text = NSLocalizedString("strLblOption3",comment:"")
        mainCell.imgOptionsMenu.image = UIImage.init(named:"CollectionNotificationsMenu")
        return mainCell
    case 3:
        mainCell.strLblTitleOptionsMenu.text = NSLocalizedString("strLblOption4",comment:"")
        mainCell.imgOptionsMenu.image = UIImage.init(named:"billingQueryMenu")
        return mainCell
    case 4:
        mainCell.strLblTitleOptionsMenu.text = NSLocalizedString("strLblOption5",comment:"")
        mainCell.imgOptionsMenu.image = UIImage.init(named:"MovsBalanceMenu")
        return mainCell
    case 5:
        mainCell.strLblTitleOptionsMenu.text = NSLocalizedString("strLblOption6",comment:"")
        mainCell.imgOptionsMenu.image = UIImage.init(named:"CashOutMenu")
        return mainCell
    default:
        break
    }
    return mainCell
}

I use xcode with swift

swift xcode

asked by Bruno Sosa Fast Tag 18.04.2018 в 19:18

source

1 answer

Many-to-many relationships postgrest, consultation to take out in a single row How to join two Arrangements? C ++

score 2 · Accepted Answer

To apply a background with color gradient to your cell you can use the following extension:

extension UIView {
    /** Aplica un gradiente a la instancia. Pueden haber 2 o más colores. El sistema de coordenadas del gradiente es como el que se muestra en la siguiente figura.

            (0,0)____(1,0)
                |    |
                |    |
            (1,0)----(1,1)
    */
     /// - Parameter colores: Arreglo de los colores usados por el gradiente. Default: blanco y gris
     /// - Parameter ubicaciones: Arreglo conteniendo las ubicaciones de los colores. Default: nil.
     /// - Parameter puntoInicial: CGPoint del punto de inicio del gradiente. The minValue(x = 0, y = 0) maxValue(x = 1, y = 1). DefaultValue(x = 0, y = 1)
     /// - Parameter puntoFinal: CGPoint del punto final del gradiente. The minValue(x = 0, y = 0) maxValue(x = 1, y = 1). DefaultValue(x = 1, y = 0)
     func aplicarGradiente(colores: [UIColor] = [.white,.gray], ubicaciones: [NSNumber]? = nil,puntoInicial: CGPoint = CGPoint(x: 0, y: 1), puntoFinal : CGPoint = CGPoint(x: 1, y: 0)) {
        let gradient: CAGradientLayer = CAGradientLayer()
        gradient.frame = self.bounds
        gradient.name = "gradientLayer"
        gradient.colors = colores.map { $0.cgColor }
        gradient.locations = ubicaciones
        gradient.startPoint = puntoInicial
        gradient.endPoint = puntoFinal
        self.layer.insertSublayer(gradient, at: 0)
     }
}

And to use it, it would be as follows:

view.aplicarGradiente(colores: [.white, .gray])

or in your case it would be

cell.aplicarGradiente(colores: [.white, .gray], puntoInicial: CGPoint.init(x: 0, y: 0.5), puntoFinal: CGPoint.init(x: 1, y: 0.5))