2016-05-31 23 views
6

Ho un sacco di problemi nel far sì che le immagini si adattino, con le proporzioni corrette all'interno di UIImageView.Rendere UIImage adatto a UIImageView all'interno di UIView

Tutte le immagini inserite inizialmente da un plist in dati di base si adattano con il rapporto di aspetto corretto, ma come le immagini vengono aggiunte utilizzando l'app (dalla libreria esistente di immagini), le immagini in due di tre visualizzazioni appaiono più grandi del visualizza se stesso, in modo che venga mostrato solo l'angolo in alto a sinistra della foto. Nello screenshot sottostante, la riga superiore della tabella mostra un'immagine aggiunta tramite il plist e le due righe successive (MY RECORDS) mostrano le foto che non sono limitate alla vista.

enter image description here

Le celle nella vista sopra vengono creati nel modo consueto, e quindi configurati nel suo proprio metodo, dove è proprietà sono definite.

override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell 
{ 
    let cell = tableView.dequeueReusableCellWithIdentifier("Cell", forIndexPath: indexPath) 
    self.configureCell(cell, indexPath: indexPath) 
    return cell 
} 

    func configureCell(cell: UITableViewCell, indexPath: NSIndexPath) 
{ 
    let record = fetchedResultsController.objectAtIndexPath(indexPath) as! Record 
    cell.textLabel!.text = record.subject 
    cell.detailTextLabel!.text = record.shortDetails 

    if let imageArray = imagesForRecord(record) 
    { 
     if imageArray.count > 0 
     { 
      cell.imageView?.contentMode = .ScaleAspectFit 
      cell.imageView?.clipsToBounds = true 
      cell.imageView?.image = imageArray[Int(record.featureImageIndex)] 
     } 
    } 
} 

Ma l'immagine non viene ridimensionata, né è ritagliata entro i limiti di imageView. Le immagini che erano inizialmente caricate, come l'orso, non richiedevano contentMode o clipToBounds da impostare.

Ho lo stesso problema in un controller di visualizzazione diverso (chiamarlo VC2), ma questa vista è definita utilizzando storyboard. Ho una vista UIImage vincolata a tutti i lati di un UIView con limiti di dimensioni fissi. La vista UIImage è impostata su Aspect Fit, ma quando imposto un'immagine dalla libreria dei dispositivi appare come sopra: il rapporto di aspetto è corretto, ma viene mostrato solo l'angolo superiore dell'immagine.

enter image description here

enter image description here

In un altro punto di vista, ho quasi lo stesso layout storyboard come VC2, ma qui funziona come previsto. Non riesco a vedere alcuna differenza nei vincoli, proprietà e le stesse foto vengono utilizzate (dalla libreria).

enter image description here

enter image description here

non riesco a vedere alcuna differenza, e non riesco a immaginare come eseguire il debug da qui. Senza dubbio sto fraintendendo qualcosa di abbastanza semplice su Aspect Fit o su come applicarlo.

+1

Sei sicuro che sei impostazioni .contentMode e .clipsToBounds sulla ImageView destra? UITableViewCell ha una proprietà imageView per impostazione predefinita che viene utilizzata per visualizzare celle di base. Inoltre, in che funzione stai chiamando quei due? – Mercurial

+0

Nello storyboard, l'identificativo della cella è 'Cell', che viene quindi utilizzato nel metodo delegate tableView.cellForRowAtIndexPath per istanziare la cella con tableView.dequeueReusableCellWithIdentifier. Questa cella viene quindi passata a un metodo configureCell in cui vengono aggiunti contentMode e clipToBounds (insieme a testo e immagine) prima di essere restituiti dal metodo delegate. – DrWhat

+0

utilizza .UIViewContentMode.ScaleAspectFill. non puoi ridimensionare l'immagine come quello che ti aspetti ora. Io prendo Whatsapp, hanno lo stesso problema a quello che stai affrontando. quindi si limitano a utilizzare .ScaleAspectFill per tutte le immagini. – karthik

risposta

0

magari aggiungere qualcosa di simile:

class func imageWithImage(image: UIImage, scaledToSize newSize: CGSize) -> UIImage { 
    //UIGraphicsBeginImageContext(newSize); 
    UIGraphicsBeginImageContextWithOptions(newSize, false, 0.0) 
    image.drawInRect(CGRectMake(0, 0, newSize.width, newSize.height)) 
    var newImage: UIImage = UIGraphicsGetImageFromCurrentImageContext() 
    UIGraphicsEndImageContext() 
    return newImage 
} 
+0

Anche se questa non è la risposta che speravo - speravo che l'aspect fit fosse una funzione integrata - tu (e gli altri commenti e le risposte) mi hai mostrato che, nonostante quello che Apple sta cercando di fare con i layout di default, è difficile evita di specificare esattamente cosa ti serve dopo tutto. Grazie. – DrWhat

0

Il problema è se si utilizza l'imageView predefinito che non contiene alcun vincolo. Quando carichi un'immagine più grande, visualizzerà a schermo intero.

due soluzioni:

  • creare un modello di cellulare, inserire l'ImageView, e dargli vincoli nel storyboard.
  • Controllare i vincoli aggiunti all'immagineView predefinita.

Ad esempio:

let horizontalConstraint = NSLayoutConstraint(item: newView, attribute: NSLayoutAttribute.CenterX, relatedBy: NSLayoutRelation.Equal, toItem: view, attribute: NSLayoutAttribute.CenterX, multiplier: 1, constant: 0) 
newView.translatesAutoresizingMaskIntoConstraints = false 
cellView.addConstraint(horizontalConstraint) 
+0

Non penso che un modello di cella risolva il problema, come nella domanda originale, il problema esiste anche in un modello di storyboard. Ho aggiunto più dettagli alla domanda per mostrarla in modo più chiaro. Lo farei volentieri se il problema nell'altra visualizzazione dello storyboard fosse risolto. Ho provato a verificare i vincoli aggiunti all'immagine predefinita come suggerito (ma con newView = cell.imageView e cellView = self.View) e le immagini cambiano dimensione e agiscono in modo molto irregolare. Non so cosa mi dice questo. – DrWhat

0

tenta di aggiungere questo cell.imageView .layer.masksToBounds = true?.Essa può aiutare a

cell.imageView?.contentMode = .ScaleAspectFit 
    cell.imageView?.clipsToBounds = false 
    cell.imageView?.layer.masksToBounds = true 
    cell.imageView?.image = imageArray[Int(record.featureImageIndex)] 
0
  • creare una cella personalizzata con il design che si richiedono.

  • Rendere i vincoli in alto e in basso a sinistra e impostare la larghezza per la vista UII .

  • Aggiungere lo Xib personalizzato con TableView.

Spero che questo vi aiuterà a ...