Как найти радиус просмотра изображения?

#ios #swift #uiimageview #uibezierpath #cashapelayer

#iOS #swift #uiimageview #uibezierpath #cashapelayer

Вопрос:

В настоящее время у меня есть представление изображения, которое содержит круглое изображение.

Я настроил это так:

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

Я пытаюсь нарисовать дугу вокруг круга, используя UIBezierPath, и я хотел бы передать радиус изображения для параметра radius.

 let circlePath = UIBezierPath(arcCenter: CGPoint(x: profileImageView.frame.size.width/2, y: profileImageView.frame.size.height/2), radius: IMG_VIEW_RADIUS, startAngle: CGFloat(0), endAngle:CGFloat(M_PI * 2), clockwise: true)
  

Как бы я это сделал?

Комментарии:

1. разве вы не можете использовать границу просмотра изображения

2. Я уже настроил это, но я хотел бы также создать дугу, которая перекрывает границу

3. Просто хак — почему бы не создать другой вид изображения, прозрачный для этого, и просто добавить его границу. Укажите вторую высоту ширины изображения, уменьшенную на 1 от первой, и добавьте поверх первого изображения

4. ооооо, звучит неплохо. Я собираюсь попробовать это

5. Другой способ размещен в качестве ответа

Ответ №1:

Swift 3.0

Другой способ

Я только что добавил изображение, подобное этому

 let imageView = UIImageView(frame: CGRect(x: 100, y: 100, width: 200, height: 200))
imageView.backgroundColor = UIColor.green
imageView.layer.cornerRadius = imageView.frame.size.width / 2
imageView.clipsToBounds = true
self.view.addSubview(imageView)
  

Выполнение кругового пути Безье

 let circlePath = UIBezierPath(arcCenter: CGPoint(x: imageView.frame.size.width/2,y: imageView.frame.size.height/2), radius: CGFloat((imageView.frame.size.width/2) - 3.5), startAngle: CGFloat(0), endAngle:CGFloat(M_PI * 2), clockwise: true)

let shapeLayer = CAShapeLayer()
shapeLayer.path = circlePath.cgPath

//fill color
shapeLayer.fillColor = UIColor.clear.cgColor

//stroke color
shapeLayer.strokeColor = UIColor.white.cgColor

//line width
shapeLayer.lineWidth = 2.0

//finally adding the shapeLayer to imageView's layer
imageView.layer.addSublayer(shapeLayer)
  

Теперь создаем внешнюю границу, используя ту же концепцию

 let outerCirclePath = UIBezierPath(arcCenter: CGPoint(x: imageView.frame.size.width/2,y: imageView.frame.size.height/2), radius: CGFloat(imageView.frame.size.width/2 ), startAngle: CGFloat(0), endAngle:CGFloat(M_PI * 2), clockwise: true)
let outerLayer = CAShapeLayer()
outerLayer.path = outerCirclePath.cgPath

//fill color
outerLayer.fillColor = UIColor.clear.cgColor
//stroke color
outerLayer.strokeColor = UIColor.blue.cgColor
//line width
outerLayer.lineWidth = 15.0
imageView.layer.addSublayer(outerLayer)
  

Теперь измените zPosition слой формы, созданный для внутреннего слоя, поскольку его радиус меньше, чем у внешнего слоя, и его следует добавить сверху, чтобы он был виден

 shapeLayer.zPosition = 2
  

Вам нужно немного изменить радиус первого внутреннего слоя. В моем случае я просто вычел радиус с 3.5

введите описание изображения здесь

Комментарии:

1. Потрясающе, вы случайно не знаете, есть ли у меня способ добавить этот слой поверх границы?

2. @FaisalSyed Хорошо, я собираюсь изменить код в соответствии с вашими требованиями через 2 минуты

3. @FaisalSyed Проверьте сейчас. Вам нужно один раз немного изменить значения радиуса для внутреннего слоя, а также обязательно изменить zPosition добавленный внутренний слой, т. е. shapeLayer в вашем случае, иначе он не будет отображаться

4. не знаю, почему это было отклонено ранее, если кто-нибудь проголосует против, пожалуйста, прокомментируйте также, что не так, чтобы можно было сделать предположительное улучшение

Ответ №2:

просто используйте ширину границы и цвет границы

     profileImageView?.layer.cornerRadius = 5.0
        profileImageView?.layer.borderColor = UIColor.white.cgColor
  

Комментарии:

1. Я пытаюсь добавить дугу в пределах моей границы. Добавленная таким образом граница скроет дугу