Come impostare il colore del bordo personalizzato di UIView a livello di codice?


Risposte:


202

Se usi Swift 2.0+

self.yourView.layer.borderWidth = 1
self.yourView.layer.borderColor = UIColor(red:222/255, green:225/255, blue:227/255, alpha: 1).cgColor

Nota: questo non sembra funzionare per me (forse perché sono su swift 3.1?). La versione di Paras Joshi ( stackoverflow.com/a/29701061/225813 ) ha funzionato però
Ashley Coolman

Ho modificato la mia risposta. sicuramente funzionerà per te .. Ashley Coolman
Shashi Verma

1
Non è necessario chiamare init esplicitamente in swift 3.
ibrahimab

È possibile utilizzare più di un colore?
Gökhan Çokkeçeci

3
C'è qualche differenza tra le tue due versioni?
Fogmeister

88

In Swift 4 puoi impostare il colore e la larghezza del bordo su UIControls utilizzando il codice sottostante.

let yourColor : UIColor = UIColor( red: 0.7, green: 0.3, blue:0.1, alpha: 1.0 )
yourControl.layer.masksToBounds = true
yourControl.layer.borderColor = yourColor.CGColor
yourControl.layer.borderWidth = 1.0

<Swift 4 , puoi impostare la larghezza e il colore del bordo di UIView utilizzando il codice sottostante.

yourView.layer.borderWidth = 1

yourView.layer.borderColor = UIColor.red.cgColor

1
@ShashiVerma sei il benvenuto. Per dettagli approfonditi sui livelli, leggi i documenti di riferimento della classe di diversi oggetti di Apple, in modo che sia utile anche per te :)
Paras Joshi

16

Usa @IBDesignable e @IBInspectable per fare lo stesso.

Sono riutilizzabili, facilmente modificabili da Interface Builder e le modifiche si riflettono immediatamente nello Storyboard

Conforma gli oggetti nello storyboard alla classe particolare

Snippet di codice:

@IBDesignable
class CustomView: UIView{

@IBInspectable var borderWidth: CGFloat = 0.0{

    didSet{

        self.layer.borderWidth = borderWidth
    }
}


@IBInspectable var borderColor: UIColor = UIColor.clear {

    didSet {

        self.layer.borderColor = borderColor.cgColor
    }
}

override func prepareForInterfaceBuilder() {

    super.prepareForInterfaceBuilder()
}

}

Consente una facile modifica da Interface Builder:

Costruttore di interfacce


Mi piace di più questa soluzione poiché è riutilizzabile in cui impostiamo UIView su customview ma lascia ancora spazio a ulteriori modifiche.
n0rm

Questo era il mio modo preferito per ottenerlo, ma con la modalità oscura non funziona davvero bene. Ottiene lo stile di colore dell'attuale MacOS e utilizza statico. Ma integrato @IBDesignablee @IBInspectabletutto funziona bene, quindi dovrebbe esserci un modo per la dogana di utilizzare le risorse colore anche con la modalità luce / buio ~ qualcuno sa come ottenerlo?
Nomad Developer

12

Puoi scrivere un'estensione per usarla con tutte le UIVview es. UIButton, UILabel, UIImageView ecc. Puoi personalizzare il mio seguente metodo secondo le tue esigenze, ma penso che funzionerà bene per te.

extension UIView{

    func setBorder(radius:CGFloat, color:UIColor = UIColor.clearColor()) -> UIView{
        var roundView:UIView = self
        roundView.layer.cornerRadius = CGFloat(radius)
        roundView.layer.borderWidth = 1
        roundView.layer.borderColor = color.CGColor
        roundView.clipsToBounds = true
        return roundView
    }
}

Utilizzo:

btnLogin.setBorder(7, color: UIColor.lightGrayColor())
imgViewUserPick.setBorder(10)

1
@luda non credo che lui / lei abbia molta scelta sulla lingua api!
worthwords

8

rapido 3

func borderColor(){

    self.viewMenuItems.layer.cornerRadius = 13
    self.viewMenuItems.layer.borderWidth = 1
    self.viewMenuItems.layer.borderColor = UIColor.white.cgColor
}

8

Swift 5.2 , UIView + Extension

extension UIView {
    public func addViewBorder(borderColor:CGColor,borderWith:CGFloat,borderCornerRadius:CGFloat){
        self.layer.borderWidth = borderWith
        self.layer.borderColor = borderColor
        self.layer.cornerRadius = borderCornerRadius

    }
}

Hai usato questa estensione;

yourView.addViewBorder(borderColor: #colorLiteral(red: 0.6, green: 0.6, blue: 0.6, alpha: 1), borderWith: 1.0, borderCornerRadius: 20)

ti sei perso per aggiungere clipsToBounds = true
Bent El-Eslam

3

Scrivi il codice nel tuo file viewDidLoad()

self.view.layer.borderColor = anyColor().CGColor

E puoi impostare ColorconRGB

func anyColor() -> UIColor {
    return UIColor(red: 0.0/255.0, green: 0.0/255.0, blue: 0.0/255.0, alpha: 1.0)
}

Impara qualcosa su CALayerinUIKit


In qualche modo, non fa nulla a meno che non imposti esplicitamente anche la larghezza del bordo.
Nicolas Miari

@NicolasMiari che ci si aspetterebbe ... non puoi vedere un colore del bordo per cui non hai impostato una dimensione.
Jono Guthrie

Scusa, ho dimenticato di menzionare che mi riferivo ai campi di testo ... che sembrano avere una larghezza del bordo predefinita diversa da zero dall'inizio. Tuttavia, ho faticato a far riflettere il colore che avevo impostato, finché non ho impostato esplicitamente la larghezza del bordo.
Nicolas Miari

3

swift 3.0

self.uiTextView.layer.borderWidth = 0.5
    self.txtItemShortDes.layer.borderColor = UIColor(red:205.0/255.0, green:205.0/255.0, blue:205.0/255.0, alpha: 1.0).cgColor

3

Possiamo creare un metodo per questo. Usalo semplicemente.

public func createBorderForView(color: UIColor, radius: CGFloat, width: CGFloat = 0.7) {
    self.layer.borderWidth = width
    self.layer.cornerRadius = radius
    self.layer.shouldRasterize = false
    self.layer.rasterizationScale = 2
    self.clipsToBounds = true
    self.layer.masksToBounds = true
    let cgColor: CGColor = color.cgColor
    self.layer.borderColor = cgColor
}

2

Swift 3.0

       groundTrump.layer.borderColor = UIColor.red.cgColor

Invece di aggiungere una nuova risposta, devi aver inviato una richiesta di modifica alla risposta originale
Rajan Maheshwari

@RajanMaheshwari Please no. Non aggiungere codice alle risposte di altre persone. Gli aggiornamenti dovrebbero essere pubblicati come propri, non in altre risposte. In questo modo ogni poster è responsabile di ciò che pubblica ...
Eric Aya

@EricAya non si tratta di aggiornare la risposta. È una richiesta di modifica, può essere nei commenti al rispondente. Hai ottenuto quello che stavo cercando di trasmettere.
Rajan Maheshwari
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.