Cocoa Touch How To Change UIView s Border Color And Thickness

Question

I saw in the inspector that I can change the background color  but I d like to also change the border color and thickness  is this possible

User · Answer

If you didn t want to edit the layer of a UIView  you could always embed the view within another view   The parent view would have its background color set to the border color   It would also be slightly larger  depending upon how wide you want the border to be   Of course  this only works if your view isn t transparent and you only want a single border color   The OP wanted the border in the view itself  but this may be a viable alternative

User · Answer

Add following  IBInspectables in UIView extension  extension UIView       IBInspectable var borderWidth  CGFloat       get         return layer borderWidth           set newValue          layer borderWidth   newValue               IBInspectable var borderColor  UIColor        get         if let color   layer borderColor           return UIColor CGColor  color                return nil           set newValue          layer borderColor   newValue  CGColor               And then you should be able to set borderColor and borderWidth attributes directly from Attribute inspector  See attached image  Attributes Inspector

User · Answer

item s border color in swift 4 2   let cell   tableView dequeueReusableCell withIdentifier   Cell lastOrderId   as  Cell lastOrder cell layer borderWidth   1 cell layer borderColor   UIColor white cgColor cell layer cornerRadius   10

User · Answer

IBInspectable is working for me on iOS 9   Swift 2 0  extension UIView     IBInspectable var borderWidth  CGFloat   get           return layer borderWidth           set newValue            layer borderWidth   newValue           IBInspectable var cornerRadius  CGFloat       get           return layer cornerRadius           set newValue            layer cornerRadius   newValue           IBInspectable var borderColor  UIColor        get           if let color   layer borderColor               return UIColor CGColor  color                    return nil           set newValue            layer borderColor   newValue  CGColor

User · Answer

I wouldn t suggest overriding the drawRect due to causing a performance hit   Instead  I would modify the properties of the class like below  in your custom uiview      -  id initWithFrame  CGRect frame       self    super initWithFrame frame       if  self          self layer borderWidth   2 f        self layer borderColor    UIColor redColor  CGColor          return self    I didn t see any glitches when taking above approach - not sure why putting in the initWithFrame stops these  -

User · Answer

I wanted to add this to  marczking s answer  Option 1  as a comment  but my lowly status on StackOverflow is preventing that   I did a port of  marczking s answer to Objective C   Works like charm  thanks  marczking   UIView Border h    import  lt UIKit UIKit h gt   IB DESIGNABLE  interface UIView  Border   - void setBorderColor  UIColor   color  - void setBorderWidth  CGFloat width  - void setCornerRadius  CGFloat radius    end   UIView Border m    import  UIView Border h    implementation UIView  Border     Note  cannot use synthesize in a Category  - void setBorderColor  UIColor   color       self layer borderColor   color CGColor     - void setBorderWidth  CGFloat width       self layer borderWidth   width     - void setCornerRadius  CGFloat radius       self layer cornerRadius   radius      self layer masksToBounds   radius  gt  0      end

User · Answer

Try this code   view layer borderColor     UIColor redColor  CGColor  view layer borderWidth  2 0   view setClipsToBounds YES

User · Answer

If you want to add different border on different sides  may be add a subview with the specific style is a way easy to come up with

User · Answer

When I use Vladimir s CALayer solution  and on top of the view I have an animation  like a modal UINavigationController dismissing  I see a lot of glitches happening and having drawing performance issues   So  another way to achieve this  but without the glitches and performance loss  is to make a custom UIView and implement the drawRect message like so   -  void drawRect  CGRect rect       CGContextRef contextRef   UIGraphicsGetCurrentContext        CGContextSetLineWidth contextRef  1       CGContextSetRGBStrokeColor contextRef  255 0  255 0  255 0  1 0       CGContextStrokeRect contextRef  rect

User · Answer

self view layer setBorderColor   UIColor colorWithRed 0 265 green 0 447 blue 0 767 alpha 1 0f  CGColor

User · Answer

You need to use view s layer to set border property  e g    import  lt QuartzCore QuartzCore h gt      view layer borderColor    UIColor redColor  CGColor  view layer borderWidth   3 0f    You also need to link with QuartzCore framework to access this functionality

User · Answer

Xcode 6 update  Since Xcode s newest version there is a better solution to this   With  IBInspectable you can set Attributes directly from within the Attributes Inspector     This sets the User Defined Runtime Attributes for you     There are two approaches to set this up   Option 1  with live updating in Storyboard    Create MyCustomView  This inherits from UIView  Set  IBDesignable  this makes the View update live    Set your Runtime Attributes  border  etc   with  IBInspectable Change your Views Class to MyCustomView Edit in Attributes Panel and see changes in Storyboard          IBDesignable class MyCustomView  UIView        IBInspectable var cornerRadius  CGFloat   0           didSet               layer cornerRadius   cornerRadius             layer masksToBounds   cornerRadius  gt  0                      IBInspectable var borderWidth  CGFloat   0           didSet               layer borderWidth   borderWidth                      IBInspectable var borderColor  UIColor            didSet               layer borderColor   borderColor  CGColor                        IBDesignable only works when set at the start of class MyCustomView  Option 2  not working since Swift 1 2  see comments   Extend your UIView Class   extension UIView        IBInspectable var cornerRadius  CGFloat   0           didSet               layer cornerRadius   cornerRadius             layer masksToBounds   cornerRadius  gt  0                      IBInspectable var borderWidth  CGFloat   0           didSet               layer borderWidth   borderWidth                      IBInspectable var borderColor  UIColor            didSet               layer borderColor   borderColor  CGColor                     This way  your default View always has those extra editable fields in Attributes Inspector  Another advantage is that you don t have to change the class to MycustomView every time  However  one drawback to this is that you will only see your changes when you run your app

User · Answer

You can also create border with the color of your wish    view layer borderColor    UIColor colorWithRed r 255 0 green g 255 0 blue b 255 0 alpha 1 0  CGColor     r g b are the values between 0 to 255

User · Answer

view layer borderWidth   1 0 view layer borderColor   UIColor lightGray cgColor

[ios] Cocoa Touch: How To Change UIView's Border Color And Thickness?

Examples related to ios

Examples related to objective-c

Examples related to iphone

Examples related to cocoa-touch

Examples related to interface-builder