Jak programowo ustawić niestandardowy kolor obramowania UIView?

Odpowiedzi:

202

Jeśli używasz 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
Shashi Verma
źródło
Uwaga: to wydawało się nie działać dla mnie (być może dlatego, że jestem na Swift 3.1?). Wersja Parasa Joshiego ( stackoverflow.com/a/29701061/225813 ) jednak zadziałała
Ashley Coolman
Zmieniłem odpowiedź. to na pewno zadziała dla Ciebie .. Ashley Coolman
Shashi Verma
1
Nie musisz jawnie wywoływać init w swift 3.
ibrahimab
Czy można użyć więcej niż jednego koloru?
Gökhan Çokkeçeci
3
Czy jest jakaś różnica między twoimi dwiema wersjami?
Fogmeister
88

W Swift 4 możesz ustawić kolor i szerokość obramowania na UIControls za pomocą poniższego kodu.

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 , Możesz ustawić szerokość i kolor obramowania UIView za pomocą poniższego kodu.

yourView.layer.borderWidth = 1

yourView.layer.borderColor = UIColor.red.cgColor
Paras Joshi
źródło
1
@ShashiVerma nie ma za co. Do głębokiego szczegółów na temat warstw, czytać różne dokumenty referencyjne klasa Apple obiektu, więc jest to również pomocne dla ciebie :)
Paras Joshi
16

Użyj @IBDesignable i @IBInspectable, aby zrobić to samo.

Są one wielokrotnego użytku, łatwo modyfikowalne z poziomu Interface Builder, a zmiany są natychmiast odzwierciedlane w Storyboard

Dopasuj obiekty w scenorysie do określonej klasy

Fragment kodu:

@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()
}

}

Umożliwia łatwą modyfikację z poziomu Interface Builder:

Konstruktor interfejsu

Supratik Majumdar
źródło
Bardziej podoba mi się to rozwiązanie, ponieważ jest to rozwiązanie wielokrotnego użytku, w którym ustawiliśmy UIView na niestandardowy widok, ale nadal pozostawia więcej zmian.
n0rm
To był mój ulubiony sposób na osiągnięcie tego celu, ale w trybie ciemnym nie działa to dobrze. Pobiera styl kolorów obecnego MacOS i używa statycznego. Ale wbudowany @IBDesignablei @IBInspectablewszystko działa dobrze, więc powinien istnieć sposób, aby organy celne mogły używać zasobów koloru również w trybie ciemny / jasny - każdy wie, jak to osiągnąć?
Nomad Developer
12

Możesz napisać rozszerzenie, aby używać go ze wszystkimi widokami UIV, np. UIButton, UILabel, UIImageView itp. Możesz dostosować moją następującą metodę zgodnie ze swoimi wymaganiami, ale myślę, że będzie dobrze działać dla Ciebie.

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
    }
}

Stosowanie:

btnLogin.setBorder(7, color: UIColor.lightGrayColor())
imgViewUserPick.setBorder(10)
Shardul
źródło
1
@luda Nie sądzę, aby miał duży wybór w kwestii języka API!
słowa wartościowe
8

szybki 3

func borderColor(){

    self.viewMenuItems.layer.cornerRadius = 13
    self.viewMenuItems.layer.borderWidth = 1
    self.viewMenuItems.layer.borderColor = UIColor.white.cgColor
}
Deepak Tagadiya
źródło
8

Swift 5.2 , rozszerzenie UIView +

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

    }
}

Użyłeś tego rozszerzenia;

yourView.addViewBorder(borderColor: #colorLiteral(red: 0.6, green: 0.6, blue: 0.6, alpha: 1), borderWith: 1.0, borderCornerRadius: 20)
ikbal
źródło
przegapiłeś dodanie clipsToBounds = true
Bent El-Eslam
3

Wpisz kod w swoim viewDidLoad()

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

I możesz ustawić za ColorpomocąRGB

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

Dowiedz się czegoś o CALayerwUIKit

Ethan Joe
źródło
W jakiś sposób nic nie robi, chyba że wyraźnie ustawisz również szerokość obramowania.
Nicolas Miari
@NicolasMiari, czego można by się spodziewać ... nie widać koloru obramowania, dla którego nie ustawiłeś rozmiaru.
Jono Guthrie,
Przepraszam, zapomniałem wspomnieć, że odnosiłem się do pól tekstowych ... które od początku wydają się mieć domyślną niezerową szerokość obramowania. Jednak starałem się uzyskać odbicie koloru, który ustawiłem, dopóki wyraźnie nie ustawiłem szerokości obramowania.
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
Chathura Jayanaka
źródło
3

Możemy stworzyć na to metodę. Po prostu go użyj.

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
}
Panie Javed Multani
źródło
2

Swift 3.0

       groundTrump.layer.borderColor = UIColor.red.cgColor
Вадим Башуров
źródło
Zamiast dodawać nową odpowiedź, musieliście wysłać prośbę o zmianę do pierwotnej osoby odpowiadającej
Rajan Maheshwari
@RajanMaheshwari Proszę nie. Nie dodawaj kodu do odpowiedzi innych osób. Aktualizacje powinny być publikowane jako własne, a nie w innych odpowiedziach. W ten sposób każdy plakat jest odpowiedzialny za to, co publikuje ...
Eric Aya
@EricAya nie chodzi o aktualizację odpowiedzi. To jest prośba o edycję, może być w komentarzach do osoby odpowiadającej. Czy masz to, co chciałem przekazać.
Rajan Maheshwari