2014-08-30 17 views
34

Voglio mostrare un'immagine nel IMAGEVIEW come il contatto immagine (in un cerchio) Ma quando provo mostrare questo, l'ImageView Rescale sua dimensione e questo non mostra correttamente in un cerchio ..Come impostare imageView in cerchio come immagineContatti in Swift correttamente?

image.layer.borderWidth=1.0 
image.layer.masksToBounds = false 
image.layer.borderColor = UIColor.whiteColor().CGColor 
image.layer.cornerRadius = image.frame.size.height/2 
image.clipsToBounds = true 

I voglio mostrare come questo: enter image description here

Ma ottengo questo: enter image description here

Come può farlo immagine ridimensionare alle dimensioni UIImageView per mostrare come cerchio?

Grazie!

+0

qui è la soluzione per il caso imageview aveva larghezza diversa con Height: http://stackoverflow.com/questions/29685055/ ios-frame-size-width-2-doesnt-produce-a-circle-on-every-device – lee

risposta

28

Quale dimensione frame utilizza per image? Posso ottenere un cerchio perfetto se imposto che il riquadro sia un quadrato.

let image = UIImageView(frame: CGRectMake(0, 0, 100, 100)) 
+0

la mia dimensione dell'immagine in size inspector è impostata su 120 width e 120 height, ma quando la eseguo, non è perfetta cerchio perché la larghezza risulta essere un po 'più lunga? Perché? –

+0

Se il riquadro è un quadrato, impostando il raggio su metà larghezza/altezza si otterrà sempre una vista circolare. Se si sta creando una classe personalizzata che può contenere diverse dimensioni di frame al quadrato, non si deve eseguire l'hardcode del valore del raggio. – Mahouk

27

Questa è la soluzione che ho usato nella mia app:

var image: UIImage = UIImage(named: "imageName") 
imageView.layer.borderWidth = 1.0 
imageView.layer.masksToBounds = false 
imageView.layer.borderColor = UIColor.whiteColor().CGColor 
imageView.layer.cornerRadius = image.frame.size.width/2 
imageView.clipsToBounds = true 

Swift 4,0

let image = UIImage(named: "imageName") 
imageView.layer.borderWidth = 1.0 
imageView.layer.masksToBounds = false 
imageView.layer.borderColor = UIColor.white.cgColor 
imageView.layer.cornerRadius = image.frame.size.width/2 
imageView.clipsToBounds = true 
+0

Potresti fare un aggiornamento per swift 3, per favore? – Antonio

+0

Perché tutte le risposte qui sono così tanto votate? non è un po 'stupido usare cornerRadius c'è l'immagine non deve essere quadrata? – Injectios

4

che è tutto ciò che serve ....

 profilepic = UIImageView(frame: CGRectMake(0, 0, self.view.bounds.width * 0.19 , self.view.bounds.height * 0.1)) 
     profilepic.layer.borderWidth = 1 
     profilepic.layer.masksToBounds = false 
     profilepic.layer.borderColor = UIColor.blackColor().CGColor 
     profilepic.layer.cornerRadius = profilepic.frame.height/2 
     profilepic.clipsToBounds = true 
     slider.addSubview(profilepic) 
+0

Hai bisogno di importare '' 'quartzcore''' per questo? – Supertecnoboff

+0

@Supertecnoboff no.! –

3

Suggerirei di creare un'immagine perfetta con il quadrato iniziale . Questo può essere fatto in quasi tutti i programmi di fotoritocco. Dopodiché, questo dovrebbe funzionare all'interno di viewDidLoad. Credito a questo video

image.layer.cornerRadius = image.frame.size.width/2 
image.clipsToBounds = true 
10

veloce e semplice soluzione.

Come mascheraUIImage su Cerchio senza ritaglio con Swift.

extension UIImageView { 
    public func maskCircle(anyImage: UIImage) { 
    self.contentMode = UIViewContentMode.ScaleAspectFill 
    self.layer.cornerRadius = self.frame.height/2 
    self.layer.masksToBounds = false 
    self.clipsToBounds = true 

    // make square(* must to make circle), 
    // resize(reduce the kilobyte) and 
    // fix rotation. 
    self.image = anyImage 
    } 
} 

Come chiamare:

let anyAvatarImage:UIImage = UIImage(named: "avatar")! 
avatarImageView.maskCircle(anyAvatarImage) 
+1

Non riesco a trovare il metodo 'prepareImage()'. È stato cambiato? – Antonio

+0

@Antonio che è la sua funzione personalizzata ... usi solo self.image = anyImage –

+0

Ho rimosso la funzione extra. Grazie @ BorisNikolić – fatihyildizhan

0

ho riparato facendo modificare la vista:

  1. Vai al tuo Main.storyboard
  2. Clicca sull'immagine
  3. Visualizza -> Modalità -> Aspetto Riempimento

funziona perfettamente

0

Questo lavoro perfettamente per me. L'ordine delle linee è importante

func circularImage(photoImageView: UIImageView?) 
{ 
    photoImageView!.layer.frame = CGRectInset(photoImageView!.layer.frame, 0, 0) 
    photoImageView!.layer.borderColor = UIColor.grayColor().CGColor 
    photoImageView!.layer.cornerRadius = photoImageView!.frame.height/2 
    photoImageView!.layer.masksToBounds = false 
    photoImageView!.clipsToBounds = true 
    photoImageView!.layer.borderWidth = 0.5 
    photoImageView!.contentMode = UIViewContentMode.ScaleAspectFill 
} 

Modo d'uso:

@IBOutlet weak var photoImageView: UIImageView! 
    ... 
    ... 
    circularImage(photoImageView) 
0

quello che ho scoperto è che la larghezza e l'altezza di vista dell'immagine devono restituire un numero pari se diviso per 2 a ottenere un cerchio perfetto esempio

let image = UIImageView(frame: CGRectMake(0, 0, 120, 120)) 

non dovrebbe essere qualcosa di simile immagine let = UIImageVi ew (frame: CGRectMake (0, 0, 130, 130))

-1
reviewerImage.layer.cornerRadius = reviewerImage.frame.size.width/2; 
reviewerImage.clipsToBounds = true 
0

Questo funziona anche per me. Per risultati perfetti, usa le stesse dimensioni per larghezza e altezza. come image.frame = CGRect(0,0,200, 200)

Per il cerchio non perfetto, la larghezza e l'altezza non devono essere uguali a questi codici qui sotto.

image.frame = CGRect(0,0,200, 160) 
image.layer.borderColor = UIColor.whiteColor().CGColor 
image.layer.cornerRadius = image.frame.size.height/2 
image.layer.masksToBounds = false 
image.layer.clipsToBounds = true 
image.contentMode = .scaleAspectFill 
0

Ho avuto un risultato simile (più di un ovale che un cerchio). Si è scoperto che i vincoli che ho impostato su UIImageView lo hanno forzato in un ovale anziché in un cerchio. Dopo aver risolto ciò, le soluzioni di cui sopra hanno funzionato.

1

Crea la tua cerchia personalizzata UIImageView e crea il cerchio sotto il layoutSubviews ti aiuta se usi l'Autolayout.

/* 
     +-------------+ 
     |    | 
     |    | 
     |    | 
     |    | 
     |    | 
     |    | 
     +-------------+ 
    The IMAGE MUST BE SQUARE 
*/ 
class roundImageView: UIImageView { 

    override init(frame: CGRect) { 
     // 1. setup any properties here 
     // 2. call super.init(frame:) 
     super.init(frame: frame) 
     // 3. Setup view from .xib file 
    } 

    required init?(coder aDecoder: NSCoder) { 
     // 1. setup any properties here 
     // 2. call super.init(coder:) 
     super.init(coder: aDecoder) 
     // 3. Setup view from .xib file 
    } 

    override func layoutSubviews() { 
     super.layoutSubviews() 
     self.layer.borderWidth = 1 
     self.layer.masksToBounds = false 
     self.layer.borderColor = UIColor.white.cgColor 
     self.layer.cornerRadius = self.frame.size.width/2 
     self.clipsToBounds = true 
    } 
} 
0

provare questo. rapida codice

override func viewWillAppear(_ animated: Bool) { 
    super.viewWillAppear(true) 
    perform(#selector(self.setCircleForImage(_:)), with: pickedImage, afterDelay: 0) 
} 


@objc func setCircleForImage(_ imageView : UIImageView){ 
    imageView.layer.cornerRadius = pickedImage.frame.size.width/2 
    imageView.clipsToBounds = true 
} 
0

Usa questo codice per rendere l'immagine rotonda

 self.layoutIfNeeded() 
    self.imageView.layer.cornerRadius = 
    self.imageView.frame.width/2 
    self.imageView.layer.masksToBounds = true 
Problemi correlati