Cocoa Touch：如何更改 UIView 的邊框顏色和粗細？

Question

我在檢查器中看到我可以更改背景顏色，但我還想更改邊框顏色和粗細，這可能嗎？

Answer 1

您需要使用視圖的圖層來設置邊框屬性。 例如：

#import <QuartzCore/QuartzCore.h>
...
view.layer.borderColor = [UIColor redColor].CGColor;
view.layer.borderWidth = 3.0f;

您還需要鏈接 QuartzCore.framework 以訪問此功能。

Answer 2

Xcode 6 更新

由於 Xcode 的最新版本有一個更好的解決方案：

隨着@IBInspectable您可以直接設置屬性從內部Attributes Inspector 。

這將為您設置User Defined Runtime Attributes ：

有兩種設置方法：

選項 1 （在 Storyboard 中實時更新）

1. 創建MyCustomView 。
2. 這繼承自UIView 。
3. 設置@IBDesignable （這會使視圖更新@IBDesignable ）。*
4. 使用@IBInspectable設置您的運行時屬性（邊框等）
5. 將您的視圖類更改為MyCustomView
6. 在屬性面板中編輯並查看故事板中的更改:)

`

@IBDesignable
class MyCustomView: UIView {
    @IBInspectable var cornerRadius: CGFloat = 0 {
        didSet {
            layer.cornerRadius = cornerRadius
            layer.masksToBounds = cornerRadius > 0
        }
    }
    @IBInspectable var borderWidth: CGFloat = 0 {
        didSet {
            layer.borderWidth = borderWidth
        }
    }
    @IBInspectable var borderColor: UIColor? {
        didSet {
            layer.borderColor = borderColor?.CGColor
        }
    }
}

* @IBDesignable僅在class MyCustomView的開頭設置時才有效

選項 2 （自 Swift 1.2 起不起作用，請參閱評論）

擴展你的 UIView 類：

extension UIView {
    @IBInspectable var cornerRadius: CGFloat = 0 {
        didSet {
            layer.cornerRadius = cornerRadius
            layer.masksToBounds = cornerRadius > 0
        }
    }
    @IBInspectable var borderWidth: CGFloat = 0 {
        didSet {
            layer.borderWidth = borderWidth
        }
    }
    @IBInspectable var borderColor: UIColor? {
        didSet {
            layer.borderColor = borderColor?.CGColor
        }
    }
}

這樣，您的默認視圖在Attributes Inspector始終具有那些額外的可編輯字段。 另一個優點是您不必每次都將類更改為MycustomView 。 但是，這樣做的一個缺點是只有在運行應用程序時才能看到更改。

Answer 3

您還可以使用您想要的顏色創建邊框..

view.layer.borderColor = [UIColor colorWithRed:r/255.0 green:g/255.0 blue:b/255.0 alpha:1.0].CGColor;

*r,g,b 是 0 到 255 之間的值。

Answer 4

在 UIView 擴展中添加以下 @IBInspectables

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

然后你應該能夠直接從屬性檢查器設置 borderColor 和 borderWidth 屬性。 見附件圖片

屬性檢查器

Answer 5

當我使用 Vladimir 的 CALayer 解決方案時，並且在視圖之上我有一個動畫，比如模態 UINavigationController 關閉，我看到很多小故障發生並有繪圖性能問題。

因此，實現此目的的另一種方法，但沒有故障和性能損失，是制作自定義 UIView 並實現drawRect消息，如下所示：

- (void)drawRect:(CGRect)rect
{
    CGContextRef contextRef = UIGraphicsGetCurrentContext();
    CGContextSetLineWidth(contextRef, 1);
    CGContextSetRGBStrokeColor(contextRef, 255.0, 255.0, 255.0, 1.0);
    CGContextStrokeRect(contextRef, rect);    
}

Answer 6

view.layer.borderWidth = 1.0
view.layer.borderColor = UIColor.lightGray.cgColor

Answer 7

試試這個代碼：

view.layer.borderColor =  [UIColor redColor].CGColor;
view.layer.borderWidth= 2.0;
[view setClipsToBounds:YES];

Answer 8

由於會導致性能下降，我不建議覆蓋 drawRect。

相反，我會修改類的屬性，如下所示（在您的自定義 uiview 中）：

  - (id)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if (self) {
      self.layer.borderWidth = 2.f;
      self.layer.borderColor = [UIColor redColor].CGColor;
    }
  return self;

采取上述方法時我沒有看到任何故障 - 不知道為什么放入 initWithFrame 會阻止這些 ;-)

Answer 9

我想將此添加到@marczking 的答案（選項 1 ）中作為評論，但我在 StackOverflow 上的低地位阻止了這一點。

我做了一個@marczking 對 Objective C 的回答的移植。像魅力一樣工作，謝謝@marczking！

UIView+Border.h：

#import <UIKit/UIKit.h>

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

@end

Answer 10

@IBInspectable 在 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
    }
}

Answer 11

如果您不想編輯 UIView 的圖層，您始終可以將視圖嵌入另一個視圖中。 父視圖會將其背景顏色設置為邊框顏色。 它也會稍大一些，具體取決於您希望邊框有多寬。

當然，這僅在您的視圖不透明並且您只想要一個邊框顏色時才有效。 OP 想要視圖本身的邊框，但這可能是一個可行的選擇。

Answer 12

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

Answer 13

[self.view.layer setBorderColor: [UIColor colorWithRed:0.265 green:0.447 blue:0.767 alpha:1.0f].CGColor];

Answer 14

如果你想在不同的邊上添加不同的邊框，可以添加一個具有特定樣式的子視圖是一種很容易想到的方法。