Как сохранить круглый imageView круглый с использованием автоматического макета?

Question

Как превратить прямоугольное изображение в круглое изображение изображения, которое может удерживать форму в автоматическом макете без установки ограничений ширины и высоты? Таким образом, позволяя imageView определять его размер и размер больше и меньше по отношению к объектам вокруг него с ведущими, конечными, верхними и нижними ограничениями.

Я задал аналогичный вопрос на днях, но я думаю, что это может быть поставлено более сжатым способом. Спасибо!

EDIT

Хорошо, я начал более сделать это как можно более простым. У меня есть вид под названием «Ячейка» и UIImageView с именем «собака» внутри ячейки, и все. У меня больше нет «возможности одновременного удовлетворения ограничений» в консоли, всего два простых вида с использованием автоматического макета. Я все еще пытаюсь использовать этот код, чтобы обогнуть UIImageView:

profileImageView.layer.cornerRadius = profileImageView.frame.size.width/2 
profileImageView.clipsToBounds = true 

Здесь установки ячейки ограничения:

Вот настройка профиля рис ограничение:

Вот результат без кода, без округления, но красивый и квадратный:

Вот результат с кодом на раунд:

Это не имеет никакого смысла для меня, потому что без кода округления изображение является квадратом, и с кодом это ромбовидный. Если это квадрат, это не кружок без проблем?

EDIT 2

Вот что происходит, когда я удалить нижнее ограничение и добавить множитель .637 на равную высоту до надтаблицы.

Answer 1

Добавить 1: 1 соотношение сторон ограничения к imageView для того, чтобы оставаться круговыми, несмотря на любую высоту или ширину изменений.

Answer 2

К сожалению, вы не можете сделать это с помощью cornerRadius и autolayout - CGLayer не влияет autolayout, поэтому любое изменение в размере зрения не изменится радиус, который был задан один раз вызывает, как вы заметили, круг чтобы потерять свою форму.

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

EDIT

Примером может выглядеть следующим образом:

class Foo: UIImageView { 
    override func layoutSubviews() { 
     super.layoutSubviews() 

     let radius: CGFloat = self.bounds.size.width/2.0 

     self.layer.cornerRadius = radius 
    } 
} 

И, очевидно, вы должны ограничить ширину Foobar экземпляра, чтобы быть такой же, как высота (для поддержания круга) , Вероятно, вы также захотите установить экземпляр contentMode на UIViewContentMode.ScaleAspectFill, чтобы он знал, как рисовать изображение (это означает, что изображение, вероятно, будет обрезано).

Answer 3

Кажется, что когда вы добавляете один вид в качестве подсмотра другого, то сетчатый вид не обязательно будет иметь ту же высоту, что и его супервизор. Вот в чем проблема. Решение заключается не в том, чтобы добавить изображение в качестве подзаголовка, а иметь его поверх фонового изображения. На изображении ниже я использую UILabel в качестве фона.

Кроме того, в вашем случае, когда вы устанавливаете cornerRadius использовать это: let radius: CGFloat = self.bounds.size.height/2.0.

Answer 4

У меня такая же проблема, и теперь я получаю то, что произошло здесь, надеюсь, что некоторые идеи могут помочь вам: есть что-то другое между жгутами:

1. ваш profileImageView в раскадровке
2. ваш profileImageView в viewDidLoad

размер связанного кадра и рамки различен, когда viewDidLoad и в раскадровке, только потому, что вид изменяет размер для разных размеров устройства. Вы можете попробовать print(profileImageView.bounds.size) в viewDidLoad и viewDidAppear вы найдете размер в видеDidLoad, который вы установили cornerRadius, не является настоящим «бегущим» размером.

а советы для вас: вы можете использовать подкласс ImageView, чтобы избежать этого, или не использовать его в раскадровке,

Answer 5

Установки радиуса в viewWillLayoutSubviews позволит решить проблему

override func viewWillLayoutSubviews() { 
    super.viewWillLayoutSubviews() 
    profileImageView.layer.cornerRadius = profileImageView.frame.height/2.0 
} 

Answer 6

С моим хакерское решение, вы получите гладкую анимацию углового радиуса наряду с изменением размера кадра.

Предположим, у вас есть ViewSubclass: UIView. Он должен содержать следующий код:

class ViewSubclass: UIView { 
    var animationDuration : TimeInterval? 
    let imageView = UIImageView() 
    //some imageView setup code 

    override func layoutSubviews() { 
     super.layoutSubviews() 

     if let duration = animationDuration { 
      let anim = CABasicAnimation(keyPath: "cornerRadius") 
      anim.fromValue = self.imageView.cornerRadius 
      let radius = self.imageView.frame.size.width/2 
      anim.toValue = radius 
      anim.duration = duration 
      self.imageView.layer.cornerRadius = radius 
      self.imageView.layer.add(anim, forKey: "cornerRadius") 
     } else { 
      imageView.cornerRadius = imageView.frame.size.width/2 
     } 

     animationDuration = nil 
    } 
} 

, то вы должны будете сделать это:

let duration = 0.4 //For example 
instanceOfViewSubclass.animationDuration = duration 
UIView.animate(withDuration: duration, animations: { 
    //Your animation 
    instanceOfViewSubclass.layoutIfNeeded() 
}) 

Это не красиво, и может не работать для сложной многопрофильной анимации, но делает ответ на вопрос ,

Answer 7

Легко сделать, создав IBOutlet для ограничения, которое необходимо изменить во время выполнения.Ниже приведен код:

1. IBOutlet Создать для ограничения, которые должны быть изменены во время выполнения.

   @IBOutlet var widthConstraint: NSLayoutConstraint! 
   

2. Добавить ниже код в viewDidLoad():

   self.widthConstraint.constant = imageWidthConstraintConstant() 
   

Ниже функции определяет для типов устройств изменить ограничение ширины соответственно.

func imageWidthConstraintConstant() -> CGFloat { 

    switch(self.screenWidth()) { 

    case 375: 
     return 100 

    case 414: 
     return 120 

    case 320: 
     return 77 

    default: 
     return 77 
    } 
} 

Answer 8

создать новый интерфейс в вашем файле .h как

@interface CornerClip : UIImageView 

@end 

и внедрение в .m файл как

@implementation cornerClip 


-(void)layoutSubviews 
{ 
    [super layoutSubviews]; 

    CGFloat radius = self.bounds.size.width/2.0; 

    self.layer.cornerRadius = radius; 

} 

@end 

теперь просто дать класс как "CornerClip" вашему ImageView. 100% работает ... Наслаждайтесь

Answer 9

Если вы подклассифицировали UIImageView. Затем просто добавьте в него этот волшебный код.

Написано в: Swift 3

override func layoutSubviews() { 
    super.layoutSubviews() 
    if self.isCircular! { 
     self.layer.cornerRadius = self.bounds.size.width * 0.50 
    } 
}