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

Version: JavaFX 1.2

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]

---