FX

How-To's > How do I add a video player?

You can easily create a simple video panel by using the MediaView and MediaPlayer classes as shown here.

def media = Media {source: "http://<myMediaServer>/<myVideoFile>"};

Stage {
    title: "Embedded Player"
    scene: Scene {
    width: 200
    height: 100 
    content: MediaView{
        mediaPlayer: MediaPlayer {
            media: media  
            } 
        }	 
    }
}

To embed this video panel in your web page, add the following script to the HTML file. Specify the actual names for the .jar file, application package, and the main class.

<script src="http://dl.javafx.com/dtfx.js"></script>
<script>
javafx(
    {
        archive: "MediaSamples.jar",
        draggable: true,
        width: 200,
        height: 100,
        code: "mediasamples.EmbeddedPlayer",
        name: "MediaSamples"
    }
);
</script>

Tips

• Use the fitWidth and fitHeight instance variable of the MediaView class to set the specific size of your video player. Then you can create several video thumbnails.
• The MediaView class is a node and it inherits all the instance variables of the Node class to apply transformations, effects, and animation.
• Start with a simple embedded media panel and enhance your application so that it can control playback, access volume and balance controls, and retrieve information about the media. See also How do I control playback from code? and How do I access volume controls?.

Examples

• Dragging an MP3 Player Applet to the Desktop
  This sample shows how to create a draggable player that users can save on the desktop for later use.
• Playing Video on the Sides of a Rotating Cube
  This sample shows how to play video on the sides of a rotating cube.
• Creating a Media Player
• Embedding Media Into the Web Page

API Documentation

• Media
• MediaPlayer
• MediaView

Last Updated: November 2009
[Return to How-To's Home]

---

Do you have comments about this article? We welcome your participation in our community. Please keep your comments civil and on point. You may optionally provide your email address to be notified of replies—your information is not used for any other purpose. By submitting a comment, you agree to these Terms of Use.