Съдържание

• Как да вградите видеоклипове в YouTube във вашето приложение за Android
• Извличане на идентификационния номер на видеоклипа в YouTube
• Вземете отпечатъка на SHA-1 на вашия проект
• Регистрирайте се в конзолата на Google API
• Изтеглете API за YouTube Player на YouTube
• Актуализирайте своя Манифест
• Изграждане на оформлението на YouTube Player
• Внедряване на YouTube Player
• 1. Разширете YouTubeBaseActivity
• 2. Инициализирайте YouTube Player
• 3. Внедрете onInitializationSucess и onInitializationFailure
• Възпроизвеждане на видеоклип в YouTube: Завършен код
• Тестване на приложния API на YouTube за Android
• Показване на съдържанието Dailymotion в WebView
• Вземете идентификатора на видеоклипа Dailymotion
• Добавяне на SDK Dailymotion
• Искане на интернет достъп
• Добавяне на джаджа на PlayerWebView на Dailymotion
• Конфигуриране на нашия Dailymotion PlayerWebView
• Вграждане на видео на Vimeo
• Актуализиране на манифеста
• Добавяне на WebView към нашия потребителски интерфейс
• Изберете вашето видео
• Показване на уеб страница в приложението ви за Android
• Тестване на приложението ви Vimeo
• Обобщавайки

След като MediaController е видим на екрана, можете да възпроизвеждате, поставяте на пауза, пренавивате и премествате напред напред видеоклипа и прескачате до всяка точка в клипа, като плъзнете лентата за напредък на MediaController.

Как да вградите видеоклипове в YouTube във вашето приложение за Android

Вграждането на видео файл в приложението ви е чудесен начин да гарантирате, че видеото е винаги достъпно, независимо от интернет връзката на устройството. Вграждането на множество големи видеоклипове с висока разделителна способност в приложението ви обаче също е чудесен начин да увеличите размера на APK!

Ако се притеснявате за размера на APK или приложението ви включва видеоклипове, които са приятно добавени екстри, тогава може да искате да публикувате тези видеоклипове в онлайн платформа и след това да ги предавате през приложението си по време на изпълнение.

Що се отнася до публикуването на видеоклипове онлайн, има един уебсайт, който мигновено ви идва на ум, така че в този раздел ще ви покажа как да вграждате който и да е YouTube видео в приложението ви, използвайки клиентската библиотека API на Android Player.

Извличане на идентификационния номер на видеоклипа в YouTube

За да започнете, трябва да решите кой видеоклип в YouTube искате да покажете и след това да извлечете неговия уникален идентификационен номер на видео.

Можете да използвате всеки видеоклип в YouTube, но аз избирам „Любимата техника на 2018 г.“ Заредете избрания си видеоклип и разгледайте неговия URL адрес в адресната лента на браузъра ви, например URL адресът за видеото е:

youtube.com/watch?v=hJLBcViaX8Q

Идентификационният номер е частта от URL адреса, която еднозначно идентифицира това видео, което е низ от знаци в края на URL адреса (по принцип всичко след символа „=“). Идентификационният номер на видеоклипа е:

hJLBcViaX8Q

Забележете идентификационния номер на видеоклипа си, тъй като ще го използваме по-късно.

Вземете отпечатъка на SHA-1 на вашия проект

За да получите достъп до приложния програмен интерфейс на YouTube за Android Player, ще трябва да генерирате ключ за API с ограничения за Android. Това включва свързване на ключа на API с уникалното име на пакета и отпечатъка на сертификата (SHA-1).

Можете да извлечете отпечатъка на SHA-1 на вашия проект чрез конзолата Gradle:

• Изберете раздела Gradle вдясно на прозореца на Android Studio.
• Изберете модула "app", последван от "Задачи> Android> подписване на отчет".

• Отворете раздела Конзола на Gradle, който се показва в долната дясна част на екрана.
• Конзолата Gradle ще се отвори автоматично. Намерете стойността SHA-1 в този прозорец и я отбележете.

Използваме отпечатък на сертификата за отстраняване на грешки, който е подходящ само за тестване на приложение. Преди да публикувате приложение, винаги трябва да генерирате нов ключ на API въз основа на сертификата за освобождаване на това приложение.

Регистрирайте се в конзолата на Google API

Преди да можете да използвате API на YouTube Android Player, трябва да регистрирате приложението си в конзолата за API на Google:

• Преминете към конзолата на API.
  В заглавката изберете името на текущия си проект (където курсорът е разположен на следната екранна снимка).

• В следващия прозорец изберете „Нов проект“.
• Дайте име на проекта си и щракнете върху „Създаване“.
• В менюто отляво изберете „Удостоверения“.
• Кликнете върху синия бутон „Създаване на идентификационни данни“ и след това изберете „API ключ“.
• Вашият API ключ сега ще се появи в изскачащо меню, което включва подкана за ограничаване на този ключ на API. Ограничените ключове са по-сигурни, така че освен ако не изрично изисквате неограничен ключ за API, изберете „Ограничи ключ“.
• На следващия екран дайте на вашия ключ API отличително име.
• Изберете радио бутона „Приложения за Android“.
• Щракнете върху „Добавяне на име на пакета и пръстов отпечатък.“
• Копирайте / поставете пръстовия отпечатък на вашия проект на SHA-1 в следващия раздел и след това въведете името на пакета на вашия проект (което се показва в горната част на всеки файл от клас Java и в Manifest на вашия проект).
• Когато сте доволни от въведената информация, кликнете върху „Запазване“.

Изтеглете API за YouTube Player на YouTube

След това ще трябва да изтеглите клиентската библиотека на API на Android Player. Когато използвате тази библиотека, се препоръчва да активирате ProGuard, за да поддържате APK възможно най-лек.

За да добавите библиотеката на YouTube към вашия проект:

• Преминете към уебсайта на Android Player на YouTube и изтеглете най-новата версия.
• Разархивирайте следващия zip файл.
• Отворете новоразпазаната папка и отидете до нейната папка „libs“ - тя трябва да съдържа файл „YouTubeAndroidPlayerApi.jar“.
• В Android Studio преминете към изгледа „Проект“.
• За да сте сигурни, че библиотеката на YouTube е включена в пътя ви за изграждане, ще трябва да импортирате .jar в „/ libs ”. Отворете папката „app / libs“ на вашия проект, след което плъзнете и пуснете .jar на място.

• Отворете своя файл build.gradle и добавете библиотеката на YouTube като зависимост на проекта:

зависимости {изпълнение fileTree (реж .: libs, включва:) изпълнение com.android.support:appcompat-v7:28.0.0 изпълнение com.android.support:design:28.0.0 изпълнение com.android.support.constraint: ограничение-оформление : 1.1.3 testImplementation junit: junit: 4.12 androidTestImplementation com.android.support.test: runner: 1.0.2 // Добавете следните // файлове за изпълнение (libs / YouTubeAndroidPlayerApi.jar)}

• Когато бъдете подканени, синхронизирайте файловете си Gradle.

Актуализирайте своя Манифест

Ако приложението ви ще се покаже който и да е онлайн видео съдържание, тогава ще се нуждае от достъп до Интернет.

Отворете Manifest на вашия проект и добавете разрешение за интернет:

За да дам на потребителя вкус на това кино, широкоекранно изживяване, аз също настройвам MainActivity да стартира в пейзажен режим:

Изграждане на оформлението на YouTube Player

Можете да покажете видеоклип в YouTube, като използвате едно от следните:

• YouTubePlayerView. Ако искате да използвате YouTubePlayerView в оформлението си, тогава ще трябва да разширите YouTubeBaseActivity в съответния клас активност на това оформление.
• YouTubePlayerFragment. Това е фрагмент, който съдържа YouTubePlayerView. Ако решите да внедрите YouTubePlayerFragment, тогава вие няма да трябва да се разшири от YouTubeBaseActivity.

Ще използвам YouTubePlayerView, така че отворете файла „activity_main.xml“ на вашия проект и добавете приспособление за YouTubePlayerView:

Внедряване на YouTube Player

След това отворете вашата MainActivity и изпълнете следните задачи:

1. Разширете YouTubeBaseActivity

Тъй като използваме YouTubePlayerView в нашето оформление, трябва да разширим YouTubeBaseActivity:

MainActivity в обществен клас разширява YouTubeBaseActivity {

2. Инициализирайте YouTube Player

Ние инициализираме YouTube Player, като се обаждаме Initialize () и предаваме ключа, създаден от нас по-рано:

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

3. Внедрете onInitializationSucess и onInitializationFailure

И накрая, трябва да уточним как трябва да реагира нашето приложение в зависимост от това дали инициализацията е успешна или неуспешна. Ако YouTube Player е инициализиран успешно, тогава можем да заредим нашето видео, като предадем уникалния идентификатор на видеоклипа:

обществено невалидно onInitializationSuccess (доставчик на YouTubePlayer.Provider, YouTubePlayer youTubePlayer, boolean b) {// Посочете идентификатора на видео // youTubePlayer.loadVideo („hJLBcViaX8Q“);

След това трябва да кажем на нашето приложение как трябва да се справи с неуспешни инициализации. Ще покажа тост:

обществена невалидност onInitializationFailure (YouTubePlayer.Provider доставчик, YouTubeInitializationResult youTubeInitializationResult) {Toast.makeText (MainActivity.this, "Възникна грешка", Toast.LENGTH_SHORT) .show (); }

Възпроизвеждане на видеоклип в YouTube: Завършен код

Добавете всичко по-горе към вашата MainActivity и трябва да завършите с нещо подобно:

импортиране на android.os.Bundle; импортиране на android.widget.Toast; импортиране на com.google.android.youtube.player.YouTubeBaseActivity; импортиране на com.google.android.youtube.player.YouTubeInitializationResult; импортиране на com.google.android.youtube.player.YouTubePlayer; импортиране на com.google.android.youtube.player.YouTubePlayerView; // Разширяване на YouTubeBaseActivity // Public class MainActivity разширява YouTubeBaseActivity {// Не забравяйте да замените това със свой собствен уникален API ключ // public static final String YOUR_API_KEY = "YOUR_API_KEY_HERE"; @Override защитена празнота onCreate (Bundle saveInstanceState) {super.onCreate (saveInstanceState); setContentView (R.layout.activity_main); YouTubePlayerView youTubePlayerView = (YouTubePlayerView) findViewById (R.id.YouTubePlayer); // Инициализирайте YouTube Player // youTubePlayerView.initialize (YOUR_API_KEY, нов YouTubePlayer.OnInitializedListener () {@Override // Ако YouTube Player е инициализиран успешно ... // публично void onInitializationSuccess (доставчик на YouTubePlayer.Provider, YouTubePlayer youTubePlayer, b) {//.. тогава започнете да възпроизвеждате следния видеоклип // youTubePlayer.loadVideo ("hJLBcViaX8Q");} @Override // Ако инициализацията не успее ... // public void onInitializationFailure (YouTubePlayer.Provider Provider, YouTubeInitializationResult youTubeInitializationResult) {//...показвам тост // Toast.makeText (MainActivity.this, "Възникна грешка", Toast.LENGTH_SHORT) .show ();}}); }}

Тестване на приложния API на YouTube за Android

Можете да тествате това приложение или на физически Android смартфон или таблет, или на AVD. Ако използвате AVD, уверете се, че използвате системно изображение, което включва услугите на Google Play. Приложението YouTube също трябва да бъде инсталирано на AVD или физическо устройство с Android, тъй като API на YouTube разчита на услуга, която се разпространява като част от приложението YouTube за Android.

Инсталирайте проекта на вашето устройство и видеоклипът в YouTube трябва да започне да се възпроизвежда автоматично, веднага щом приложението се зареди. Ако докоснете видеоклипа, ще имате достъп до всички познати контроли на YouTube, които можете да използвате за пауза, възпроизвеждане, пренавиване напред и назад на видеоклипа.

Показване на съдържанието Dailymotion в WebView

Що се отнася до вграждането на видеоклипове в приложението ви за Android, има голям набор от платформи за споделяне на видео, които можете да избирате, а някои платформи дори са създали SDK, посветени да ви помагат да взаимодействате със съдържанието им - включително Dailymotion.

SDK Dailymotion Player SDK за Android осигурява тънка обвивка около компонента на WebView на Android, което улеснява вграждането на Dailymotion видеоклипове във вашите приложения.

В този раздел ще ви покажа как да предавате поточно всяко видео от уебсайта на Dailymotion, като използвате SDK на третата страна на Dailymotion Player.

Вземете идентификатора на видеоклипа Dailymotion

Първо, преминете към Dailymotion, намерете видеоклип, който искате да покажете, и след това извлечете видео идентификационния му номер.

Ще използвам този видеоклип на мъгла, който има следния URL адрес:

www.dailymotion.com/video/x71jlg3

Идентификационният номер на видеоклипа е уникалният низ от символи в края на URL адреса му, така че моят идентификационен номер на видеото е: x71jlg3.

Добавяне на SDK Dailymotion

Тъй като използваме SDK Dailymotion, трябва да го обявим за зависимост на проекта. Отворете файла build.gradle на вашия проект и добавете следното:

зависимости {изпълнение fileTree (dir: libs, include:) // Добавете следното // изпълнение com.dailymotion.dailymotion-sdk-android: sdk: 0.1.29 изпълнение com.android.support:appcompat-v7:28.0.0 изпълнение com.android.support:design:28.0.0 внедряване com.android.support.constraint: ограничение-оформление: 1.1.3 testImplementation junit: junit: 4.12 androidTestImplementation com.android.support.test: runner: 1.0.2}

Когато бъдете подканени, изберете „Синхронизиране на проект с файлове Gradle“.

Обърнете внимание, че SDK Dailymotion по подразбиране ви дава достъп само до публичните данни на Dailymotion, като заглавие и описание на видеоклипа.Можете да изпълнявате някои допълнителни задачи, като регистрирате приложението си с платформата Dailymotion, но тъй като ние просто искаме да вградим видеоклип, няма нужда да се притесняваме от регистрацията на нашето приложение.

Ако ви е интересно да добавяте повече Dailymotion функционалност към приложенията си, тогава можете да научите повече за регистрацията на приложението си с Dailymotion, в официалните документи.

Искане на интернет достъп

За пореден път ние предаваме съдържание от световната мрежа, така че проектът ни изисква разрешение за интернет:

Всяка дейност, която показва съдържанието на Dailymotion, трябва да има атрибут „android: configChanges“, така че добавете следното към вашата MainActivity:

Добавяне на джаджа на PlayerWebView на Dailymotion

Основният компонент на Dailymotion SDK е PlayerWebView UI елемент, който осигурява тънка обвивка около компонента на WebView на Android.

В следващия раздел ще проучим по-подробно WebView, но по същество WebView ви дава начин да вградите уеб страници в приложението си. Ако не използвахме специализирания PlayerWebView на SDK, може да използваме Android ванилния компонент WebView на Android, за да покажем цяла уеб страница Dailymotion в нашето приложение.

Вместо това нека добавим PlayerWebView към нашето оформление:

Конфигуриране на нашия Dailymotion PlayerWebView

Сега сме внедрили джаджа PlayerWebView, трябва да конфигурираме плейъра в съответния ни клас на активност.

Отворете вашата MainActivity и започнете с препратка към PlayerWebView:

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

След това се обадете на "dailyMotionPlayer.load" и го предайте на идентификационния номер на видеото, който получихме по-рано:

dailyMotionPlayer.load ( "x71jlg3");

Това ни дава следното:

импортиране на android.support.v7.app.AppCompatActivity; импортиране на android.os.Bundle; импортиране на com.dailymotion.android.player.sdk.PlayerWebView; импортиране на java.util.HashMap; import java.util.Map; обществен клас MainActivity разширява AppCompatActivity {private PlayerWebView dailyMotionPlayer; @Override защитена празнота onCreate (Bundle saveInstanceState) {super.onCreate (saveInstanceState); setContentView (R.layout.activity_main); // Изтеглете нашия PlayerWebView // dailyMotionPlayer = (PlayerWebView) findViewById (R.id.dailymotionPlayer); карта playerParams = нов HashMap <> (); // Заредете видеоклипа с нашите параметри // playerParams.put ("ключ", "стойност"); // Предайте идентификатора на видеото // dailyMotionPlayer.load ("x71jlg3"); }}

Инсталирайте проекта си на физическо устройство с Android или емулатор и видеото ви Dailymotion трябва да започне да се възпроизвежда автоматично.

Вграждане на видео на Vimeo

Когато става въпрос за вграждане на видео съдържание, обикновено ще искате да използвате специфичен за платформа API или специфичен за платформата SDK, когато е възможно. Но какво да стане, ако няма SDK или API за платформата за споделяне на видео, която имате предвид?

В тези сценарии можете да използвате компонента на WebView на Android, за да показвате видеоклипа като уеб страница, която е вградена в оформлението на вашата активност. В този последен раздел ще ви покажа как да вградите видео от популярната платформа Vimeo, използвайки WebView.

В допълнение към показването на видео съдържание, WebView може да бъде полезен в редица други сценарии. Например, представете си, че имате някакво съдържание, което трябва да се актуализира редовно; хостингът на това съдържание онлайн и след това показването му в приложението ви чрез WebView ви дава гъвкавост да променяте това съдържание онлайн по всяко време, без да се налага да публикувате нова версия на приложението си. Въпреки това, бъдете внимателни, когато използвате WebViews, тъй като те не поддържат много от функциите, които обикновено очаквате от самостоятелен уеб браузър. По-специално, на WebViews липсва адресна лента или навигационни контроли, което може да затрудни съдържанието им за взаимодействие с потребителите.

Преди да използвате WebView, винаги трябва да помислите дали алтернативно решение може да бъде по-подходящо, например можете да разтоварите съдържанието в уеб браузъра по подразбиране на устройството или да внедрите персонализирани раздели на Chrome.

Актуализиране на манифеста

Тъй като предаваме видео от интернет, трябва да добавим разрешение за интернет към нашия Манифест:

Ще пусна и MainActivity в ландшафтен режим:

Добавяне на WebView към нашия потребителски интерфейс

На следващо място, нека добавим WebView към нашето приложение. Можем или да добавим WebView към оформлението на нашата дейност, или да превърнем цялата активност в WebView, като я приложим в метода на onCreate () на нашето приложение.

Ще добавя WebView към оформлението на нашето приложение:

Изберете вашето видео

За пореден път ни трябва видео за показване, но този път сме не използване на видео идентификатор:

• Преминете към Vimeo и изберете видеоклип, който искате да използвате; Избрах за това отпадане на зимата.
• Кликнете върху бутона „Сподели“.
• Изберете иконата “Embed”; това ще ви предостави вграден код, който трябва да изглежда така:

Този код предоставя следната информация:

• вградена рамка. Указва, че вграждаме друга HTML страница в текущия контекст.
• SRC. Пътят на видеоклипа, така че приложението ви знае къде да намери този видеоклип.
• ширина, височина. Размерите на видеоклипа
• FRAMEBORDER. Дали да се покаже рамка около рамката на видеоклипа. Възможните стойности са граница (1) и без граница (0).
• allowfullscreen. Това позволява видеото да се показва в режим на цял екран.

Ще добавя този вграден код към моя проект като низ, така че трябва да копирате / поставите тази информация в следния шаблон:

String vimeoVideo = "ВАШЕТО ВРЪЗКА ИЗТЕ ТУК';

Разочароващо, трябва да направим няколко промени, преди вграденият код да е съвместим с нашето приложение за Android. Първо, трябва да добавим няколко знака „“, така че Android Studio да не се оплаква от неправилно форматиране:

String vimeoVideo = "';

И накрая, размерите на видео по подразбиране може да са твърде големи за някои екрани на смартфони с Android.
При производството обикновено експериментирате с различни измерения, за да видите какво дава най-добрите резултати при възможно най-различни конфигурации на екрана. Въпреки това, за да не излезе от контрол тази статия, просто ще използвам следното, което трябва да осигури добри резултати на вашия „типичен“ екран на смартфон за Android:

String vimeoVideo = "';

Показване на уеб страница в приложението ви за Android

Сега ние създадохме нашето оформление и всичките ни HTML са готови да работят, отваряме вашата MainActivity и даваме възможност да внедрите нашия WebView.

Започнете с добавяне на HTML низа:

String vimeoVideo = "';

След това трябва да заредим горната уеб страница в нашия WebView, използвайки метода loadUrl ():

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

JavaScript е деактивиран по подразбиране, така че ще трябва да го активираме в нашия WebView.

Всеки път, когато създавате WebView, автоматично се присвоява набор от уеб настройки. Ще извлечем този обект WebSettings, използвайки метода getSettings (), и след това ще активираме JavaScript, използвайки setJavaScriptEnabled ().

WebSettings webSettings = webView.getSettings (); webSettings.setJavaScriptEnabled (истина);

След като добавите всичко това към вашата MainActivity, вашият код трябва да изглежда така:

импортиране на android.support.v7.app.AppCompatActivity; импортиране на android.os.Bundle; импортиране на android.webkit.WebResourceRequest; импортиране на android.webkit.WebSettings; импортиране на android.webkit.WebView; импортиране на android.webkit.WebViewClient; обществен клас MainActivity разширява AppCompatActivity {@Override защитена празнота onCreate (Bundle saveInstanceState) {super.onCreate (saveInstanceState); setContentView (R.layout.activity_main); String vimeoVideo = ""; WebView webView = (WebView) findViewById (R.id.myWebView); webView.setWebViewClient (нов WebViewClient () {@Override public boolean shouldOverrideUrlLoading (WebView webView, WebResourceRequest заявка) {webView.rl.Urlget. (искане на заявката) {webView.Url.gett (искане). ()); return true;}}); WebSettings webSettings = webView.getSettings (); webSettings.setJavaScriptEnabled (true); webView.loadData (vimeoVideo, "text / html", "utf-8");}}

Тестване на приложението ви Vimeo

Вече знаете тренировката: инсталирайте този проект на физическо устройство с Android или AVD. WebView не е настроен да се възпроизвежда автоматично, така че ще трябва да подслушате видеото, за да разкриете медийните контроли на Vimeo. След това можете да възпроизвеждате, поставяте на пауза, пренавивате и премествате напред напред, за да се уверите, че той функционира правилно.

Обобщавайки

В тази статия ви показах как да добавяте видеоклипове от YouTube, Vimeo и Dailymotion към приложенията си, използвайки специфични за платформата API и SDK и собствения компонент на WebView на Android. Също така ви показах как да свържете видео файл с вашето приложение, така че той да може да се съхранява и възпроизвежда локално.

Кой е любимият ви начин за показване на мултимедийно съдържание на потребителите си? Уведомете ни в коментарите по-долу!