Silverlight 4 is now not only more mature but also came with rich features. Most of these features were recommendations from the Silverlight community.
Webcam support is one of them. This was a very highly requested feature and has now been included in this version.
The following steps will get you up and running for the initial adventure.
Steps
Step 1
The first step is to get all the available capture devices (webcams, microphones, etc.) or default capture device on the system. So CaptureDeviceConfiguration
class helps us to obtain information about all available devices. This helper class exposes a number of static
members for this purpose.
CaptureDeviceConfiguration.GetAvailableVideoCaptureDevices()
- Returns a collection of video devices on the system
CaptureDeviceConfiguration.GetAvailableAudioCaptureDevices()
CaptureDeviceConfiguration.GetDefaultAudioCaptureDevice()
CaptureDeviceConfiguration.GetDefaultVideoCaptureDevice()
So after the first step, we got the device.
Step 2
Before any interaction with the device, Silverlight application needs permission from the user (The user must grant permission in the security prompt and that way, it ensures the call is safe).
CaptureDeviceConfiguration.RequestDeviceAccess()
:
To request access, call this static
method in response to user initiated event like listbox item selection, button click, etc. If your application automates this call without user interaction (i.e., Load
event) the method will return false
and further action by application will throw an InvalidOperationException
.
Okay, application got the permission. Let's proceed to the next step.
Step 3
Now we have permission and device handy. It’s time for the application to interact with the device using CaptureSource
class. This class allows you to collect the video feed from the camera. To make this happen, create a CaptureSource
object and set the VideoCaptureDevice
to the selected device. With the help of CaptureSource
, the application is now capable of performing the following task on the devices:
- Start
- Stop
- State of the device
- Capturing single video frame
Step 4
Now create a video brush. A VideoBrush
gives us the ability to paint any area or controls with video content. At this stage, we use CaptureSource
as a source of our brush.
Step 5
The next thing we need to do is to call CaptureSource.Start()
method to begin capturing our live video.
Step 6
Finally, we’ll set the Fill
property of a Rectangle
object to this brush.
Simple Application
Now, we will code a very simple application:
- Create a Silverlight application and open the MainPage.xaml.
- Add one rectangle (for display purpose) and two buttons (start and stop).
<Grid x:Name="LayoutRoot" Background="White">
<StackPanel Name="mainStackpanel">
<Rectangle Height="256"
Name="myDisplay" Stroke="Black"
StrokeThickness="1" Width="584" />
<StackPanel Name="subStackpanel" Orientation="Horizontal"
HorizontalAlignment="Center">
<Button x:Name="butStart"
Content="Start" Click="butStart_Click"/>
<Button x:Name="butStop"
Content="Stop" Click="butStop_Click" />
</StackPanel>
</StackPanel>
</Grid>
- Code behind as follows:
public partial class MainPage : UserControl
{
CaptureSource captureSourec;
public MainPage()
{
InitializeComponent();
}
private void butStart_Click(object sender, RoutedEventArgs e)
{
VideoCaptureDevice myWebcam =
CaptureDeviceConfiguration.GetDefaultVideoCaptureDevice();
if (CaptureDeviceConfiguration.AllowedDeviceAccess ||
CaptureDeviceConfiguration.RequestDeviceAccess())
{
captureSourec = new CaptureSource();
captureSourec.VideoCaptureDevice = myWebcam;
VideoBrush myBrush = new VideoBrush();
myBrush.SetSource(captureSourec);
myBrush.Stretch = Stretch.UniformToFill;
captureSourec.Start();
myDisplay.Fill = myBrush;
}
}
private void butStop_Click(object sender, RoutedEventArgs e)
{
if (captureSourec != null)
{
captureSourec.Stop();
}
}
}