iOS
UIImageView

Crea un UIImageView

Per creare una UIImageView a livello di UIImageView , tutto ciò che devi fare è creare un'istanza di UIImageView :

//Swift
let imageView = UIImageView()

//Objective-C
UIImageView *imageView = [[UIImageView alloc] init];

È possibile impostare la dimensione e la posizione di UIImageView con un CGRect :

//Swift
imageView.frame = CGRect(x: 0, y: 0, width: 200, height: 200)

//Objective-C
imageView.frame = CGRectMake(0,0,200,200);

Oppure puoi impostare la dimensione durante l'inizializzazione:

//Swift
UIImageView(frame: CGRect(x: 0, y: 0, width: 200, height: 200))

//Objective-C
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0,0,200,200);

//Alternative way of defining frame for UIImageView
UIImageView *imageView = [[UIImageView alloc] init];
CGRect imageViewFrame = imageView.frame;
imageViewFrame.size.width = 200;
imageViewFrame.size.height = 200;
imageViewFrame.origin.x = 0;
imageViewFrame.origin.y = 0;
imageView.frame = imageViewFrame;

Nota: è necessario importare UIKit per utilizzare UIImageView .

Assegnazione di un'immagine a UIImageView

È possibile assegnare un'immagine a UIImageView durante l'inizializzazione o in seguito utilizzando la proprietà image :

//Swift
UIImageView(image: UIImage(named: "image1"))

UIImageView(image: UIImage(named: "image1"), highlightedImage: UIImage(named: "image2"))

imageView.image = UIImage(named: "image1") 

//Objective-C
[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image1"];

[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image1"] highlightedImage:[UIImage imageNamed:@"image2"]];

imageView.image = [UIImage imageNamed:@"image1"];

Animazione di UIImageView

È possibile animare una UIImageView visualizzando rapidamente le immagini su di essa in una sequenza utilizzando le proprietà di animazione di UIImageView :

imageView.animationImages = [UIImage(named: "image1")!,
                             UIImage(named: "image2")!,
                             UIImage(named: "image3")!,
                             UIImage(named: "image4")!,
                             UIImage(named: "image5")!,
                             UIImage(named: "image6")!,
                             UIImage(named: "image7")!,
                             UIImage(named: "image8")!] 
imageView.animationDuration = 0.3
imageView.animationRepeatCount = 1

La proprietà animationImages è una Array di UIImages che viene eseguita dall'alto verso il basso quando viene attivata l'animazione.

La proprietà animationDuration è un Double dice quanti secondi per cui verrà eseguita l'animazione.

La proprietà animationRepeatCount è una Int che dice quante volte verrà eseguita l'animazione.

Per avviare e interrompere l'animazione, puoi chiamare i metodi appropriati per farlo:

imageView.startAnimating()
imageView.stopAnimating()

C'è un metodo isAnimating() che restituisce un valore Boolean indica se l'animazione è in esecuzione in un momento oppure no.

Si noti che questo non è un modo molto efficiente per creare animazioni: è piuttosto lento e richiede molte risorse. Prendi in considerazione l'utilizzo di livelli o sprite per risultati migliori

Rendere un'immagine in un cerchio o arrotondato

Questo esempio mostra come creare un UIView o UIImageView , arrotondato con un raggio di questo tipo:

Objective-C

someImageView.layer.cornerRadius = CGRectGetHeight(someImageView.frame) / 2;
someImageView.clipsToBounds = YES;

veloce

someImageView.layer.cornerRadius = someImageView.frame.height/2
// this should alleviate the performance hit that adding transparency may cause - see http://stackoverflow.com/a/6254531/189804
// Be sure to check scrolling performance with Instruments if you take this approach.
someImageView.layer.shouldRasterize = true
someImageView.clipsToBounds = true // All parts of the image that are outside its bounds (the frame) are cut out (makes the rounded corners visible)

Si suggerisce che se si utilizza layout automatico che si inserisce il someImageView.layer.cornerRadius codice viewDidLayoutSubviews . Ciò consentirà cornerRadius dell'immagine di aggiornarsi se l'immagine cambia dimensione.

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    someImageView.layer.cornerRadius = someImageView.frame.size.width/2
    someImageView.layer.masksToBounds = true
}

UIImmagine mascherata con etichetta

Ciò rende l'immagine mascherata dalla forma delle lettere dell'etichetta:

Objective-C

self.maskImage.layer.mask = self.maskLabel.layer;
self.maskImage.layer.masksToBounds = YES;

Swift 3

maskImageView.mask = maskLabel
maskImageView.masksToBounds = true

Ecco il risultato:

Cambia colore di un'immagine

//Swift
imageView.tintColor = UIColor.redColor()
imageView.image = imageView.image?.imageWithRenderingMode(.AlwaysTemplate)

//Swift 3
imageView.tintColor = UIColor.red
imageView.image = imageView.image?.withRenderingMode(.alwaysTemplate)

//Objective-C
imageView.tintColor = [UIColor redColor];
imageView.image = [imageView.image imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate]

In che modo la proprietà Mode influisce su un'immagine

La proprietà in modalità contenuto di una vista indica come deve essere definito il contenuto. In Interface Builder, le varie modalità possono essere selezionate nell'Inspector degli attributi.

Usiamo due immagini per vedere come funzionano le varie modalità.

Ridimensiona per riempire

Le altezze e le larghezze dell'immagine sono allungate per adattarsi alle dimensioni di UIImageView .

Vestibilità

Il lato più lungo (altezza o larghezza) dell'immagine è allungato per adattarsi alla vista. Ciò rende l'immagine più grande possibile mentre mostra ancora l'intera immagine e non distorce l'altezza o la larghezza. (Ho impostato lo sfondo di UIImageView su blu in modo che la sua dimensione sia chiara.)

Aspetto Riempimento

Il lato più corto (altezza o larghezza) dell'immagine è allungato per adattarsi alla vista. Come "Aspect Fit", le proporzioni dell'immagine non sono distorte dalle proporzioni originali.

Ridisegna

Il ridisegno è solo per le visualizzazioni personalizzate che devono eseguire il ridimensionamento e il ridimensionamento. Non stiamo usando una vista personalizzata, quindi non dovremmo usare Redraw. Notare che qui UIImageView ci dà solo lo stesso risultato di Scale to Fill, ma sta facendo più lavoro dietro le quinte.

A proposito di Redraw, la documentazione di Apple dice:

Le modalità di contenuto sono utili per riciclare i contenuti della vista, ma è anche possibile impostare la modalità di contenuto sul valore UIViewContentModeRedraw quando si desidera che le proprie viste personalizzate UIViewContentModeRedraw ridisegnate durante il ridimensionamento e il ridimensionamento delle operazioni. Impostando la modalità di contenuto della vista su questo valore, il sistema richiama il drawRect: della tua vista drawRect: metodo in risposta alle modifiche della geometria. In generale, dovresti evitare di usare questo valore quando possibile, e non dovresti certamente usarlo con le viste di sistema standard.

Centro

L'immagine è centrata nella vista, ma la lunghezza e la larghezza dell'immagine non sono allungate.

Superiore

Il bordo superiore dell'immagine è centrato orizzontalmente nella parte superiore della vista e la lunghezza e la larghezza dell'immagine non sono allungate.

Parte inferiore

Il bordo inferiore dell'immagine è centrato orizzontalmente nella parte inferiore della vista e la lunghezza e la larghezza dell'immagine non vengono allungate.

Sinistra

Il bordo sinistro dell'immagine è centrato verticalmente a sinistra della vista e la lunghezza e la larghezza dell'immagine non sono allungate.

Destra

Il bordo destro dell'immagine è centrato verticalmente a destra della vista e la lunghezza e la larghezza dell'immagine non sono allungate.

In alto a sinistra

L'angolo in alto a sinistra dell'immagine è posizionato nell'angolo in alto a sinistra della vista. La lunghezza e la larghezza dell'immagine non sono allungate.

In alto a destra

L'angolo in alto a destra dell'immagine è posizionato nell'angolo in alto a destra della vista. La lunghezza e la larghezza dell'immagine non sono allungate.

In basso a sinistra

L'angolo in basso a sinistra dell'immagine è posizionato nell'angolo in basso a sinistra della vista. La lunghezza e la larghezza dell'immagine non sono allungate.

In basso a destra

L'angolo in basso a destra dell'immagine è posizionato nell'angolo in basso a destra della vista. La lunghezza e la larghezza dell'immagine non sono allungate.

Gli appunti

• Questo esempio viene originariamente da qui .

• Se il contenuto (nel nostro caso l'immagine) ha le stesse dimensioni della vista (nel nostro caso UIImageView ), la modifica della modalità di contenuto non farà alcuna differenza evidente.

• Consulta questa e questa domanda per una discussione sulle modalità di contenuto per le visualizzazioni diverse da UIImageView .

• In Swift, per impostare la modalità di contenuto a livello di programmazione, fai quanto segue:

    imageView.contentMode = UIViewContentMode.scaleToFill
    imageView.contentMode = UIViewContentMode.scaleAspectFit
    imageView.contentMode = UIViewContentMode.scaleAspectFill
    imageView.contentMode = UIViewContentMode.redraw
    imageView.contentMode = UIViewContentMode.center
    imageView.contentMode = UIViewContentMode.top
    imageView.contentMode = UIViewContentMode.bottom
    imageView.contentMode = UIViewContentMode.left
    imageView.contentMode = UIViewContentMode.right
    imageView.contentMode = UIViewContentMode.topLeft
    imageView.contentMode = UIViewContentMode.topRight
    imageView.contentMode = UIViewContentMode.bottomLeft
    imageView.contentMode = UIViewContentMode.bottomRight