web-dev-qa-db-ja.com

Cocoa Touch：UIViewの枠線の色と太さを変更するにはどうすればいいですか？

背景色を変更できることをインスペクタで確認しましたが、境界線の色と太さも変更したいのですが、これは可能ですか。

ありがとう

iosobjective-ciphonecocoa-touchinterface-builder
268
foreyez

ボーダープロパティを設定するにはビューのレイヤーを使う必要があります。例えば：

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

この機能にアクセスするにはQuartzCore.frameworkとリンクする必要もあります。

585
Vladimir

Xcode 6アップデート

Xcodeの最新版以来、これに対するより良い解決策があります。

@IBInspectableを使用すると、within the Attributes Inspectorから直接Attributesを設定できます。

My Custom View @IBInspectable Attributes

これはあなたのためにUser Defined Runtime Attributesをセットします：

enter image description here

これを設定するには2つの方法があります。

オプション1（ストーリーボードのライブアップデートあり）

  1. MyCustomViewを作成します。
  2. これはUIViewから継承されます。
  3. @IBDesignableを設定します（これによりViewの更新が有効になります）。
  4. ランタイム属性（ボーダーなど）を@IBInspectableで設定します
  5. Viewsクラスを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
        }
    }
}

このように、あなたのデフォルトのView alwaysはそれらの追加の編集可能なフィールドをAttributes Inspectorに持っています。もう1つの利点は、毎回クラスをMycustomViewに変更する必要がないことです。ただし、これに対する1つの欠点は、アプリケーションを実行したときにのみ変更内容が表示されることです。

40
MMachinegun

あなたの願いの色でボーダーを作ることもできます。

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までの値です。

16
rohan-patel

次の@IBInspectablesをUIView拡張子に追加

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属性を直接設定できるはずです。添付画像を見る

属性インスペクタ

10
Bikramjit Singh

私が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);    
}
8
Nicu Surdu
view.layer.borderWidth = 1.0
view.layer.borderColor = UIColor.lightGray.cgColor
7
shaiju mathew

このコードを試してください：

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

パフォーマンスが低下するため、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に入れることがこれらを止めるのかわかりません;-)

4
DEzra

これを@ marczkingの回答（Option 1）にコメントとして追加したいのですが、私のStackOverflowの状況がそれを妨げています。

Objective Cに@ marczkingの回答を移植しました。魅力のように動作します。ありがとう@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
3
spencery2

@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
    }
}
2
anhtran

UIViewのレイヤーを編集したくない場合は、いつでも別のビュー内にビューを埋め込むことができます。親ビューは背景色を境界色に設定します。境界線の幅に応じて、やや大きくなります。

もちろん、これはあなたのビューが透明ではなく、あなたがただ一つのボーダーカラーを欲している場合にのみ機能します。 OPはビュー自体に境界線を望んでいましたが、これは実行可能な代替手段かもしれません。

1
Matt Becker

あなたは別の側に別の境界線を追加したい場合は、特定のスタイルでサブビューを追加することがあります思い付くのは簡単な方法です。

0
Yuanfei Zhu

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
0
Akhrua