it-swarm.com.ru

Какао Touch: Как изменить цвет и толщину границы UIView?

Я видел в инспекторе, что я могу изменить цвет фона, но я хотел бы также изменить цвет и толщину границы, возможно ли это?

Спасибо

265
foreyez

Вы должны использовать слой вида, чтобы установить свойство границы. например:

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

Вам также нужно связаться с QuartzCore.framework для доступа к этой функции.

583
Vladimir

Xcode 6 обновление

Начиная с последней версии XCode, есть лучшее решение для этого:

С @IBInspectable вы можете установить атрибуты непосредственно из внутриAttributes Inspector.

My Custom View @IBInspectable Attributes

Это устанавливает User Defined Runtime Attributes для вас:

enter image description here

Есть два подхода к настройке:

Вариант 1 (с живым обновлением в раскадровке)

  1. Создать MyCustomView.
  2. Это наследуется от UIView.
  3. Установите @IBDesignable (это сделает обновление View активным). *
  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
        }
    }
}

Таким образом, ваш вид по умолчанию always имеет эти дополнительные редактируемые поля в Attributes Inspector. Еще одним преимуществом является то, что вам не нужно каждый раз менять класс на MycustomView ... Однако одним из недостатков этого является то, что вы увидите изменения только при запуске приложения.

39
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 непосредственно из инспектора атрибутов. Смотрите прикрепленное изображение

Инспектор атрибутов

9
Bikramjit Singh

Когда я использую решение 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
6
shaiju mathew

Попробуйте этот код:

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

Я бы не советовал переопределять drawRect из-за снижения производительности.

Вместо этого я бы изменил свойства класса, как показано ниже (в вашем пользовательском интерфейсе):

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

@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

Я хотел добавить это к ответу @ 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
2
spencery2

Если вы не хотите редактировать слой UIView, вы всегда можете встроить представление в другое представление. В родительском представлении цвет фона будет установлен на цвет границы. Он также будет немного больше, в зависимости от ширины границы.

Конечно, это работает только в том случае, если ваш вид не прозрачен и вам нужен только один цвет рамки. ФП хотел иметь границу в самом представлении, но это может быть жизнеспособной альтернативой.

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