Compatibile con Xcode 8

UIImagePickerController in Swift. Recuperare ed importare le immagini dalla Libreria

ENTRA NEL NOSTRO GRUPPO FACEBOOK

Come si recupera un’immagine dalla libreria e la si importa dentro l’applicazione che stai sviluppando?

Moltissime applicazioni lo fanno. Praticamente tutte le app con componenti social ti permettono di, recuperare le immagini che hai scattato e di inserirle dentro l’applicazione per condividerle con gli amici. Altre invece lo utilizzano come strumento di personalizzazione e caratterizzazione dell’applicazione che stai utilizzando.UIImagePickerController in Swift

Per esempio, molti giochi o app, che non hanno una vera e propria parte Social (chat, condivisione ecc) ti permettono di aggiungere un’immagine per la creazione del tuo profilo. Lo scopo?

Lasciare un’impronta personale. Un punto d’incontro tra utente e applicazione.

Qualsiasi sia l’utilità che ti porterà ad importare immagini dentro la tua applicazione, dovrai utilizzare sempre e solamente l’UIImagePickerController. L’oggetto UIImagePickerController in Swift, come la stessa parola suggerisce, offre un accesso veloce alla cartella delle immagini e video.

Ma non solo. L’UIImagePickerController in Swift contiene un’interfaccia preconfezionata e la logica necessaria per recuperare e selezionare le immagini. Questo significa che, una volta creato questo oggetto, dovrai semplicemente selezionare l’immagine o video necessario e premere importa per ritrovartele dentro la tua applicazione iOS.

Abbastanza chiaro, no? Se lo sono stato, passiamo ai fatti e vediamo come implementare l’UIImagePickerController in Swift.

UIImagePickerController

Per prima cosa crea un nuovo progetto iOS Single View Application con il linguaggio Swift. Una volta fatto, passa allo Storyboard ed aggiungi una UIImageView ed un UIButton. Vincolali nel modo che ritieni più appropriato. Infine, crea una IBAction per il bottone (io l’ho chiamata importPhoto_clicked) ed una IBOutlet per l’image view (myImage).

Il bottone lo utilizzerai per aprire l’ImagePicker da cui potrai scegliere l’immagine. Mentre l’image view, una volta presa l’immagine, la mostrerà:

Schermata 2016-02-14 alle 17.05.35

Se non ti ricordi come si creano i vincoli di auto layout, rinfrescati la memoria con l’Introduzione alle interfacce Universali con l’Auto Layout in XcodeSe tutto ciò ti sembra uscito da qualche libro di Harry Potter, forse è meglio che ascolti il mio consiglio e parti da qualcosa di più semplice o dalle basi dello sviluppo.

La mia premessa, l’ho fatta. Adesso continuiamo!

L’oggetto UIImagePickerController, come ti dicevo, fornisce un accesso alla libreria delle tue immagini e video grazie ad un’interfaccia di sistema. L’interfaccia dell’ImagePicker non ha bisogno di essere creata perché è già contenuta all’interno dell’oggetto UIImagePickerController, quindi, l’unica cosa che ti serve è creare un’istanza di tale oggetto all’interno della tua interfaccia.

Nella tua classe ViewController, crea una proprietà di tipo UIImagePickerController opzionale. Infine, istanziala nel metodo viewDidLoad:

Se classe, opzionalità o proprietà ti suonano come cose nuove vuol dire che ti mancano le basi dello sviluppo. Se ti va, ho scritto un corso gratuito dove spiego le basi della programmazione con il linguaggio Swift.

A questo punto hai un ImagePickerController pronto ad essere utilizzato.

Ma come funziona?

Il funzionamento dell’UIImagePickerController

L’UIImagePickerController ti permette di recuperare le immagini da tre tipi di sorgente. Cioè ti da la possibilità di prendere le immagini direttamente dalla Fotocamera, dagli Album oppure dalla cartella delle Immagini. Non ci sono limitazioni al formato che puoi recuperare. Puoi importare sia video che foto senza nessun problema. Noi ovviamente stiamo studiando solo la possibilità di importare immagini.

La sorgente dell’UIImagePickerController in Swift va definita modificando la proprietà sourceType che è di tipo UIImagePickerControllerSourceType. Il sourceType è un Enum di possibili scelte (Gli Enum li ho spiegato nel corso gratuito). I valori possibili, dunque, sono:

  • .Camera: Se vuoi recuperare ed importare dentro la tua app un’immagine o video scattandola con la fotocamera.
  • .PhotoLibrary: Accederai alla Libreria di iOS dove contieni tutte le foto e video.
  • .PhotoAlbum: Accede alla lista degli Album della libreria.

Una volta definito il sourceType del tuo Image Picker potrai finalmente aprirlo dentro la tua applicazione per permettere all’utente di selezionare l’immagine o video preferito.

Come viene mostrato?

Essendo un Controller, cioè una subclass della UIViewController, dovrai presentarlo utilizzando il metodo presentViewController (sotto vedrai come). Questo metodo farà comparire il Controller sopra l’interfaccia corrente. In pratica, vedrai apparire una interfaccia di selezione (L’ImagePicker) sopra l’attuale ViewController. Appena l’utente avrà selezionato l’immagine, potrà chiudere l’ImagePickerController per ritornare al tuo ViewController (può anche non selezionare immagini).

Una volta che l’utente chiuderà il Picker, verrà invocato il metodo didFinishPickingMediaWithInfo che ti permetterà di accedere alle immagini selezionate.

Ma arriviamoci per step.

Visualizzare l’ImagePicker

Dato che l’UIImagePickerController si trova dentro la classe ViewController, devi rendere quest’ultima delegata alla gestione dei metodi dell’ImagePicker. In più, dovrai aggiungere il delegate UINavigationControllerDelegate per gestire la navigazione dal ViewController all’ImagePickerController. Quindi, nella definizione della classe, aggiungi il protocollo UIImagePickerControllerDelegate e UINavigationControllerDelegate:

Una volta fatto dovrai rendere il viewController delegato del UIImagePicker. Nel metodo viewDidLoad, assegna self (cioè il ViewController) alla proprietà delegate del imagePickerController:

Adesso, nella IBAction associata al tuo bottone, aggiungi il seguente codice:

Settando la proprietà allowEditing a false blocchi la possibilità di modificare le immagini durante la selezione. Successivamente viene scelto il sourceType in cui prendere le foto (.PhotoLibrary significa che entrerai nella libreria di sistema). Infine, il metodo presentViewController mostrerà sullo schermo l’imagePickerController.

Se stai sviluppando utilizzando il simulatore di Xcode, fai attenzione perché il sourceType .Camera, per ovvi motivi, non ti permetterà di scattare nessuna foto.

Se vuoi investigare maggiormente questi passaggi o comunque vuoi approfondire lo sviluppo delle applicazioni, puoi seguire il mio corso sullo sviluppo delle applicazioni iOS con Swift.

Adesso avvia l’applicazione. Dovrebbe chiederti di sbloccare l’accesso alla libreria ed, una volta accettato, sarai in grado di visualizzare e selezionare le immagini di sistema:

uiimagePickerController in swift recuperare foto

Tutto sembra andare per il verso giusto. Una volta premuto il bottone, viene presentato L’UIImagePickerController che mostra la cartella delle immagini del simulatore (nella realtà sarà del dispositivo dell’utente). Una volta selezionata un’immagine, oppure se si preme il tasto Cancel, si ritornerà al ViewController della tua applicazione.

Adesso manca solamente poter visualizzare l’immagine recuperata.

Visualizzare l’immagine selezionata dal Picker

Quando l’utente seleziona una immagine, l’UIImagePickerController viene chiuso e contemporaneamente viene invocato il metodo didFinishPickingMediaWithInfo. Tale metodo ha un attributo, chiamato info, che contiene le informazioni selezionate dall’utente.

Ho detto informazioni perché l’attributo info è un dizionario di tipo [NSObject:AnyObject]. Dato che è un dizionario del linguaggio Swift le sue chiavi ti permettono di accedere a dei valori o informazioni dell’immagine. Per esempio puoi utilizzare le seguenti chiavi per:

  • UIImagePickerControllerMediaType: Il valore associato a questa chiave definisce se l’elemento selezionato è un’immagine o un video.
  • UIImagePickerControllerOriginalImage: Puoi recuperare l’immagine selezionata originale e non modificata.
  • UIImagePickerControllerEditedImage: Recupera l’immagine modificata.
  • UIImagePickerControllerCropRect: Restituisce il rettangolo di taglio dell’immagine.
  • UIImagePickerControllerMediaURL: URL del video cioè il percorso all’interno del filesystem in cui si trova il video.
  • UIImagePickerControllerReferenceURL: URL del percorso dell’immagine all’interno della cartella di sistema.
  • UIImagePickerControllerMediaMetadata: Le informazioni tecniche riguardanti l’immagine scattata.
  • UIImagePickerControllerLivePhoto: L’immagine in formato LivePhoto (iOS 9 e iPhone 6S/Plus e successivi).

Detto ciò, impostando il parametro ad info[UIImagePickerControllerOriginalImage], se l’elemento selezionato è un’immagine, il valore associato a tale chiave dovrebbe restituire una UIImage. Questa UIImage può essere passata alla tua ImageView per la visualizzazione:

Grazie all’istruzione guard, il codice, esegue un controllo sull’esistenza del valore associato alla chiave UIImagePickerControllerOriginalImage e, se esiste, esegue il cast in UIImage (as? UIImage). Se l’oggetto selezionato non dovesse essere una image verrebbe attivato l’else. Una volta passata la selectedImage alla myImageView, il metodo dismissViewControllerAnimated chiude l’UIImagePickerController.

Se adesso avvii l’applicazione dovresti essere in grado di recuperare un’immagine e di visualizzarla nella tua ImageView:

UIImagePickerController in Swift

Solo per completezza. Quando l’utente seleziona il bottone “Cancel”, ovvero quando non vuole prendere nessun’immagine o video, viene invocato il metodo  imagePickerControllerDidCancel. Qui potresti avvisare l’utente del fatto che non ha selezionato un’immagine e forzarlo a sceglierla.

Forzarlo in che senso?

Perché se implementi il metodo e non esegui un dismiss del pickerController, non potrai uscire e ritornare indietro al tuo ViewController. Fai una prova:

Se avvii l’applicazione ed entri nel PickerImage, vedrai che premendo il tasto Cancel non potrai tornare indietro. Per farlo ti servirà aggiungere il dismissViewController:

Considerazioni

Adesso che sai implementare l’UIImagePickerController in Swift potrai finalmente importare le immagini o i video dentro le tue future applicazioni iOS. Per esempio, un tutorial che adesso ti consiglio di seguire è quello relativo alla creazione di un’app di Foto Editing con i filtri fotografici.

Download del progetto

[sociallocker][wpdm_package id=’42589′][/sociallocker]

Buona Programmazione!

Start typing and press Enter to search

Come installare e usare Cocoapods. Velocizza lo sviluppo delle tue applicazioni iOS!SpeechSynthesizer in Swift