Kuvage YouTube'i, Vimeo ja Dailymotioni videoid oma Androidi rakendustes

Autor: Laura McKinney
Loomise Kuupäev: 3 Aprill 2021
Värskenduse Kuupäev: 16 Mai 2024
Anonim
Kuvage YouTube'i, Vimeo ja Dailymotioni videoid oma Androidi rakendustes - Rakendused
Kuvage YouTube'i, Vimeo ja Dailymotioni videoid oma Androidi rakendustes - Rakendused

Sisu


Kui MediaController on ekraanil nähtav, saate videot mängida, peatada, tagasi kerida ja edasi kerida ning klipi mis tahes punkti liikuda, lohistades MediaControlleri edenemisriba.

YouTube'i videote manustamine oma Androidi rakendusse

Videofaili manustamine oma rakenduses on suurepärane viis tagada, et video on alati saadaval, olenemata seadme Interneti-ühendusest. Mitmete suurte ja suure eraldusvõimega videote manustamine oma rakendusse on aga ka suurepärane viis APK suuruse suurendamiseks!

Kui tunnete muret APK suuruse pärast või kui teie rakendus sisaldab videoid, millele on kenasti lisad lisatud, võiksite need videod veebiplatvormil avaldada ja seejärel rakenduse kaudu voogesituse ajal voogesitada.

Videote veebis avaldamise osas on üks veebisait, mis kohe meelde tuleb, nii et selles jaotises näitan teile, kuidas manustada mis tahes YouTube'i video teie rakenduses, kasutades YouTube'i Android Playeri API kliendikogusid.


YouTube'i video ID hankimine

Alustamiseks peate otsustama, millist YouTube'i videot soovite kuvada, ja seejärel hankima selle kordumatu video ID.

Võite kasutada ükskõik millist YouTube'i videot, kuid ma valin valiku 2018. aasta lemmiktehnika. Laadige valitud video ja vaadake selle brauseri aadressiribale selle URL-i, näiteks video URL on:

youtube.com/watch?v=hJLBcViaX8Q

ID on URL-i osa, mis selle video ainulaadselt tuvastab, mis on URL-i lõpus olev tähemärkide jada (põhimõtteliselt kõik pärast sümbolit „=”). Video video ID on:

hJLBcViaX8Q

Pange oma video ID üles, kuna me kasutame seda hiljem.

Hankige oma projekti SHA-1 sõrmejälg

YouTube'i Android Playeri API-le juurdepääsu saamiseks peate genereerima Androidi piirangutega API-võtme. See hõlmab API-võtme ühendamist projekti unikaalse paketi nime ja sertifikaadi sõrmejäljega (SHA-1).


Gradle'i konsooli kaudu saate hankida projekti SHA-1 sõrmejälje:

  • Valige vahekaart Gradle Android Studio akna paremas servas.
  • Valige moodul „rakendus”, millele järgneb „Ülesanded> Android> SigningReport”.

  • Avage vahekaart Gradle Console, mis kuvatakse ekraani paremas alanurgas.
  • Gradle'i konsool avaneb automaatselt. Leidke sellest aknast väärtus SHA-1 ja tehke sellest märge.

Kasutame silumissertifikaadi sõrmejälge, mis sobib ainult rakenduse testimiseks. Enne rakenduse avaldamist peaksite alati genereerima uue API-võtme, mis põhineb selle rakenduse väljaandesertifikaadil.

Registreeruge Google API konsoolis

Enne YouTube Android Playeri API kasutamist peate registreerima oma rakenduse Google API konsoolis:

  • Minge üle API konsooli.
    Valige päises oma praeguse projekti nimi (kus kursor paikneb järgmises ekraanipildis).

  • Järgmises aknas valige “Uus projekt”.
  • Pange oma projektile nimi ja klõpsake siis nuppu "Loo".
  • Valige vasakpoolses menüüs „Volikirjad”.
  • Klõpsake sinisel nupul „Loo mandaat” ja valige siis „API võti”.
  • Teie API-võti ilmub nüüd hüpikmenüüsse, mis sisaldab viidet selle API-võtme piiramiseks. Piiratud võtmed on turvalisemad, nii et kui te ei vaja konkreetselt piiranguteta API võtit, valige „Piira võtit”.
  • Järgmisel ekraanil andke oma API-võtmele eristav nimi.
  • Valige raadionupp „Androidi rakendused”.
  • Klõpsake nuppu „Lisa paketi nimi ja sõrmejälg”.
  • Kopeerige / kleepige projekti SHA-1 sõrmejälg järgmisesse jaotisse ja sisestage seejärel oma projekti paketi nimi (mis kuvatakse iga Java-klassi faili ülaosas ja projekti manifestis).
  • Kui olete sisestatud teabega rahul, klõpsake nuppu „Salvesta”.

Laadige alla YouTube'i Android Playeri API

Järgmisena peate alla laadima YouTube'i Android Playeri API kliendikogumi. Selle teegi kasutamisel on soovitatav lubada ProGuard, et hoida oma APK võimalikult kergena.

Oma projekti YouTube'i teegi lisamine:

  • Minge YouTube'i Android Playeri veebisaidile ja laadige alla uusim versioon.
  • Paki järgnev ZIP-fail lahti.
  • Avage äsja lahti pakitud kaust ja liikuge selle alamkausta libs - see peaks sisaldama faili “YouTubeAndroidPlayerApi.jar”.
  • Lülitage Android Stuudios üle vaatele „Projekt“.
  • Et tagada YouTube'i teegi kaasamine teie ehitamisteedesse, peate importima .jari projekti projekti jaotisesse „/ libs ”kataloog. Avage projekti kaust „rakendus / libid” ja lohistage .jar oma kohale.

  • Avage oma fail build.gradle ja lisage YouTube'i teek projekti sõltuvusena:

sõltuvused {rakendusfailTree (dir: libid, sisaldab:) juurutamine com.android.support:appcompat-v7:28.0.0 teostus com.android.support:design:28.0.0 teostus com.android.support.constraint: kitsendus-paigutus : 1.1.3 testImplementation junit: junit: 4.12 androidTestImplementation com.android.support.test: runner: 1.0.2 // Lisage järgmised // rakendusfailid (libs / YouTubeAndroidPlayerApi.jar)}

  • Kui küsitakse, sünkroonige oma Gradle'i failid.

Uuendage oma manifesti

Kui teie rakendus kuvatakse mis tahes veebisisu, siis vajab ta juurdepääsu Internetile.

Avage projekti manifest ja lisage Interneti luba:

Kasutajale selle kinemaatilise laiekraanielamuse maitse saamiseks seadin MainActivity ka maastiku režiimis käivitamiseks:

YouTube Playeri paigutuse loomine

YouTube'i videot saate kuvada, kasutades ühte järgmistest viisidest.

  • YouTubePlayerView. Kui soovite oma paigutuses kasutada YouTubePlayerView, peate laiendama YouTubeBaseActivity selle paigutuse vastavas tegevusklassis.
  • YouTubePlayerFragment. See on fragment, mis sisaldab YouTubePlayerView-d. Kui otsustate rakendada YouTubePlayerFragment, siis teie ei tee peavad laienema YouTubeBaseActivity-st.

Kasutan YouTubePlayerView'd, seega avage projekti fail “activity_main.xml” ja lisage YouTubePlayerView-vidin:

YouTube Playeri juurutamine

Järgmisena avage oma MainActivity ja täitke järgmised ülesanded:

1. Laiendage YouTubeBaseActivity

Kuna me kasutame oma paigutuses YouTubePlayerView, peame laiendama YouTubeBaseActivity:

avaliku klassi MainActivity laiendab YouTubeBaseActivity {

2. Käivitage YouTube Player

Initsialiseerime YouTube Playeri, kutsudes alustamise () ja edastades varem loodud API võtme:

YouTubePlayerView youTubePlayerView = (YouTubePlayerView) findViewById (R.id.YouTubePlayer); youTubePlayerView.inialiseeri (YOUR_API_KEY, uus YouTubePlayer.OnInitializedListener () {

3. Rakendage onInitializationSuccess ja onInitializationFailure

Lõpuks peame täpsustama, kuidas meie rakendus peaks reageerima, sõltuvalt sellest, kas lähtestamine on õnnestunud või ebaõnnestunud. Kui YouTube'i pleieri vormindamine õnnestub, saame oma video laadida, edastades ainulaadse video ID:

avalik void onInitializationSuccess (YouTubePlayer.Programmi pakkuja, YouTubePlayer youTubePlayer, loogiline b) {// Täpsustage video ID // youTubePlayer.loadVideo ("hJLBcViaX8Q");

Järgmisena peame oma rakendusele rääkima, kuidas see peaks ebaõnnestunud lähtestamisega hakkama saama. Ma näitan röstsaiti:

avalik tühine onInitializationFailure (YouTubePlayer.Programmi pakkuja, YouTubeInitializationResult youTubeInitializationResult) {Toast.makeText (MainActivity.this, "Tekkis viga", Toast.LENGTH_SHORT) .show (); }

YouTube'i video esitamine: valmis kood

Lisage kõik ülaltoodud andmed oma põhitegevusele ja peaksite jõudma midagi sellist:

import android.os.Bundle; import android.widget.Toast; impordi com.google.android.youtube.player.YouTubeBaseActivity; impordi com.google.android.youtube.player.YouTubeInitializationResult; impordi com.google.android.youtube.player.YouTubePlayer; impordi com.google.android.youtube.player.YouTubePlayerView; // Laiendage YouTubeBaseActivity // avaliku klassi MainActivity laiendab YouTubeBaseActivity {// Ärge unustage seda asendada oma unikaalse API-võtmega // avalik staatiline lõplik string YOUR_API_KEY = "YOUR_API_KEY_HERE"; @Kuivata kaitstud tühine onCreate (Bundle savedInstanceState) {super.onCreate (savedInstanceState); setContentView (R.layout.activity_main); YouTubePlayerView youTubePlayerView = (YouTubePlayerView) findViewById (R.id.YouTubePlayer); // Initsialiseerige YouTube Player // youTubePlayerView.initialize (YOUR_API_KEY, uus YouTubePlayer.OnInitializedListener () {@Override // Kui YouTube Playeri initsialiseerimine õnnestub ... // avalik void onInitializationSuccess (YouTubePlayer.Proviisoriteenuse pakkuja, YouTubePlayer youTubePlayer b) {//.. siis alustage järgmise video esitamist // youTubePlayer.loadVideo ("hJLBcViaX8Q");} @Override // Kui initsialiseerimine ebaõnnestub ... // avalik void onInitializationFailure (YouTubePlayer.Proviisori pakkuja, YouTubeInitializationResult youTubeInitializationResult) {//...näita siis röstsaiti // Toast.makeText (MainActivity.this, "Ilmnes viga", Toast.LENGTH_SHORT) .show ();}}); }}

YouTube Android Playeri API testimine

Saate seda rakendust testida kas füüsilises Androidi nutitelefonis või tahvelarvutis või AVD-s. Kui kasutate AVD-d, veenduge, et kasutate süsteemipilti, mis sisaldab Google Play teenuseid. YouTube'i rakendus tuleb installida ka AVD-le või füüsilisse Androidi seadmesse, kuna YouTube'i API tugineb teenusele, mida levitatakse rakenduse YouTube Androidile jaoks.

Installige projekt oma seadmesse ja YouTube'i videot tuleks hakata automaatselt esitama, niipea kui rakendus laeb. Kui koputate videot, saate juurdepääsu kõigile tuttavatele YouTube'i juhtnuppudele, mida saate kasutada video peatamiseks, esitamiseks, edasikerimiseks ja tagasikerimiseks.

Dailymotioni sisu kuvamine WebView'is

Videote manustamisel oma Androidi rakendusse on palju video jagamise platvorme, mille hulgast saate valida, ja mõned platvormid on isegi loonud SDK-sid, mis on pühendatud nende sisuga suhtlemisele - sealhulgas Dailymotion.

Dailymotion Player SDK for Android pakub õhukese ümbrise Androidi WebView komponendi ümber, mis hõlbustab Dailymotioni videote manustamist oma rakendustesse.

Selles jaotises näitan teile, kuidas voogesitada mis tahes videoid Dailymotioni veebisaidilt, kasutades kolmanda osapoole Dailymotion Player SDK-d.

Hankige Dailymotioni video ID

Esiteks minge edasi Dailymotioni, leidke kuvatav video ja seejärel hankige selle video ID.

Kasutan seda aegunud uduvideot, millel on järgmine URL:

www.dailymotion.com/video/x71jlg3

Video ID on selle URL-i lõpus olev ainulaadne tähemärkide jada, seega on minu video ID: x71jlg3.

Dailymotion SDK lisamine

Kuna me kasutame Dailymotion SDK-d, peame selle kuulutama projekti sõltuvuseks. Avage projekti build.gradle fail ja lisage järgmine teave:

sõltuvused {rakendusfailTree (dir: libs, sisaldab:) // Lisage järgmine // juurutamine com.dailymotion.dailymotion-sdk-android: sdk: 0.1.29 teostus com.android.support:appcompat-v7:28.0.0 juurutamine com.android.support:design:28.0.0 teostus com.android.support.constraint: piirangute paigutus: 1.1.3 testRakenduse juhend: juuni: 4.12 androidTestImplementation com.android.support.test: jooksja: 1.0.2}

Kui küsitakse, valige „Sünkrooni projekt Gradle'i failidega”.

Pange tähele, et vaikimisi annab Dailymotion SDK teile juurdepääsu ainult Dailymotioni avalikele andmetele, näiteks video pealkirjale ja kirjeldusele.Saate täita mõned lisaülesanded, registreerides oma rakenduse Dailymotioni platvormil, kuid kuna me tahame lihtsalt videot manustada, ei pea me muretsema oma rakenduse registreerimise pärast.

Kui soovite oma rakendustele rohkem Dailymotioni funktsioone lisada, saate ametlike dokumentide kaudu lisateavet oma rakenduse registreerimise kohta Dailymotioni kaudu.

Interneti-ühenduse taotlemine

Jällegi voogesitame Internetist sisu, seega on meie projekti jaoks vaja Interneti luba:

Igal tegevusel, mis kuvab Dailymotioni sisu, peab olema atribuut android: configChanges, seega lisage oma põhitegevusele järgmine teave:

Dailymotioni PlayerWebView vidina lisamine

Dailymotion SDK peamine komponent on PlayerWebView kasutajaliidese element, mis pakub õhukese ümbrise Androidi WebView komponendi ümber.

Uurime WebView-e lähemalt järgmises jaotises, kuid WebViews annavad teile põhimõtteliselt võimaluse oma rakendusele veebilehti manustada. Kui me ei kasutaks SDK spetsiaalset PlayerWebView'i, siis võime kasutada rakenduses kogu Dailymotioni veebilehe kuvamiseks Androidi vanilje WebView komponenti.

Selle asemel lisame PlayerWebView meie paigutusele:

Dailymotion PlayerWebView seadistamine

Nüüd oleme installinud vidina PlayerWebView, peame mängija seadistama vastavasse tegevusklassi.

Avage oma MainActivity ja alustage viitega PlayerWebView'le:

dailyMotionPlayer = (PlayerWebView) findViewById (R.id.dailymotionPlayer);

Seejärel helistage “dailyMotionPlayer.load” ja edastage see meile varem hangitud video ID:

dailyMotionPlayer.load ("x71jlg3");

See annab meile järgmise:

impordi android.support.v7.app.AppCompatActivity; import android.os.Bundle; importige com.dailymotion.android.player.sdk.PlayerWebView; import java.util.HashMap; import java.util.Map; avalik klass MainActivity laiendab AppCompatActivity {privaatne PlayerWebView dailyMotionPlayer; @Kuivata kaitstud tühine onCreate (Bundle savedInstanceState) {super.onCreate (savedInstanceState); setContentView (R.layout.activity_main); // Tooge meie PlayerWebView alla // dailyMotionPlayer = (PlayerWebView) findViewById (R.id.dailymotionPlayer); Kaart playerParams = uus HashMap <> (); // Laadige video meie parameetritega // playerParams.put ("võti", "väärtus"); // edastage video ID // dailyMotionPlayer.load ("x71jlg3"); }}

Installige oma projekt füüsilisse Androidi seadmesse või emulaatorisse ning teie Dailymotioni video peaks automaatselt alustama.

Vimeo video manustamine

Video sisu manustamisel soovite tavaliselt võimaluse korral kasutada platvormipõhist API-d või platvormipõhist SDK-d. Mis saab siis, kui teie jaoks mõeldud videote jagamise platvormi jaoks pole SDK või API-d saadaval?

Nendes stsenaariumides saate Androidi WebView komponenti kasutada video kuvamiseks veebilehena, mis on manustatud teie tegevuse paigutusele. Selles viimases osas näitan teile, kuidas WebView abil manustada videot populaarselt Vimeo platvormilt.

Lisaks videosisu kuvamisele võivad veebivaated olla kasulikud ka paljudes teistes stsenaariumides. Kujutage näiteks ette, et teil on sisu, mida tuleb regulaarselt värskendada; selle sisu veebis hostimine ja seejärel rakenduses WebView kaudu kuvamine annab teile võimaluse seda sisu veebis igal ajal muuta, ilma et peaksite oma rakenduse uut versiooni avaldama. WebView-de kasutamisel olge siiski ettevaatlik, kuna need ei toeta paljusid funktsioone, mida tavaliselt eraldiseisvalt veebibrauserilt oodata võiksite. Eelkõige puudub WebViews aadressiribal või navigeerimiskontrollidel, mis võib muuta nende sisu kasutajatele keeruliseks.

Enne WebView kasutamist peaksite alati kaaluma, kas mõni alternatiivne lahendus võiks olla sobivam, näiteks võite sisu sisu seadme vaikimisi veebibrauserisse laadida või rakendada Chrome'i kohandatud vahekaarte.

Manifesti värskendamine

Kuna voogesitame videot Internetist, peame oma manifesti lisama Interneti-loa:

Samuti kavatsen MainActivity käivitada horisontaalrežiimis:

WebView lisamine meie kasutajaliidesele

Järgmisena lisame meie rakendusele veebivaate. Saame lisada WebView oma tegevuse paigutusele või muuta kogu tegevuse WebView-ks, rakendades seda meie rakenduse meetodil onCreate ().

Lisan meie rakenduse paigutusele WebView:

Valige oma video

Veelkord: vajame kuvamiseks videot, kuid seekord oleme mitte kasutades video ID:

  • Suunake Vimeo juurde ja valige video, mida soovite kasutada; Olen valinud selle talvise aja möödumise.
  • Klõpsake nuppu „Jaga“.
  • Valige ikoon „Manusta“; see annab teile manuskoodi, mis peaks välja nägema umbes selline:

See kood sisaldab järgmist teavet:

  • iframe. Määrab, et manustame praegusesse konteksti veel ühe HTML-i lehe.
  • src. Video tee, nii et teie rakendus teab, kust seda videot leida.
  • laius kõrgus. Video mõõtmed.
  • raamipiir. Kas kuvada videokaadri ümber ääris. Võimalikud väärtused on ääris (1) ja mitte ääris (0).
  • lubatav ekraan. See võimaldab videot kuvada täisekraanrežiimis.

Lisan selle manustatud koodi oma projektina stringina, nii et peate selle teabe kopeerima / kleepima järgmisesse malli:

String vimeoVideo = "TEIE LINK läheb SIIN';

Frustreerivalt peame tegema mõned muudatused enne, kui manustuskood ühildub meie Androidi rakendusega. Esiteks peame lisama paar märki “”, et Android Studio ei saaks nuriseda vale vormingu üle:

String vimeoVideo = "';

Lõpuks võivad vaikevideomõõtmed olla mõne Androidi nutitelefoni ekraanil liiga suured.
Tootmisel katsetate tavaliselt erinevate mõõtmetega, et näha, mis annab parimate tulemuste võimalikult erinevates ekraanikonfiguratsioonides. Selle artikli kontrolli alt väljumiseks kasutan siiski järgmist, mis peaks andma häid tulemusi teie “tüüpilisel” Androidi nutitelefoni ekraanil:

String vimeoVideo = "';

Veebilehe kuvamine oma Androidi rakenduses

Nüüd oleme loonud oma paigutuse ja meie HTML on kõik kasutamiseks valmis, avage MainActivity ja lubage meie WebView rakendada.

Alustage HTML-stringi lisamisega:

String vimeoVideo = "';

Järgmisena peame ülaltoodud veebilehe laadima oma WebView, kasutades meetodit loadUrl ():

webView.loadUrl (request.getUrl (). toString ());

JavaScript on vaikimisi keelatud, nii et peame selle oma WebView-s lubama.

Iga kord, kui loote WebView, omistatakse sellele automaatselt vaikeseadete veebikomplekt. Toimetame selle WebSettings-objekti, kasutades meetodit getSettings (), ja lubame JavaScripti, kasutades funktsiooni setJavaScriptEnabled ().

WebSettings webSettings = webView.getSettings (); webSettings.setJavaScriptEnabled (tõene);

Pärast kogu selle lisamist oma põhitegevusele peaks teie kood välja nägema umbes selline:

impordi android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.webkit.WebResourceRequest; import android.webkit.WebSettings; import android.webkit.WebView; import android.webkit.WebViewClient; avaliku klassi MainActivity laiendab AppCompatActivity {@Orreide kaitstud tühisust onCreate (Bundle savedInstanceState) {super.onCreate (savedInstanceState); setContentView (R.layout.activity_main); String vimeoVideo = ""; WebView webView = (WebView) findViewById (R.id.myWebView); webView.setWebViewClient (uus WebViewClient () {@Override public boolean shouldOverrideUrlLoading (WebView webView, WebResourceriew.UquestUquestUquest.com). ()); tagasta tõene;}}); WebSettings webSettings = webView.getSettings (); webSettings.setJavaScriptEnabled (true); webView.loadData (vimeoVideo, "text / html", "utf-8");}}

Vimeo rakenduse testimine

Nüüd teate juba harjutust: installige see projekt füüsilisse Android-seadmesse või AVD-sse. WebView ei ole seadistatud automaatseks esitamiseks, nii et peate Vimeo meediumikontrollide kuvamiseks video koputama. Seejärel saate videot korralikult mängida, seda peatada, tagasi kerida ja edasi kerida, et veenduda, et see töötab õigesti.

Pakkimine üles

Selles artiklis näitasin teile, kuidas oma rakendustele YouTube'i, Vimeo ja Dailymotioni videoid lisada, kasutades platvormipõhiseid API-sid ja SDK-sid ning Androidi enda WebView-komponenti. Näitasin teile, kuidas videofaili oma rakendusega komplekteerida, et seda saaks kohapeal säilitada ja mängida.

Mis on teie lemmikviis multimeediumisisu kuvamiseks oma kasutajatele? Andke meile allolevates kommentaarides teada!

Pole mõtet omada kiire Interneti-ühendu kui te ei aa eda oma kodu iga oa nautida. Wi-Fi vahemiku laiendaja on lihtaim lahendu. Kui teil on keldri, pööningul või muu ruumi WiFi...

Android Pie tõi palju uui täiendui, kuid ük polarieerivamaid otueid oli amm keelata WiFi-kannimie droelklapi kautamine.ee amm piirab eda, kui ageli aavad rakendued WiFi-d kannida, olgu ...

Meie Väljaanded