Google utilizza la tecnologia AI per tradurre i contenuti nella tua lingua preferita. Le traduzioni generate dall'AI potrebbero contenere errori.

Incorporare video di YouTube nelle applicazioni iOS con la libreria helper di YouTube

Il youtube-ios-player-helper è una libreria open source che ti aiuta a incorporare un player iframe di YouTube in un'applicazione iOS. La libreria crea un WebView e un ponte tra il codice Objective-C della tua applicazione e il codice JavaScript del player di YouTube, consentendo così all'applicazione iOS di controllare il player di YouTube. Questo articolo descrive i passaggi per installare la libreria e iniziare a utilizzare dalla tua applicazione iOS.

Installazione

Questo articolo presuppone che tu abbia creato un nuovo progetto iOS Single View Application destinato all'ultima versione di iOS e che tu abbia aggiunto i seguenti file durante la creazione del progetto:

Main.storyboard
ViewController.h
ViewController.m

Puoi installare la libreria tramite CocoaPods o copiando la libreria e i file di origine dalla pagina GitHub del progetto.

La libreria è disponibile per l'installazione tramite CocoaPods. In alternativa, la libreria e i file di origine sono disponibili nella pagina GitHub del progetto e possono essere copiati in un progetto esistente progetto.

Installare la libreria tramite CocoaPods

Se il tuo progetto utilizza CocoaPods, aggiungi la riga seguente al Podfile per installare la libreria. In questa riga, sostituisci x.y.z con l'ultima versione del pod, che verrà identificata nella pagina GitHub del progetto.

pod "youtube-ios-player-helper", "~> x.y.z"

Al prompt della riga di comando, digita pod install per aggiornare l'area di lavoro con le dipendenze.

Suggerimento: ricorda che quando utilizzi CocoaPods, devi aprire il file .xcworkspace in Xcode, non il file .xcodeproj.

Per saperne di più, consulta il tutorial CocoaPods.

Installare manualmente la libreria

Per installare manualmente la libreria di assistenza, scarica l'origine tramite il link di download di GitHub o clona il repository. Una volta che hai una copia locale del codice, segui questi passaggi:

Apri il progetto di esempio in Xcode o Finder.
Seleziona YTPlayerView.h, YTPlayerView.m e la cartella Asset. Se apri l'area di lavoro in Xcode, questi file sono disponibili in Pods -> Development Pods -> YouTube-Player-iOS-Helper e Pods -> Development Pods -> YouTube-Player-iOS-Helper -> Resources. In Finder, questi file sono disponibili nella directory principale del progetto nelle directory Classes e Assets.
Trascina questi file e cartelle nel tuo progetto. Assicurati che l'opzione Copy items into destination group’s folder (Copia gli elementi nella cartella del gruppo di destinazione) sia selezionata. Quando trascini la cartella Assets, assicurati che l'opzione Create Folder References for any added folders (Crea riferimenti alle cartelle per tutte le cartelle aggiunte) sia selezionata.

La libreria dovrebbe essere installata.

Aggiungere un `YTPlayerView` tramite Interface Builder o Storyboard

Per aggiungere un YTPlayerView tramite Interface Builder o Storyboard:

Trascina un'istanza UIView nella visualizzazione.
Seleziona Identity Inspector e modifica la classe della visualizzazione in YTPlayerView.

Apri ViewController.h e aggiungi l'intestazione seguente:

#import “YTPlayerView.h”

Aggiungi anche la seguente proprietà:

@property(nonatomic, strong) IBOutlet YTPlayerView *playerView;

In Interface Builder, crea una connessione dall'elemento View che hai definito nel passaggio precedente alla proprietà playerView del controller della visualizzazione.
Ora apri ViewController.m e aggiungi il seguente codice alla fine del metodo viewDidLoad:
```
[self.playerView loadWithVideoId:@"M7lc1UVf-VE"];
```

Crea ed esegui l'applicazione. Quando viene caricata la miniatura del video, toccala per avviare il video player a schermo intero.

Controllare la riproduzione dei video

Il metodo ViewController::loadWithVideoId: ha una variante, loadWithVideoId:playerVars:, che consente agli sviluppatori di passare ulteriori variabili del player alla visualizzazione. Queste variabili del player corrispondono ai parametri del player nell' API IFrame Player. Il parametro playsinline consente di riprodurre il video direttamente nella visualizzazione anziché a schermo intero. Quando un video viene riprodotto in linea, l' applicazione iOS contenente può controllare la riproduzione a livello di programmazione.

Sostituisci la chiamata loadWithVideoId: con questo codice:

NSDictionary *playerVars = @{
  @"playsinline" : @1,
};
[self.playerView loadWithVideoId:@"M7lc1UVf-VE" playerVars:playerVars];

Apri lo storyboard o Interface Builder. Trascina due pulsanti nella visualizzazione, etichettandoli Riproduci e Interrompi. Apri ViewController.h e aggiungi questi metodi, che verranno mappati ai pulsanti:

- (IBAction)playVideo:(id)sender;
- (IBAction)stopVideo:(id)sender;

Ora apri ViewController.m e definisci queste due funzioni:

- (IBAction)playVideo:(id)sender {
  [self.playerView playVideo];
}

- (IBAction)stopVideo:(id)sender {
  [self.playerView stopVideo];
}

La maggior parte delle funzioni dell'API IFrame Player ha equivalenti Objective-C, anche se alcuni dei nomi potrebbero differire leggermente per corrispondere più da vicino alle linee guida di codifica Objective-C. Le eccezioni degne di nota sono i metodi che controllano il volume del video, poiché questi sono controllati dall'hardware del telefono o con istanze UIView integrate progettate per questo scopo, come MPVolumeView.

Apri lo storyboard o Interface Builder e trascina con il tasto Ctrl premuto per collegare i pulsanti Riproduci e Interrompi ai metodi playVideo: e stopVideo:.

Ora crea ed esegui l'applicazione. Una volta caricata la miniatura del video, dovresti essere in grado di riprodurre e interrompere il video utilizzando i controlli nativi oltre ai controlli del player.

Gestire i callback del player

Può essere utile gestire a livello di programmazione gli eventi di riproduzione, come le modifiche dello stato di riproduzione e gli errori di riproduzione. Nell'API JavaScript, questa operazione viene eseguita con i listener di eventi. In Objective-C,questa operazione viene eseguita con un delegato.

Il seguente codice mostra come aggiornare la dichiarazione dell'interfaccia in ViewController.h in modo che la classe sia conforme al protocollo del delegato. Modifica la dichiarazione dell'interfaccia di ViewController.h come segue:

@interface ViewController : UIViewController<YTPlayerViewDelegate>

YTPlayerViewDelegate è un protocollo per la gestione degli eventi di riproduzione nel player. Per aggiornare ViewController.m in modo da gestire alcuni eventi, devi prima impostare l'istanza ViewController come delegato dell'istanza YTPlayerView. Per apportare questa modifica, aggiungi la seguente riga al metodo viewDidLoad in ViewController.h.

self.playerView.delegate = self;

Ora aggiungi il seguente metodo a ViewController.m:

- (void)playerView:(YTPlayerView *)playerView didChangeToState:(YTPlayerState)state {
  switch (state) {
    case kYTPlayerStatePlaying:
      NSLog(@"Started playback");
      break;
    case kYTPlayerStatePaused:
      NSLog(@"Paused playback");
      break;
    default:
      break;
  }
}

Crea ed esegui l'applicazione. Guarda l'output dei log in Xcode mentre lo stato del player cambia. Dovresti vedere gli aggiornamenti quando il video viene riprodotto o interrotto.

Per comodità e leggibilità, la libreria fornisce le costanti che iniziano con il prefisso kYT* per convenienza e leggibilità. Per un elenco completo di queste costanti, consulta YTPlayerView.m.

Best practice e limitazioni

La libreria si basa sull'API IFrame Player creando un WebView e eseguendo il rendering di HTML e JavaScript necessari per un player di base. L'obiettivo della libreria è essere il più facile possibile da usare, raggruppando in un pacchetto i metodi che gli sviluppatori devono scrivere di frequente. Esistono alcune limitazioni da tenere presenti:

La libreria non supporta la riproduzione simultanea di video in più YTPlayerView istanze. Se la tua applicazione ha multiple YTPlayerView istanze, una best practice consigliata è mettere in pausa o interrompere la riproduzione in tutte le istanze esistenti prima di avviare la riproduzione in un'altra istanza. Nell'applicazione di esempio fornita con il progetto, i ViewController utilizzano NSNotificationCenter per inviare notifiche che la riproduzione sta per iniziare. Gli altri ViewController ricevono una notifica e mettono in pausa la riproduzione nelle rispettive YTPlayerView istanze.
Riutilizza le istanze YTPlayerView esistenti e caricate quando possibile. Quando è necessario modificare un video in una visualizzazione, non creare una nuova istanza UIView o una nuova istanza YTPlayerView e non chiamare loadVideoId: o loadPlaylistId:. Utilizza invece la cueVideoById:startSeconds: famiglia di funzioni, che non ricarica la WebView. Si verifica un ritardo notevole durante il caricamento dell'intero player iframe.
Questo player non può riprodurre video privati, ma può riprodurre video non in elenco. Poiché questa libreria esegue il wrapping del player iframe esistente, il comportamento del player dovrebbe essere quasi identico a quello di un player incorporato in una pagina web in un browser mobile.

Contributi

Poiché si tratta di un progetto open source, invia correzioni e miglioramenti al ramo principale del progetto GitHub.

Incorporare video di YouTube nelle applicazioni iOS con la libreria helper di YouTube Mantieni tutto organizzato con le raccolte Salva e classifica i contenuti in base alle tue preferenze.