1. What is Chromecast.

This section of this article is intended for writing articles related to Video, Audio and multimedia related applications.

Chromecast was first introduced in 2013 in the US. Right from the first version, Google designed ChromeCast to be compatible with the 3rd party application, the original purpose was that you can stream and share anything on your TV devices. but more and more the successor and the final version, it was designed in favor of multimedia applications.

You should first understand what cast technology is and how it works before you dig deeper into its implementation.

It’s important to understand that the Chromecast apps don’t read the information directly from your app. It communicates with your application through a Socket . That Socket is opened when your application requests to set up a bridge to transmit information to specific Android TVs or Chromecast devices.

When you need to “Cast on …” from a sending application (here I call it a sender app), you are actually telling the cast device open a static web page, and that static web application is called a receiver app . This receiver app set is stored online and it will be downloaded upon receipt of a request to connect from the sender app device.

Google recommends that you are the best apps that connect to the receiver app when both of them use the same Wifi network. Because Sokcet will Sokcet open and transmit data through a so-called Wi-Fi Direct , a definition of a peer-to-peer transmission protocol between devices sharing the same Wi-Fi Direct network connection.

Oke paused on the theory for a bit, now we will start bit by bit to learn how to create a ChromeCast application and how to share information through that ChromeCast application. To do that, you need to do the jobs in the following order.

• Sign up for Cast Develop with Google
• Create a ChromeCast link to your Cast Develop account.
• Declare the receiver app app
• Setting up and configuring the receiver app
• Set up and configure the sender app

“The above steps are based on the experience I synthesized, but it is not certain that an application needs to go through all the above steps.”

Now we will go to learn step by step to be able to create an application with complete application of ChromeCast technology.

2. Register a dev account

To complete this step, you need 2 things first.

Unlike other Google services that are usually free for Deverlop but Chromecast service will need $ 5 to sign up, which is why even if you’re just a Deverlop for “even if it’s experimental” development then you still need a credit card with a minimum of $ 5 in it.

First, you will need to access the link to be able to register for a development account , after registration is complete, you will be forwarded to the Google Cast SDK Developer Console

Here you will need to set up the information about the sender app in the Applications and the receiver app in the Cast Receiver Devices section “Actually, I find this Cast Receiver Devices has more effects for debugging than providing products. products to future users ”

3. Link your ChromeCast device to the Develop account

Click on ADD NEW DEVICE here you need to enter the Serial Number on the back of the device ChromeCast , this is mainly declared so that you can run the receiver app under Debug mode on the device being declared.

With a large development team, you can add 3 to 4 ChromeCast devices here to serve the development work more smoothly.

4. Declare the Receiver App app

Click on ADD NEW APPLICATION . Here you need to declare some of the following important information.

• Application ID, South of Android app or IOS sender app
• Link Custom Receiver , where you design a web site to receive data from the sender app

After completing the above steps, you will get a string named receiver_id and this receiver_id will be configured in your sender app .

Let’s all pay attention to the so-called Custom Receiver for a bit. It is a static web page that receives data shared from the sender app and is displayed to the viewers on ChromeCast devices. This website will be written by you and it needs to be hosted on a certain hosting.

You need to understand roughly like this. When the ChromeCast device receives the request to share information from the sender app with 1 receiver_id , the device will use the link you configured in the Custom Receiver to load the web page on the device and display it on the terminal.

Those are the complete steps needed to set up on the Dev Account page, at this point you can turn off this website, but remember the sequence of characters is called receiver_id .

5. Set up and configure the Receiver App

You can find out the very simple receiver at the CAF SDK link . According to the definition of Google, the Receiver App will take on the following tasks.

• Provides interface to display the content on the terminal.
• Processing messages from the sender app to display content to viewers on the receiving device
• Process the user actions on the receiving device and send the information back to the sender app

It basically processes all the information displayed on the screen of the receiving device. Here are 1 basic apps of Receiver App

This design part I also refer, because I am an Android programmer or more succinctly, I am a programmer for the sender app. This section will give you more expertise in HTML, CSS and JS.

6. Setting up and configuring the Sender App

Full detailed instructions from Google can be found here

First you need to declare in build.gradle the libraries needed to use Sender App

In the Sender App you need to know the following 2 important parts

• The OptionsProvider is a Class that allows the framework to connect to the Receiver App
• Activity or Fragment class will manage communication and action related to Receiver App

6.1 OptionsProvider

Initialize the CastOptionsProvider class inheriting from the system’s OptionsProvider . Below is the most basic CastOptionsProvider configuration

And the CastOptionsProvider class will need to be declared in the manifest file

Once done, create an Activity with 2 basic events as follows.

• Displays the Cast button and connects to a Cast device.
• Send a message to a Cast device

6.2 Display Button Cast

Displayed on the System Menu

Or display it on the layout of the application

You can learn more about Cast Button here

This Cast Button Click event has been predefined by Google within the Framework. When you click on the cast button, there will be a dialog showing a list of ChromeCast devices that share the same Wifi network with your phone.

6.3 Send a message to a ChromeCast device