How do I play a YouTube video in my app?

LiveCode Players can play videos that are hosted on the internet by setting the filename property of the player to the video URL. This method works when the URL points to a video file that can be streamed directly, such as an mp4 file.

This method does not work for YouTube videos as a YouTube URL does not point directly to the video file.

This lesson will show how to use a Browser widget to play a YouTube video in your app.

Using a Browser Widget and YouTube URL

The simplest method is to add a Browser widget to your stack and set the URL property of the widget to the URL of your YouTube video.

This method shows the full YouTube page.

Using a Browser Widget and YouTube Embed code

If you need to show just the video you can use the embed code rather than the URL. The embed code is a small piece of HTML code.

The embed code for this video is

<iframe width="424" height="238" src="https://www.youtube.com/embed/C8RD4SVOyVs" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>
</iframe>
Click to copy

To use this embed code we need to set the htmlText property of the Browser widget.

In this example we will use a field to store the embed code but you could use a custom property, external HTML file or other method that suits your app.

  • Add a field
  • Set the name of the field to "embedCode"
  • Copy the embed code into the field
  • Execute this code in the Message Box
set the htmlText of widget "browser" to field "embedCode"
Click to copy

You can then set the visible of the "embedCode" field to false.

2 Comments

Matthew Turney

Trying to embed or use the browser to place a Youtube in my app. I hear audio but the screen is black. Is there something that is missing? Thanks!

Panos Merakos

Hello Matthew,

Are you on Mac, Windows or Linux? Could you share your sample stack? You can upload it to DropBox or WeTransfer and post the download link here.

Kind regards,
Panos
--

Add your comment

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.