Riproduzione di video su iOS4 con MediaPlayer Framework

Questo tutorial è una panoramica dettagliata su come integrare il framework MediaPlayer e lavorare con la classe MPMoviePlayerController in iOS4. Con questa conoscenza, sarai in grado di riprodurre i media a schermo intero nelle tue applicazioni o visualizzare video come subview di dimensioni personalizzate nei tuoi controller di visualizzazione. Continua a leggere per saperne di più!

Impostazione e panoramica del progetto

Questo tutorial utilizzerà una semplice applicazione chiamata "BigBuckBunny" per dimostrare l'utilizzo del framework MediaPlayer e della classe MPMoviePlayerController per l'SDK di iOS 4. Questa app riprodurrà un clip di esempio del cortometraggio animato Big Buck Bunny del 2008. Scaricando il progetto demo allegato a questo post, sarai in grado di seguire con precisione tutti i passaggi di questo tutorial. Tuttavia, se hai già un progetto per iPhone che ti piacerebbe riprodurre i tuoi film, dovresti comunque essere in grado di seguire il tuo codice con solo lievi modifiche a questi passaggi. Il download allegato a questo post contiene due versioni del progetto: BigBuckBunny-Start dovrebbe essere usato se si desidera integrare tutti i passaggi mentre si procede, e BigBuckBunny-Completato è il risultato finale di questo tutorial.

Passaggio 1: importare MediaPlayer Framework

CTRL + Fare clic (o fare clic con il tasto destro) sulla cartella "Frameworks" nel riquadro "Groups & Files" in Xcode. Selezionare Aggiungi> Framework esistenti dal menu a discesa.

Seleziona "MediaPlayer.framework" dall'elenco delle opzioni presentate e fai clic su "Aggiungi".

Passaggio 2: Importare MediaPlayer Framework e dichiarare il metodo playMovie

Ora che hai aggiunto la struttura del media player nel tuo progetto, devi effettivamente importare il codice in quella struttura nel controller della vista che sarà responsabile della riproduzione del film. Vai al BigBuckBunnyViewController.h file e inserisci la seguente riga di codice sotto l'UIKit #importare linea:

 #importare  #importare  

Questa linea di codice renderà il controller di visualizzazione consapevole di tutto ciò che MediaPlayer.framework ha da offrire.

Successivamente, dobbiamo dichiarare un metodo di istanza del nostro controller di visualizzazione che attiverà la riproduzione del film. Appena sopra il @fine dichiarazione nel file di intestazione, aggiungere questa riga:

 -(IBAction) playMovie: (id) del mittente; 

Con la nostra playMovie metodo dichiarato, siamo pronti per iniziare a scrivere il nostro codice di implementazione del controller di visualizzazione.

Passaggio 3: implementare il metodo playMovie

Apri il BigBuckBunnyViewController.m file. Implementa il metodo playMovie con le seguenti righe di codice:

 -(IBAction) playMovie: (id) sender NSString * filepath = [[NSBundle mainBundle] pathForResource: @ "big-buck-bunny-clip" ofType: @ "m4v"]; NSURL * fileURL = [NSURL fileURLWithPath: percorso file]; MPMoviePlayerController * moviePlayerController = [[MPMoviePlayerController alloc] initWithContentURL: fileURL]; [self.view addSubview: moviePlayerController.view]; moviePlayerController.fullscreen = YES; [moviePlayerController play];  

Alla riga 3, creiamo una NSString contenente il percorso del file del nostro filmato. Alla riga 4, utilizziamo quel percorso file per creare un NSURL per il nostro film locale. Sulla linea 5 implementiamo questo passando NSURL nel initWithContentURL: metodo del MPMoviePlayerController oggetto. Si noti come abbiamo assegnato memoria per il lettore di film su questa linea; avremo bisogno di rilasciarlo più tardi! Alla riga 6, aggiungiamo la vista MPMoviePlayerController alla nostra sottoview del controller di visualizzazione personalizzata in modo che appaia sullo schermo, nella riga 7 specifichiamo che vogliamo che il video venga riprodotto in modalità a schermo intero, e sulla riga 8 iniziamo la riproduzione del filmato.

Prima di poter testare il nostro codice, dobbiamo collegare l'azione "Touch Up Inside" del nostro pulsante con il metodo playMovie. Per fare questo, apri BigBuckBunnyViewController.xib in Interface Builder. CTRL + Fare clic (o fare clic con il tasto destro) sul pulsante UIB personalizzato al centro dello schermo per visualizzare le azioni per questo elemento. Trascina dal cerchio accanto a "Touch Up Inside" all'oggetto "File's Owner", quindi seleziona il testo "playMovie:" che viene visualizzato. Salva i tuoi progressi in Interface Builder prima di tornare a Xcode.

NOTA: è necessario selezionare playMovie quando sembra completare questo passaggio. Assicurati di salvare le tue modifiche!

Se a questo punto si costruisce e si esegue il debug del progetto, si noterà che la riproduzione del film funziona come previsto quando si tocca l'UIButton personalizzato. però, non festeggiamo ancora, perché non abbiamo ancora finito.

Come accennato in precedenza, allochiamo esplicitamente memoria per l'oggetto moviePlayerController, ma non abbiamo ancora rilasciato quella memoria. Questo è uno scenario interessante. Non possiamo rilasciare esplicitamente l'oggetto nel metodo in cui lo abbiamo inserito perché il nostro film continuerà a essere riprodotto nel momento in cui questo metodo completa l'esecuzione. Inoltre, non è sicuro autorelettere l'oggetto perché non sappiamo se il nostro film verrà riprodotto la volta successiva che il pool di autorelease verrà scaricato. Fortunatamente, l'oggetto MPMoviePlayerController è precostruito per gestire questo scenario e invierà una notifica chiamata MPMoviePlayerPlaybackDidFinishNotification al NSNotificationCenter al termine della riproduzione. Per ricevere questa notifica, dobbiamo registrare un "osservatore" per rispondere a tale notifica specifica. Per fare ciò, modifica il nostro playMovie metodo come segue:

 NSString * filepath = [[NSBundle mainBundle] pathForResource: @ "big-buck-bunny-clip" ofType: @ "m4v"]; NSURL * fileURL = [NSURL fileURLWithPath: percorso file]; MPMoviePlayerController * moviePlayerController = [[MPMoviePlayerController alloc] initWithContentURL: fileURL]; [[NSNotificationCenter defaultCenter] addObserver: self-selector: @selector (moviePlaybackComplete :) nome: MPMoviePlayerPlaybackDidFinish Oggetto notazione: moviePlayerController]; [self.view addSubview: moviePlayerController.view]; moviePlayerController.fullscreen = YES; [moviePlayerController play]; 

Ora dobbiamo creare moviePlaybackComplete:, il selettore che abbiamo appena registrato. Aggiungi il seguente sotto il playMovie metodo:

 - (void) moviePlaybackComplete: notifica (NSNotification *) MPMoviePlayerController * moviePlayerController = [oggetto notifica]; [[NSNotificationCenter defaultCenter] removeObserver: self name: MPMoviePlayerPlaybackDidFinishNotification object: moviePlayerController]; [moviePlayerController.view removeFromSuperview]; [versione moviePlayerController];  

Ricorda il parametro "oggetto" che abbiamo impostato moviePlayerController nel playMovie metodo sopra? Qualsiasi oggetto impostato per quel valore viene inviato insieme alla notifica più tardi. Alla riga 3, stiamo recuperando quell'oggetto con il [oggetto di notifica] dichiarazione e riferendola con un nuovo puntatore MPMoviePlayerController. Successivamente, sulla linea 4, inviamo nuovamente un messaggio a NSNotificationCenter, questa volta rimuovendo l'osservatore in cui ci siamo registrati playMovie. Alla riga 8 puliamo il nostro controller di visualizzazione personalizzato rimuovendo la vista moviePlayerController dal nostro display, e alla riga 9 finiamo rilasciando la memoria che avevamo originariamente allocato nel playMovie metodo.

A questo punto, il nostro file di implementazione dovrebbe assomigliare a questo:

 #import "BigBuckBunnyViewController.h" @implementation BigBuckBunnyViewController - (IBAction) playMovie: (id) sender NSString * filepath = [[NSBundle mainBundle] pathForResource: @ "big-buck-bunny-clip" ofType: @ "m4v"]; NSURL * fileURL = [NSURL fileURLWithPath: percorso file]; MPMoviePlayerController * moviePlayerController = [[MPMoviePlayerController alloc] initWithContentURL: fileURL]; [[NSNotificationCenter defaultCenter] addObserver: self-selector: @selector (moviePlaybackComplete :) nome: MPMoviePlayerPlaybackDidFinish Oggetto notazione: moviePlayerController]; [self.view addSubview: moviePlayerController.view]; moviePlayerController.fullscreen = YES; [moviePlayerController play];  - (void) moviePlaybackComplete: notifica (NSNotification *) MPMoviePlayerController * moviePlayerController = [oggetto notifica]; [[NSNotificationCenter defaultCenter] removeObserver: self name: MPMoviePlayerPlaybackDidFinishNotification object: moviePlayerController]; [moviePlayerController.view removeFromSuperview]; [versione moviePlayerController];  - (void) dealloc [super dealloc];  @fine 

Congratulazioni! Ora dovresti avere un lettore di film funzionante nella tua applicazione. Il resto di questo tutorial è dedicato alla personalizzazione del giocatore.

Passaggio 4: personalizzare le dimensioni del display del film

Il tuo lavoro nel passaggio precedente ti ha permesso di riprodurre i film in modalità a schermo intero. Tuttavia, la parte migliore dei miglioramenti di MPMoviePlayerController in iOS 4 è che ora è possibile specificare una dimensione di visualizzazione personalizzata per la riproduzione all'interno dei propri controller di visualizzazione. Per trarne vantaggio, modifica il metodo playMovie come segue:

 [moviePlayerController.view setFrame: CGRectMake (38, 100, 250, 163)]; [self.view addSubview: moviePlayerController.view]; //moviePlayerController.fullscreen = YES; [moviePlayerController play]; 

Alla riga 1 creiamo una dimensione di frame personalizzata per la riproduzione del film con CGRectMake funzione. I valori che ho inserito sono stati presi da Interface Builder e corrispondono all'origine, all'altezza e alla larghezza del UIButton personalizzato che usiamo per riprodurre il film. Si noti che ho anche commentato il comando a schermo intero sulla riga 4.

Se ora generi e utilizzi il tuo codice progetto, dovresti vedere che facendo clic sul pulsante ora verrà riprodotto il video all'interno del nostro controller di visualizzazione personalizzato, proprio sopra l'UIButton. Funziona abbastanza bene, ma cosa succede se si desidera spostare il pulsante un po 'per trovare l'aspetto giusto? È un po 'macchinoso copiare costantemente i valori letterali di CGRect in ogni momento. Aggiorna il metodo playMovie per farlo dinamicamente:

 -(IBAction) playMovie: (id) mittente UIButton * playButton = (UIButton *) mittente; NSString * filepath = [[NSBundle mainBundle] pathForResource: @ "big-buck-bunny-clip" ofType: @ "m4v"]; NSURL * fileURL = [NSURL fileURLWithPath: percorso file]; MPMoviePlayerController * moviePlayerController = [[MPMoviePlayerController alloc] initWithContentURL: fileURL]; [[NSNotificationCenter defaultCenter] addObserver: self-selector: @selector (moviePlaybackComplete :) nome: MPMoviePlayerPlaybackDidFinish Oggetto notazione: moviePlayerController]; [moviePlayerController.view setFrame: CGRectMake (playButton.frame.origin.x, playButton.frame.origin.y, playButton.frame.size.width, playButton.frame.size.height)]; [self.view addSubview: moviePlayerController.view]; //moviePlayerController.fullscreen = YES; [moviePlayerController play];  

Alla riga 3 sopra, abbiamo convertito il parametro "mittente" in un oggetto UIButton come sappiamo che è il tipo di oggetto che invierà questo messaggio al nostro controller di visualizzazione. Accediamo quindi direttamente a questo oggetto per ottenere l'origine X e Y del pulsante, nonché la larghezza e l'altezza del pulsante. Con il codice sopra implementato, siamo liberi di spostare l'UIButton ovunque sulla tela e non dobbiamo preoccuparci di aggiornare costantemente la nostra chiamata alla funzione CGRectMake.

Una parola in modalità ridimensionamento

Quando si visualizza il video in un rettangolo personalizzato, a volte sarà necessario modificare il file scalingMode proprietà dell'oggetto MPMoviePlayerController. L'impostazione di questa proprietà determinerà il modo in cui l'immagine del film si adatta per riempire la dimensione di riproduzione definita. Le impostazioni della modalità di ridimensionamento disponibili sono le seguenti:

  • MPMovieScalingModeNone
  • MPMovieScalingModeAspectFit
  • MPMovieScalingModeAspectFill
  • MPMovieScalingModeFill

Ciascuna delle opzioni di cui sopra funziona come ci si potrebbe aspettare, con MPMovieScalingModeAspectFill e MPMovieScalingModeFill probabilmente sono le due modifiche più comunemente usate. La modalità di ridimensionamento predefinita è MPMovieScalingModeAspectFit.

Per sperimentare questa proprietà nel nostro codice, inserisci la seguente riga appena prima del [moviePlayerController play] dichiarazione:

 moviePlayerController.scalingMode = MPMovieScalingModeFill; 

Vedrai che il nostro video ora riempie tutto lo spazio disponibile nel rettangolo di riproduzione.

Conclusione

Questo tutorial ha presentato una introduzione fondamentale all'uso della classe MPMoviePlayerController con il framework MediaPlayer. La classe MPMoviePlayerController ha opzioni aggiuntive che non abbiamo trattato qui, ma lascerò l'esplorazione di quelle come esercizio per il lettore. Con le basi di questo tutorial, dovresti essere in grado di iniziare a sperimentare da solo! Si prega di lasciare qualsiasi feedback o domande che si possono avere nella sezione commenti qui sotto. Non esitate a inviare domande o commenti tramite il mio twitter personale @ markhammonds o l'account ufficiale Mobiletuts + twitter @mobtuts. Grazie per la lettura e buona fortuna per i tuoi progetti!