Displaying a webcam’s video in a Flex VideoDisplay control

Camera, VideoDisplay,

The following example shows you how you can display a user’s webcam feed in a VideoDisplay control using the static Camera.getCamera() method and VideoDisplay class’s attachCamera() method.

Full code after the jump.

This example won’t be very interesting unless you actually have a webcam installed.

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/01/22/displaying-a-webcams-video-in-a-flex-videodisplay-control/ -->
<mx:Application name="VideoDisplay_attachCamera_test"
        xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">
 
    <mx:Script>
        <![CDATA[
            import mx.controls.Alert;
 
            private function videoDisplay_creationComplete():void {
                var camera:Camera = Camera.getCamera();
                if (camera) {
                    videoDisplay.attachCamera(camera);
                } else {
                    Alert.show("You don't seem to have a camera.");
                }
            }
        ]]>
    </mx:Script>
 
    <mx:VideoDisplay id="videoDisplay"
            creationComplete="videoDisplay_creationComplete();"
            width="160"
            height="120" />
 
    <mx:Button id="button"
            label="Reload Camera"
            click="videoDisplay_creationComplete();" />
 
</mx:Application>

View source is enabled in the following example.

66 thoughts on “Displaying a webcam’s video in a Flex VideoDisplay control”

  2. Hi,

    Tanks for all, but i still have a question left,
    it seems that it doesn’t work with android at version 3.1, displaying the following message
    “You don’t seem to have a camera”,
    I’m using a tablet for this operation.
    Do you know how could i get this problem fixed ?
    I’d appreciate if you’d help me cause I’m stuck on it.

    Great blog by the way.

Comments are closed.