Come aggiungere musica / audio all'app Flutter

Seguendo la sfida Flutter Create, ho pensato che sarebbe stato un momento di riflessione e condivisione delle conoscenze su alcune delle sfide che ho affrontato e su come ho risolto queste sfide. Uno di questi era l'aggiunta di musica alla mia app.

Dopo aver scoperto Flutter SDK non supporta la riproduzione di audio / musica, ho cercato in tutti i pacchetti disponibili che erano relativi alla musica su pub.dev e ho trovato i seguenti 6.

  1. assets_audio_player
  2. Lettore audio / Lettori audio / Lettore audio 2
  3. Lettore musicale per flauto
  4. Fluttery Audio
  5. Stereo
  6. Lettore musicale

Cercare di trovare un plug-in musicale, non così difficile. Cerchi di trovare un plug-in musicale che abbia funzionato sia su Android che su iOS? Un po 'più impegnativo.

Per evitarti di dover partire e fare le ricerche da solo, ho deciso di condividere un rapido esempio per riprodurre musica con ogni pacchetto ed elencato i problemi che ho riscontrato.

Se vuoi saltare rapidamente alla fine, troverai una tabella in cui ho riassunto i risultati chiave per ciascun pacchetto. Ho elencato se supportano Android e / o iOS, se supportano la riproduzione di file musicali ospitati in remoto, se supportano file musicali interni del dispositivo e infine se supportano la riproduzione di file musicali dalla directory delle risorse del progetto Flutter.

Vuoi ringraziarmi? Mostrare il tuo apprezzamento per questo pacchetto applaudendo Media e condividendolo sarebbe molto apprezzato!

assets_audio_player

Github | pub

Questo è stato uno dei primi pacchetti che ho provato, ma sfortunatamente non funziona su iOS. Se hai bisogno sia di iOS che di Android, evita questo.

Se non desideri supportare iOS, questo pacchetto è facile da configurare e puoi facilmente clonare il loro esempio per testare un'app di esempio del lettore musicale.

Ecco come impostare asset_audio_player 1.0.1 per riprodurre immediatamente la musica in background.

Problemi

  • Solo Android
  • Manca un metodo loop per mantenere facilmente la riproduzione audio
  • Ho scoperto che a volte l'audio non viene riprodotto per la prima volta nell'emulatore, non sono sicuro di ciò che causa questo, ma consiglio di riavviare l'emulatore e di solito funziona per me una seconda volta (non necessariamente per colpa del pacchetto ma solo farti sapere di esserne consapevole!)

Lettori audio / Lettore audio / Lettore audio 2

Github | pub

Per chiarire qualche potenziale confusione - Sì, hai letto bene, ci sono 2 versioni biforcute del primo pacchetto di Audio Player.

Scioccante, lo so!

Il pacchetto aggiornato più di recente è Lettori audio. Nonostante il suo nome, Audio Players 2 non è stato aggiornato più recentemente di Audio Player o Audio Players. Per evitare confusione, ho collegato solo il pacchetto aggiornato più di recente.

Consiglio vivamente di utilizzare i lettori audio dopo averlo usato nel mio progetto Flutter Create e averlo trovato molto facile da configurare e utilizzare. Questo è l'unico pacchetto musicale che sono riuscito a far funzionare senza problemi per iOS e Android.

Se gli sviluppatori di uno di questi 3 stanno leggendo questo, per favore contatta gli sviluppatori degli altri pacchetti di Audio Player e accetta di lavorare su un singolo pacchetto, non farà alcun favore a nessuno se ci sono 3 versioni dello stesso pacchetto .

Ecco un breve esempio del plug-in in azione

Problemi

  • Lo stesso di asset_audio_player dove a volte ho trovato che l'audio non veniva riprodotto immediatamente dopo il lancio la prima volta su un emulatore (di solito richiederebbe un riavvio dell'emulatore)
  • Impossibile riprodurre gli mp3 memorizzati in remoto utilizzando il loro URL
  • Impossibile riprodurre i file musicali interni di un dispositivo

Lettore musicale per flauto

Github | pub

Con questo plugin sei limitato a utilizzare solo la musica già presente sul dispositivo dell'utente. È all'altezza del suo nome: è la libreria perfetta se vuoi sviluppare un lettore musicale, ma sfortunatamente supporta solo Android e non sia iOS che Android.

Una cosa che mi piacerebbe vedere sarebbe una funzionalità aggiuntiva per la riproduzione dell'audio specificato dallo sviluppatore dalla directory delle risorse di Flutter.

Se hai un'esperienza di sviluppo iOS, sarebbe fantastico se tu contribuissi al progetto, quindi funzionerà sia per iOS che per Android!

Nota
Assicurati di avere la musica posizionata sul tuo dispositivo Android ogni volta che usi il progetto di esempio del plug-in e anche il progetto del lettore musicale di esempio, altrimenti (e nell'esempio sotto) non funzionerà.

Se non sei sicuro di come aggiungere rapidamente musica al tuo dispositivo emulato, trascina e rilascia un file MP3 dal PC in cui stai eseguendo l'emulatore in cui è attualmente attivo l'emulatore e inserirà automaticamente il file MP3 nel download dell'emulatore. Successivamente è necessario copiare questo file nella sezione Audio.

Una volta che hai tutte le impostazioni, puoi eseguire l'esempio seguente!

Problemi

  • Non ancora implementato per iOS (da sabato 4 maggio 2019)
  • Impossibile riprodurre mp3 nella directory delle risorse
  • Manca un metodo loop per mantenere facilmente la riproduzione audio

Fluttery Audio

Github | pub

Aggiornamento (7 ottobre 2019): sembra che questo pacchetto non sia più disponibile - sia il collegamento GitHub che il collegamento Pub non funzionano più.

Se stai cercando di riprodurre musica in streaming da una posizione remota online, Fluttery Audio ti fornirà quella funzionalità!

Anche se non sono del tutto sicuro che funzionerà con il tuo progetto iOS che ha riscontrato un problema nel far funzionare il mio esempio su iOS e nel notare che altri hanno difficoltà con il plugin su iOS.

Ogni volta che eseguivo il mio esempio su un dispositivo Android, ho riscontrato un problema a causa della mancanza del supporto AndroidX. Ciò è causato dall'utilizzo di un altro plug-in nel tuo progetto che utilizza Android X. Speriamo che presto venga aggiornato ad Android X e al momento ci sia un PR aperto che non è stato ancora unito per garantire che il pacchetto funzioni con Android X .

Ecco un breve esempio su come trasmettere in streaming un file musicale remoto non appena carichi l'app

Problemi

  • Mancanza del supporto per Android X in questo momento
  • Impossibile riprodurre file musicali dalla cartella delle risorse del progetto Flutter
  • Potrebbero avere problemi con il supporto iOS (?)
  • Non sono riuscito a farlo funzionare al di fuori della funzione di generazione
  • Manca un metodo loop per mantenere facilmente la riproduzione audio

Stereo

Github | pub

Non è un fan di come è necessario aggiornare manualmente i file interni Android e iOS. Mi piacerebbe che questo potesse essere automatizzato in una sceneggiatura. Soprattutto perché penso che potrebbe portare a ulteriori problemi se lo aggiungono al file sbagliato, ad esempio, non ho familiarità con lo sviluppo tipico di app iOS, quindi ogni volta che ho cercato Info.plist ho trovato numerosi file con lo stesso nome.

Modifiche manuali ai file - non divertenti

Ho provato diverse volte a far sì che questo riproducesse immediatamente l'audio quando l'app era aperta ma ho riscontrato un problema con il codice Android nativo che ho impiegato del tempo per eseguire il debug e capire esattamente cosa stava causando il problema. Incapace di fare ulteriori progressi, l'ho lasciato agli sviluppatori del pacchetto per ulteriori approfondimenti.

Sfortunatamente dopo aver modificato il mio esempio per provare a far funzionare il pacchetto ogni volta che si è fatto clic su un pulsante, stavo ancora riscontrando lo stesso problema sopra e quindi sfortunatamente non c'è esempio per questo pacchetto.

Problemi

  • Impossibile riprodurre musica in background dall'avvio immediato dell'app
  • Sembra che ci sia un problema irrisolto con questo pacchetto per l'API 27 di Android
  • Abbastanza difficile da configurare (forse sto facendo qualcosa di sbagliato ed è per questo che sto incontrando questi problemi, ma non dovrebbe essere così difficile)

Lettore musicale (in sviluppo)

Gitlab | pub

Attualmente in fase di sviluppo e quando ho iniziato a studiare audio / musica riproducendo plug-in, questo non aveva un esempio e ora ce n'è uno \ / / Anche se, sfortunatamente, non sono riuscito a far funzionare correttamente l'esempio ogni volta che l'ho provato.

Il plug-in nel repository è fino alla versione 0.0.6, tuttavia l'ultima versione su pub è 0.0.3, pensa che sia meglio tenere traccia dei progressi di questo plug-in e aggiornare questa sezione in futuro quando una versione più recente è stata pubblicata su pub.

Al momento penso che il pacchetto potrebbe essere solo iOS, anche se non ne sono sicuro al 100%. In questo caso, forse lo scenario migliore è costituito dagli sviluppatori di Flute Music Player e Music Player che formano un unico Music Player che offre le stesse funzionalità sia per iOS che per Android

Problemi

  • In fase di sviluppo e non pronto per l'uso

Conclusione

È sorprendente vedere tanti pacchetti musicali / audio già disponibili per Flutter, tuttavia, come puoi vedere dalla tabella qui sotto, mancano alcune caratteristiche principali per ciascuno dei pacchetti ed è importante esserne consapevoli prima di scegliere un pacchetto per utilizzare nel tuo progetto.

Ho usato "?" Per alcuni dei pacchetti in cui sentivo di non essere del tutto sicuro se sarebbe una buona idea usare il pacchetto a tale scopo, in base alle mie esperienze personali - ad esempio, potrei fare qualcosa molto sbagliato con Stereo quindi apprezzerei gli altri che condividono la loro esperienza.

Mi piacerebbe vedere alcuni degli sviluppatori di questi pacchetti lavorare insieme per produrre pacchetti 1/2 che hanno tutte queste caratteristiche chiave e, soprattutto, per le applicazioni Flutter - funziona sia su iOS che su Android.

Condividi i tuoi pensieri!

Per aiutare coloro che desiderano utilizzare uno di questi pacchetti e anche gli sviluppatori di questi pacchetti, ho pensato che sarebbe stato bello raccogliere un sondaggio per condividere le tue esperienze con i pacchetti di musica / audio di Flutter.

Mi piacerebbe se potessi compilare questo sondaggio sui pacchetti di musica / audio Flutter: https://forms.gle/JD4j9GQjgHEibJP5A

Finalmente

Grazie per aver letto! Spero che questo articolo ti abbia aiutato a selezionare il pacchetto più adatto alle tue esigenze nel tuo progetto Flutter!

Sto celebrando che arrivi alla fine di questo articolo

https://twitter.com/MarkOSullivan94