Android-app-using-Kotlin/C3/Playing-video-using-YouTube-API/English-timed

Time	Narration
00:01	Welcome to the Spoken Tutorial on Playing video using YouTube API.
00:07	In this tutorial we will learn to Create a project in Google cloud
00:13	Enable the YouTube API
00:16	Initialise the YouTubePlayerView in Android studio
00:21	Run the Kotlin App and Play the selected video
00:27	To record this tutorial, I am using Ubuntu Linux 16.04 operating system
00:34	Android Studio version 3.x and
00:38	Android Phone with minimum of Android OS version 4.03
00:45	To follow this tutorial, you should have basic knowledge of Java programming language and Android Studio
00:55	If not, then go through the relevant tutorials on this website.
01:00	First let us create a project in Google cloud.
01:05	Open a web browser and go to the website cloud dot google dot com as shown here.
01:13	Click Console at the top right corner of the window.
01:17	Maximise the window if you don’t see the Console option.
01:22	Accept the terms and conditions of the Google Cloud platform.
01:27	Then sign in or login with your google credentials. I have logged in already.
01:35	A dashboard opens.
01:38	Now we will create a new project to mention the APIs that we will use in the Android app.
01:46	In the top menu bar, click on Select a project drop-down box.
01:52	Create a new project by clicking on NEW PROJECT button at the top right of the dialog box.
02:00	In the next screen, type the name of the project as MyKotlinProject.
02:06	Then click on Create button at the bottom of the scree.
02:11	Then go to Select a project dropdown box.
02:16	Click on MyKotlinProject that is created just now.
02:21	The project dashboard is displayed with the project name MyKotlinProject.
02:27	Now we will enable the YouTube API in this project.
02:32	Open the navigation menu at the top left corner.
02:36	Click APIs & Services then dashboard
02:41	A new dashboard of APIs & Services appears.
02:47	Click Enable Apis and services at the top middle of the window.
02:52	In the search box, type youtube.
02:57	Select YouTube Data API v3.
03:02	Click on the ENABLE button.
03:05	After few seconds the API will be enabled.
03:09	Now select Credentials in the left sidebar or click on Create Credentials button.
03:17	This will create new credentials.
03:20	Let us click on Create Credentials drop-down and select API Key.
03:27	API Key is generated and shown under Your API Key.
03:32	Copy that key and save it in a text editor for future use.
03:37	Then click on the 'Close button in the dialog box.
03:42	We will use this key in our app’s Kotlin code to load the YouTube video.
03:48	In Android Studio, we don’t have any tool in the palette which can play YouTube videos.
03:55	But YouTube provides its own YouTubePlayerView which we can use.
04:01	The view just needs to be initialized directly to play a video from YouTube, by giving the video ID.
04:09	Open the web browser.
04:12	Now let’s download the required file from the developer website.
04:17	Go to this website.
04:20	A download option is provided under Download link column.
04:25	Click on Download and then click on SaveFile option and click on Ok button.
04:33	A zip file gets downloaded. Extract the zip file.
04:40	From the extracted folder, open libs folder.
04:45	This folder contains YouTubeAndroidPlayerApi dot jar file which we can use to play YouTube videos.
04:54	We need to copy this file in our Android Studio project. So, right-click and select copy.
05:02	Let us open Android Studio.
05:04	Open the project ST Search.
05:10	Once the project is completely loaded go to the left panel and select Project tab.
05:17	Right-click on the app folder and select Show in Files.
05:23	The File Explorer opens showing the project folder.
05:28	Open libs folder.
05:31	Right-click and select paste to copy the YouTubeAndroidPlayerApi dot jar file into libs folder. Close the window.
05:43	In the left panel, under Project, go to Gradle Scripts.
05:47	Double-click on build dot gradle within brackets Module colon app
05:55	In the dependencies block {} we will add a new dependency.
05:59	At the end of the block add a new line as shown here.
06:04	A Sync Now message appears at the top right corner. Click on it.
06:10	Wait for the gradle build to complete.
06:13	Now we will edit the layout file for third activity.
06:18	Go to activity underscore third dot xml
06:23	Here we will display the YouTube video.
06:27	At the bottom of activity underscore third dot xml, click on Text mode.
06:34	Now we will write our own code for YouTube player.
06:39	Between the tags of ConstraintLayout type the below code.
06:44	Now again go back to Design mode by clicking on the Design button at the bottom.
06:51	We can see a view with the name “com dot google YouTubePlayerView” with a grey colored background.
06:59	Now we shall set its constraints.
07:03	First hold and drag the YouTubePlayerView box little lower.
07:09	Now we can clearly see the constraint circles.
07:13	Join the top, left and right circles to the boundaries as shown here
07:19	Go to Attribute window and type the ID attribute as youtube underscore playerview.
07:27	Change the layout height attribute of YouTubePlayerView to wrap content.
07:34	Now let’s place a TextView below this to display the video title.
07:39	Drag a TextView and drop it in the layout.
07:43	Set the top constraint below the YouTube player view.
07:47	Set the left constraint to left boundary.
07:51	Change the ID attribute of the TextView to youtube underscore title
07:57	Next we will write the code to play the video. Go to ThirdActivity dot kt
08:05	To show YouTube video, our class should extend YouTubeBaseActivity.
08:11	Change the class declaration code as shown.
08:15	Now we will add code in our onCreate method.
08:20	So first we’ll create a variable to store the API key that we got from Google Cloud Console.
08:28	So declare the variable below the toast command as shown:
08:33	In the place of “YOUR KEY HERE” paste the API key which was saved in the text editor.
08:42	Now we will set the text of our youtube underscore title.
08:47	Type the code as shown.
08:50	Next, we’ll make an object for YouTube player view.
08:56	So, type this code as shown here
09:00	Next, We will then initialize the playerView.
09:04	For that, type the code as shown.
09:08	The code will initialize the YouTube player with the selectedVideoID using cueVideo method.
09:16	If it fails, it will show an error message as toast.
09:21	We have typed all the necessary code.
09:24	Now let us run the App.
0:27	Select the Foss and Language and click on the Search button.
09:33	We can see that the video thumbnails get loaded.
09:37	Click on any one. The video plays in a new screen.
09:44	Go back and click any other video thumbnail.
09:48	Once again, the video plays in a new screen.
09:53	Spoken Tutorial’s ST search app is now ready to launch.
09:58	Please follow the steps in the given link to become a publisher.
10:03	This is the official link where the registration is to be done
10:07	Once completed, you will be able to publish or upload your Android App on Google Play Store.
10:15	This brings us to the end of this tutorial. Let us summarize.
10:20	In this tutorial we learnt to Create a project in Google cloud
10:26	Enable the YouTube API
10:29	Initialise the YouTubePlayerView in Android studio
10:34	Run the Kotlin App and Play the selected video
10:39	As an assignment Select different FOSS and Language combinations and play the selected video
10:46	The video at the following link summarises the Spoken Tutorial project. Please download and watch it
10:54	The Spoken Tutorial Project Team conducts workshops and gives certificates on passing online tests. For more details, please write to us.
11:05	Please post your timed queries in this forum.
11:09	Spoken Tutorial project is funded by NMEICT, MHRD, Government of India. More information on this mission is available at this link.
11:22	The Android app and the script for this tutorial was contributed by Abhishek Shah.
11:28	And this is Nirmala Venkat along with the Spoken Tutorial team from IIT Bombay, signing off. Thanks for watching.

Contributors and Content Editors

PoojaMoolya