Kandungan

• Bagaimana untuk membenamkan video YouTube dalam apl Android anda
• Mendapatkan ID video YouTube
• Dapatkan cap jari SHA-1 projek anda
• Daftar dengan Google API Console
• Muat turun API YouTube Android Player
• Kemas kini Manifes anda
• Membina susun atur Pemain YouTube
• Melaksanakan Pemain YouTube
• 1. Lanjutan YouTubeBaseActivity
• 2. Mulakan Pemain YouTube
• 3. Melaksanakan onInitializationSuccess dan onInializationFailure
• Memainkan video YouTube: Kod siap
• Menguji API Android Android Player
• Paparkan kandungan Dailymotion dalam WebView
• Dapatkan ID video Dailymotion
• Menambah SDK Dailymotion
• Meminta akses internet
• Menambah widget PlayerWebView Dailymotion
• Mengkonfigurasi pemain DailymotionWebView kami
• Menyematkan video Vimeo
• Mengemas kini Manifest
• Menambah WebView ke UI kami
• Pilih video anda
• Memaparkan halaman web dalam apl Android anda
• Menguji aplikasi Vimeo anda
• Mengakhiri

Sebaik sahaja MediaController kelihatan di skrin, anda boleh main, jeda, gulung semula dan pasang maju video itu, dan lompat ke mana-mana titik dalam klip dengan menyeret bar kemajuan MediaController.

Bagaimana untuk membenamkan video YouTube dalam apl Android anda

Menyematkan fail video dalam aplikasi anda adalah cara yang baik untuk memastikan video sentiasa tersedia, tanpa mengira sambungan Internet peranti. Bagaimanapun, membenamkan beberapa video besar resolusi tinggi dalam aplikasi anda juga merupakan cara terbaik untuk meningkatkan saiz APK anda!

Sekiranya anda prihatin dengan saiz APK, atau aplikasi anda termasuk video yang mempunyai tambahan tambahan bagus, maka anda mungkin mahu menerbitkan video tersebut ke platform dalam talian dan kemudian menyiarkannya melalui aplikasi anda pada masa runtime.

Ketika datang untuk menerbitkan video dalam talian, ada satu laman web yang langsung muncul di pikiran, jadi dalam bagian ini saya akan menunjukkan kepada Anda cara untuk membenamkan mana-mana Video YouTube dalam apl anda, menggunakan pustaka klien API Pemain Android YouTube.

Mendapatkan ID video YouTube

Untuk memulakan, anda perlu membuat keputusan mengenai video YouTube yang anda mahu paparkan, dan kemudian dapatkan ID video yang unik.

Anda boleh menggunakan mana-mana video YouTube tetapi saya memilih untuk "Tech Favorite of 2018." Muatkan video pilihan anda dan lihat URLnya di bar alamat penyemak imbas anda, sebagai contoh URL untuk video itu ialah:

youtube.com/watch?v=hJLBcViaX8Q

ID adalah bahagian URL yang mengidentifikasi video ini secara unik, yang merupakan rentetan aksara di akhir URL (pada dasarnya, semuanya selepas simbol "="). ID video untuk video itu ialah:

hJLBcViaX8Q

Buat nota ID video anda, kerana kami akan menggunakannya nanti.

Dapatkan cap jari SHA-1 projek anda

Untuk mengakses API YouTube Android Player, anda perlu menjana kunci API dengan sekatan Android. Ini melibatkan menghubungkan kunci API ke nama pakej unik dan cap jari sijil projek anda (SHA-1).

Anda boleh mendapatkan cap jari SHA-1 projek anda, melalui Konsol Gradle:

• Pilih tab Gradle di sebelah kanan tingkap Android Studio.
• Pilih modul "apl", diikuti dengan "Tugas> Android> menandatanganiReport."

• Buka tab Konsol Gradle yang muncul ke kanan bawah skrin.
• Konsol Gradle akan dibuka secara automatik. Cari nilai SHA-1 dalam tetingkap ini, dan buat nota mengenainya.

Kami menggunakan cap jari sijil debug, yang hanya sesuai untuk menguji aplikasi. Sebelum menerbitkan aplikasi, anda harus sentiasa menghasilkan kunci API baharu berdasarkan sijil keluaran aplikasi itu.

Daftar dengan Google API Console

Sebelum anda boleh menggunakan API YouTube Android Player, anda perlu mendaftarkan aplikasi anda di Konsol API Google:

• Kepala ke Konsol API.
  Dalam tajuk, pilih nama projek semasa anda (di mana kursor diletakkan di tangkapan skrin berikut).

• Dalam tetingkap berikutnya, pilih "Projek baru."
• Berikan projek anda nama, dan kemudian klik "Buat."
• Di menu sebelah kiri, pilih "Bukti kelayakan."
• Berikan butang "Buat mandat" biru satu klik, dan kemudian pilih "Kunci API."
• Kunci API anda sekarang akan muncul dalam pop timbul, yang merangkumi sandaran untuk menyekat kunci API ini. Kekunci terhad adalah lebih selamat, jadi melainkan jika anda secara khusus memerlukan kunci API yang tidak terhad, memilih untuk "Hadkan kekunci."
• Pada skrin seterusnya, berikan kunci API anda nama tersendiri.
• Pilih butang radio "Apl Android".
• Klik "Tambahkan nama pakej dan cap jari."
• Salin / tampal cap jari SHA-1 projek anda ke bahagian berikutnya, dan kemudian masukkan nama pakej projek anda (yang muncul di bahagian atas setiap fail kelas Java dan dalam Projek anda).
• Apabila anda berpuas hati dengan maklumat yang anda masukkan, klik "Simpan."

Muat turun API YouTube Android Player

Seterusnya, anda perlu memuat turun perpustakaan pelanggan Android Player API YouTube. Apabila menggunakan pustaka ini, disyorkan supaya anda mendayakan ProGuard, untuk membantu memastikan APK anda ringan sekiranya mungkin.

Untuk menambah pustaka YouTube untuk projek anda:

• Teruskan ke laman web YouTube Android Player, dan muat turun versi terkini.
• Unzip fail zip berikutnya.
• Buka folder baru yang tidak dikemas kini dan navigasi ke subfolder "libs" - ia mesti mengandungi fail "YouTubeAndroidPlayerApi.jar".
• Di Android Studio, tukar ke paparan "Projek".
• Untuk memastikan pustaka YouTube disertakan dalam laluan membina anda, anda perlu mengimport .jar ke dalam projek "/ libs ". Buka folder "app / libs" projek anda, dan kemudian seret dan lepaskan .jar ke kedudukan.

• Buka fail build.gradle anda dan tambahkan pustaka YouTube sebagai kebergantungan projek:

dependencies {implementation fileTree (dir: libs, include:) implementation com.android.support:appcompat-v7:28.0.0 implementation com.android.support:design 28.0.0 implementation com.android.support.constraint: layout-constraint : 1.1.3 testImplementation junit: junit: 4.12 androidTestImplementation com.android.support.test: runner: 1.0.2 // Tambah fail // pelaksanaan berikut (libs / YouTubeAndroidPlayerApi.jar)}

• Apabila digesa, segerakkan fail Gradle anda.

Kemas kini Manifes anda

Jika permohonan anda akan dipaparkan mana-mana Kandungan video dalam talian, maka ia memerlukan akses kepada Internet.

Buka Manifes projek anda dan tambah kebenaran Internet:

Untuk memberi pengguna rasa pengalaman sinematik, skrin lebar, saya juga menetapkan MainActivity untuk melancarkan dalam mod landskap:

Membina susun atur Pemain YouTube

Anda boleh memaparkan video YouTube, menggunakan sama ada:

• YouTubePlayerView. Jika anda mahu menggunakan YouTubePlayerView dalam susun atur anda, maka anda perlu memanjangkan YouTubeBaseActivity dalam kelas Aktiviti susun atur yang sama.
• YouTubePlayerFragment. Ini adalah serpihan yang mengandungi YouTubePlayerView. Jika anda memilih untuk melaksanakan YouTubePlayerFragment, maka anda tidak akan perlu melanjutkan dari YouTubeBaseActivity.

Saya akan menggunakan YouTubePlayerView, jadi buka fail "activity_main.xml" projek anda, dan tambahkan widget YouTubePlayerView:

Melaksanakan Pemain YouTube

Seterusnya, buka MainActivity anda dan selesaikan tugas-tugas berikut:

1. Lanjutan YouTubeBaseActivity

Oleh kerana kami menggunakan YouTubePlayerView dalam susun atur kami, kami perlu memanjangkan YouTubeBaseActivity:

MainActivity kelas awam memanjangkan YouTubeBaseActivity {

2. Mulakan Pemain YouTube

Kami memulakan Pemain YouTube dengan memanggil menginisialisasi () dan lulus kunci API yang kami buat lebih awal:

YouTubePlayerView youTubePlayerView = (YouTubePlayerView) findViewById (R.id.YouTubePlayer); youTubePlayerView.initialize (YOUR_API_KEY, YouTubePlayer.OnInitializedListener baru) () {

3. Melaksanakan onInitializationSuccess dan onInializationFailure

Akhirnya, kita perlu menentukan bagaimana aplikasi kita harus bertindak balas, bergantung pada apakah permulaan adalah kejayaan, atau kegagalan. Jika Pemain YouTube berjaya dimulakan, maka kami boleh memuatkan video kami, dengan meluluskan ID video unik:

void public onInitializationSuccess (Pembekal YouTubePlayer.Provider, YouTubePlayer youTubePlayer, boolean b) {// Tentukan ID video // youTubePlayer.loadVideo ("hJLBcViaX8Q");

Seterusnya, kami perlu memberitahu permohonan kami bagaimana ia perlu mengatasi inisiasi gagal. Saya akan memaparkan Toast:

void public onInitializationFailure (YouTubePlayer.Provider provider, YouTubeInitializationResult youTubeInitializationResult) {Toast.makeText (MainActivity.this, "Ralat terjadi", Toast.LENGTH_SHORT) .show (); }

Memainkan video YouTube: Kod siap

Tambahkan semua perkara di atas untuk MainActivity anda, dan anda harus berakhir dengan sesuatu seperti ini:

import android.os.Bundle; import android.widget.Toast; import com.google.android.youtube.player.YouTubeBaseActivity; import com.google.android.youtube.player.YouTubeInitializationResult; import com.google.android.youtube.player.YouTubePlayer; import com.google.android.youtube.player.YouTubePlayerView; / / Extend YouTubeBaseActivity // publicActivity MainActivity extends YouTubeBaseActivity {// Jangan lupa untuk menggantikan ini dengan kunci API unik anda sendiri // String akhir statik awam YOUR_API_KEY = "YOUR_API_KEY_HERE"; @Override dilindungi tidak sah onCreate (Bundle savedInstanceState) {super.onCreate (savedInstanceState); setContentView (R.layout.activity_main); YouTubePlayerView youTubePlayerView = (YouTubePlayerView) findViewById (R.id.YouTubePlayer); // Inisialkan Pemain YouTube // youTubePlayerView.initialize (YOUR_API_KEY, YouTubePlayer.OnInitializedListener baru () {@Override // Jika Pemain YouTube dimulakan dengan jayanya ... // pembaziran awam onInitializationSuccess (pembekal YouTubePlayer.Provider, YouTubePlayer youTubePlayer, boolean b) {//..then mula memainkan video berikut // youTubePlayer.loadVideo ("hJLBcViaX8Q");} @Override // Jika permulaan gagal ... // awam tidak sah onInitializationFailure (Pembekal YouTubePlayer.Provider, YouTubeInitializationResult youTubeInitializationResult) {//..then memaparkan toast // Toast.makeText (MainActivity.this, "Ralat berlaku", Toast.LENGTH_SHORT) .show ();}}); }}

Menguji API Android Android Player

Anda boleh menguji aplikasi ini sama ada pada telefon pintar atau tablet Android fizikal, atau AVD. Sekiranya anda menggunakan AVD, pastikan anda menggunakan imej sistem yang termasuk perkhidmatan Google Play. Aplikasi YouTube juga mesti dipasang pada AVD atau peranti Android fizikal, kerana API YouTube bergantung kepada perkhidmatan yang diedarkan sebagai sebahagian daripada aplikasi YouTube untuk Android.

Pasang projek pada peranti anda, dan video YouTube harus mula dimainkan secara automatik, sebaik sahaja aplikasi dimuatkan. Jika anda mengetuk video, maka anda akan mempunyai akses kepada semua kawalan YouTube biasa yang boleh anda gunakan untuk menjeda, main, memajukan pantas dan memutar balik video.

Paparkan kandungan Dailymotion dalam WebView

Apabila membentangkan video dalam apl Android anda, terdapat pelbagai platform perkongsian video yang boleh anda pilih, dan beberapa platform telah menghasilkan SDK khusus untuk membantu anda berinteraksi dengan kandungannya - termasuk Dailymotion.

The Dailymotion Player SDK untuk Android menyediakan pembalut nipis di sekitar komponen WebView Android, yang menjadikannya lebih mudah untuk membenamkan video Dailymotion dalam aplikasi anda.

Dalam bahagian ini, saya akan menunjukkan kepada anda bagaimana untuk menyalurkan sebarang video dari laman web Dailymotion, menggunakan SDK Player Dailymotion pihak ketiga.

Dapatkan ID video Dailymotion

Pertama, pergi ke Dailymotion, cari video yang ingin anda paparkan, kemudian dapatkan ID video.

Saya akan menggunakan video kabut waktu ini, yang mempunyai URL berikut:

www.dailymotion.com/video/x71jlg3

ID video adalah rentetan aksara unik di akhir URLnya, jadi ID video saya adalah: x71jlg3.

Menambah SDK Dailymotion

Oleh kerana kami menggunakan SDK Dailymotion, kami perlu mengisytiharkannya sebagai kebergantungan projek. Buka fail build.gradle projek anda, dan tambahkan yang berikut:

dependencies {implementation fileTree (dir: libs, include: // // add // implementation implementation com.dailymotion.dailymotion-sdk-android: sdk: 0.1.29 implementation com.android.support:appcompat-v7:28.0.0 implementation com.android.support:design 28.0.0 implementasi com.android.support.constraint: susunan kekangan: 1.1.3 testImplementation junit: junit: 4.12 androidTestImplementation com.android.support.test: runner: 1.0.2}

Apabila digesa, pilih "Projek Penyegerakan dengan Fail Gradle."

Perhatikan bahawa secara lalai SDK Dailymotion hanya memberi anda akses kepada data awam Dailymotion, seperti tajuk dan perihalan video.Anda boleh melakukan beberapa tugas tambahan dengan mendaftarkan aplikasi anda dengan platform Dailymotion, tetapi kerana kami hanya mahu membenamkan video, kami tidak perlu risau tentang mendaftar aplikasi kami.

Sekiranya anda menarik untuk menambahkan lebih banyak fungsi Dailymotion ke aplikasi anda, maka anda boleh mengetahui lebih lanjut mengenai mendaftar aplikasi anda dengan Dailymotion, di dokumen rasmi.

Meminta akses internet

Sekali lagi, kami menyiarkan kandungan dari World Wide Web, jadi projek kami memerlukan kebenaran Internet:

Setiap Aktiviti yang memaparkan kandungan Dailymotion mesti mempunyai atribut "android: configChanges", jadi tambahkan yang berikut ke MainActivity anda:

Menambah widget PlayerWebView Dailymotion

Komponen utama Dailymotion SDK adalah elemen UI PlayerWebView, yang menyediakan pembungkus nipis di sekitar komponen WebView Android.

Kami akan meneroka WebView dengan lebih terperinci dalam bahagian yang berikut, tetapi WebView pada dasarnya memberikan anda cara untuk membenamkan halaman web dalam aplikasi anda. Jika kami tidak menggunakan PlayerWebView khusus SDK, maka kami mungkin menggunakan komponen WebView vanila Android untuk memaparkan halaman web Dailymotion seluruh dalam aplikasi kami.

Sebaliknya, mari tambahkan PlayerWebView ke susun atur kami:

Mengkonfigurasi pemain DailymotionWebView kami

Kini kami telah melaksanakan widget PlayerWebView, kami perlu mengkonfigurasi pemain dalam kelas Aktiviti kami yang sepadan.

Buka MainActivity anda, dan mulakan dengan mendapatkan rujukan kepada PlayerWebView:

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

Kemudian, hubungi "dailyMotionPlayer.load" dan lulus ID video yang kami dapati sebelum ini:

dailyMotionPlayer.load ("x71jlg3");

Ini memberi kami perkara berikut:

import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import com.dailymotion.android.player.sdk.PlayerWebView; import java.util.HashMap; import java.util.Map; MainActivity kelas awam meluaskan AppCompatActivity {private PlayerWebView harianMotionPlayer; @Override dilindungi tidak sah onCreate (Bundle savedInstanceState) {super.onCreate (savedInstanceState); setContentView (R.layout.activity_main); // Dapatkan PlayerWebView // dailyMotionPlayer = (PlayerWebView) findViewById (R.id.dailymotionPlayer); Peta playerParams = new HashMap <> (); // Muatkan video dengan parameter // // playerParams.put ("kunci", "nilai"); // Lulus ID video // dailyMotionPlayer.load ("x71jlg3"); }}

Pasang projek anda pada peranti Android atau emulator fizikal, dan video Dailymotion anda akan mula dimainkan secara automatik.

Menyematkan video Vimeo

Ketika membasuh kandungan video, biasanya anda ingin menggunakan API spesifik platform atau SDK spesifik platform di mana mungkin. Tetapi, bagaimana jika tidak ada SDK atau API yang tersedia, untuk platform berkongsi video yang anda fikirkan?

Dalam senario ini, anda boleh menggunakan komponen WebView Android untuk memaparkan video sebagai halaman web yang tertanam dalam susunatur Aktiviti anda. Dalam bahagian akhir ini, saya akan menunjukkan kepada anda bagaimana untuk membenamkan video dari platform Vimeo yang popular, menggunakan WebView.

Di samping memaparkan kandungan video, WebViews boleh berguna dalam beberapa senario lain. Sebagai contoh, bayangkan anda mempunyai beberapa kandungan yang perlu dikemas kini dengan kerap; hosting yang kandungan dalam talian dan kemudian memaparkannya dalam aplikasi anda melalui WebView memberikan anda fleksibiliti untuk menukar kandungan itu dalam talian pada bila-bila masa, tanpa perlu menerbitkan versi baru apl anda. Bagaimanapun, berhati-hati apabila menggunakan WebView kerana mereka tidak menyokong banyak ciri yang biasanya anda harapkan daripada pelayar web yang berdiri sendiri. Khususnya, WebViews tidak mempunyai bar alamat atau kawalan navigasi, yang boleh menjadikan kandungannya sukar bagi pengguna untuk berinteraksi.

Sebelum menggunakan WebView, anda harus mempertimbangkan sama ada penyelesaian alternatif mungkin lebih sesuai, contohnya anda boleh memunggah kandungan ke penyemak imbas web lalai peranti atau melaksanakan Tab Custom Chrome.

Mengemas kini Manifest

Oleh kerana kami menyiarkan video dari Internet, kami perlu menambah kebenaran Internet untuk Manifes kami:

Saya juga akan melancarkan MainActivity dalam mod landskap:

Menambah WebView ke UI kami

Seterusnya, mari tambahkan WebView ke aplikasi kami. Kami boleh menambahkan WebView ke susunatur Aktiviti kami, atau mengubah keseluruhan Aktiviti ke dalam WebView, dengan melaksanakannya dalam kaedah onCreate () aplikasi kami.

Saya akan menambah WebView ke susun atur aplikasi kami:

Pilih video anda

Sekali lagi, kami memerlukan video untuk dipaparkan, tetapi kali ini kami tidak menggunakan ID video:

• Kepala ke Vimeo dan pilih video yang ingin anda gunakan; Saya telah memilih masa lapang musim sejuk ini.
• Berikan butang "Kongsi" satu klik.
• Pilih ikon "Benamkan"; ini akan memberi anda kod semulajadi yang sepatutnya kelihatan seperti ini:

Kod ini menyediakan maklumat berikut:

• iframe. Menentukan bahawa kami memasukkan halaman HTML lain dalam konteks semasa.
• src. Laluan video, jadi aplikasi anda tahu di mana untuk mencari video ini.
• Lebar tinggi. Dimensi video.
• frameborder. Sama ada untuk memaparkan sempadan di sekeliling bingkai video. Nilai mungkin adalah sempadan (1) dan tiada sempadan (0).
• membenarkan skrin. Ini membolehkan video dipaparkan dalam mod skrin penuh.

Saya akan menambah kod embed ini kepada projek saya sebagai rentetan, jadi anda perlu menyalin / paste maklumat ini ke dalam template berikut:

String vimeoVideo = "LINK ANDA TERSEBUT DI SINI';

Dengan frustrasi, kita perlu membuat beberapa perubahan sebelum kod embed itu serasi dengan apl Android kami. Pertama, kita perlu menambah beberapa aksara "", supaya Android Studio tidak mengadu tentang pemformatan yang salah:

String vimeoVideo = "';

Akhirnya, dimensi video lalai mungkin terlalu besar untuk beberapa skrin telefon pintar Android.
Dalam pengeluaran, anda biasanya akan bereksperimen dengan pelbagai dimensi untuk melihat apa yang menyampaikan hasil yang terbaik, di mana banyak konfigurasi skrin yang berbeza mungkin. Bagaimanapun, untuk membantu mengekalkan artikel ini daripada mengawalnya, saya hanya akan menggunakan perkara berikut, yang sepatutnya memberikan hasil yang baik pada skrin telefon pintar Android "tipikal" anda:

String vimeoVideo = "';

Memaparkan halaman web dalam apl Android anda

Kini kami telah mencipta susun atur kami dan mempunyai HTML kami semua bersedia untuk pergi, buka MainActivity anda dan membolehkan melaksanakan WebView kami.

Mulakan dengan menambah rentetan HTML:

String vimeoVideo = "';

Seterusnya, kita perlu memuatkan halaman web di atas dalam WebView kami, menggunakan kaedah loadUrl ():

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

JavaScript dilumpuhkan secara lalai, jadi kami perlu mendayakannya dalam WebView kami.

Setiap kali anda membuat WebView, ia secara automatik menetapkan satu set WebSettings lalai. Kami akan mengambil objek WebSettings ini, menggunakan kaedah getSettings (), dan kemudian aktifkan JavaScript, menggunakan setJavaScriptEnabled ().

WebSettings webSettings = webView.getSettings (); webSettings.setJavaScriptEnabled (benar);

Selepas menambah semua ini ke MainActivity anda, kod anda harus kelihatan seperti ini:

import 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; MainActivity kelas awam meluaskan AppCompatActivity {@Override dilindungi tidak sah onCreate (Bundle savedInstanceState) {super.onCreate (savedInstanceState); setContentView (R.layout.activity_main); String vimeoVideo = ""WebView webView = (WebView) findViewById (R.id.myWebView); webView.setWebViewClient (baru WebViewClient () {@Override public boolean shouldOverrideUrlLoading (webView webView, WebResourceRequest request) {webView.loadUrl (request.getUrl () ()); kembali benar;}}); WebSettings webSettings = webView.getSettings (); webSettings.setJavaScriptEnabled (true); webView.loadData (vimeoVideo, "text / html", "utf-8");}}

Menguji aplikasi Vimeo anda

Anda tahu gerudi sekarang: memasang projek ini pada peranti Android fizikal atau AVD. WebView tidak ditetapkan untuk dimainkan secara automatik, jadi anda perlu memberi video satu paip, untuk mendedahkan kawalan media Vimeo. Anda kemudian boleh bermain, jeda, gulung semula dan pasang video pantas, untuk memastikan ia berfungsi dengan betul.

Mengakhiri

Dalam artikel ini, saya menunjukkan kepada anda cara menambah video YouTube, Vimeo dan Dailymotion ke aplikasi anda, menggunakan API dan SDK khusus platform, dan komponen WebView sendiri Android. Saya juga menunjukkan kepada anda bagaimana untuk membungkus fail video dengan aplikasi anda, supaya ia boleh disimpan dan dimainkan secara tempatan.

Apakah cara kegemaran anda untuk memaparkan kandungan multimedia kepada pengguna anda? Beritahu kami dalam komen di bawah!