【问题标题】:Cocoa Touch: How To Change UIView's Border Color And Thickness?Cocoa Touch:如何改变 UIView 的边框颜色和粗细?
【发布时间】:2011-03-20 19:28:56
【问题描述】:

我在inspector中看到可以更改背景颜色,但我也想更改边框颜色和粗细,可以吗?

【问题讨论】:

标签: ios objective-c iphone cocoa-touch interface-builder


【解决方案1】:

您需要使用视图的图层来设置边框属性。例如:

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

您还需要链接 QuartzCore.framework 才能访问此功能。

【讨论】:

  • 有没有办法为每一边设置不同的宽度/颜色?
  • @lluismontero 我担心你将不得不使用 drawRect: 方法制作自定义 UIView
  • 如果我这样做,并且在这个视图之上我有一个动画,就像一个模态 UINavigationController 解散,我看到很多故障发生,很难描述。如果我停用边界,一切都会恢复正常。
  • 只是提醒他人。 Xcode 建议将 UIColor 桥接到 CGColorRef 为__bridge CGColorRef。这不起作用。如答案中所述,它必须是[UIColor blackColor].CGColor
  • #import &lt;QuartzCore/QuartzCore.h&gt; 不再需要。
【解决方案2】:

Xcode 6 更新

由于 Xcode 的最新版本有一个更好的解决方案:

使用@IBInspectable,您可以直接从Attributes Inspector设置属性。

这将为您设置User Defined Runtime Attributes

有两种设置方法:

选项 1(在 Storyboard 中实时更新)

  1. 创建MyCustomView
  2. 这继承自UIView
  3. 设置@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 起无法使用,请参阅 cmets)

扩展你的 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。 但是,这样做的一个缺点是您只会在运行应用程序时看到更改。

【讨论】:

  • 您的扩展程序在今天的最新版本的 Xcode 中无法运行。
  • 我确认@EdgarAroutiounian 只是说在 Swift 1.2 中第二种方法不再有效
  • Objective-C 怎么样?
  • 在下方查看spencery2's answer,他花时间用Objective-C编写:
  • 更新扩展以不存储值并使用 set(value) { } 并获取 { } 直接访问图层,然后就可以了。
【解决方案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 之间的值。

【讨论】:

  • 值得注意的是rgb应该是浮点数;除数也应该是浮点数:r / 255.0.
  • 不,C 语法不像你说的那样。 r、g 和 b 可以是 int,因为 C(和 objC IS C)促销将在制作时将 int r=128 转换为 double:r/255.0。顺便说一句,你得到了 double,Clang 将转换为 CGFloat。
【解决方案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 属性。见附图

Attributes Inspector

【讨论】:

    【解决方案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);    
    }
    

    【讨论】:

    • @Krish 您将颜色存储在一个变量中,当您需要更改边框颜色时,您更改变量值并在视图上调用setNeedsDisplay。这将强制重绘 UIView 并隐式调用drawRect。未经测试,虽然...
    【解决方案6】:
    view.layer.borderWidth = 1.0
    view.layer.borderColor = UIColor.lightGray.cgColor
    

    【讨论】:

    • 我真的不喜欢人们在没有解释的情况下被否决。它对任何人都没有帮助。
    【解决方案7】:

    试试这个代码:

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

    【讨论】:

      【解决方案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 会阻止这些;-)

      【讨论】:

        【解决方案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
        

        【讨论】:

          【解决方案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
              }
          }
          

          【讨论】:

            【解决方案11】:

            如果您不想编辑 UIView 的层,您可以随时将视图嵌入到另一个视图中。父视图将其背景颜色设置为边框颜色。它也会稍大一些,具体取决于您希望边框的宽度。

            当然,这仅适用于您的视图不透明并且您只需要单一边框颜色的情况。 OP 想要视图本身的边框,但这可能是一个可行的选择。

            【讨论】:

              【解决方案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
              

              【讨论】:

                【解决方案13】:

                如果你想在不同的边上添加不同的边框,可以添加一个具有特定样式的子视图是一种很容易想到的方法。

                【讨论】:

                  【解决方案14】:

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

                  【讨论】:

                    猜你喜欢
                    • 1970-01-01
                    • 1970-01-01
                    • 1970-01-01
                    • 1970-01-01
                    • 2022-06-24
                    • 1970-01-01
                    • 1970-01-01
                    • 2014-07-03
                    • 1970-01-01
                    相关资源
                    最近更新 更多