风云的银光志Silverlight4.0教程之与摄像头与迈克风设备交互

微软于PDC2009上发布Silverlight 4 Beta版,微软在Silverlight 4版本中处理了约8000个的Silverlight终端用户的请求,加入了一系列另开发人员兴奋的新特性,最突出的主要体现在几个方面:
开发工具增强:Visual Studio 2010具有可视化的设计工具,创建项目时可以选择运行时版本是3.0还是4.0,BLEND4加入XAML和C#代码全方位智能感知功能、XAML的样式应用更为易用等。
摄像头与MIC硬件支持:可以用极少量的代码实现启用用户本机的WebCam和Mic,并可进行本地录制。
报表打印支持:报表打印问题在Silverlight4中得到的较好的解决。
更强大的基础类控件(RichTextBox、DataGrid增强版):富文本控件RichTextBox和具有可粘贴、排序功能的DataGrid被加入。
WCF增强:终于支持TCP通讯,比较HTTP提升3-5倍,限于4502-4534端口。
兼容性增强:对Google的Chrome浏览器的支持。
MEF支持:MEF全称为Managed Extensibility Framework,译为“托管扩展框架”,支持创建大型复杂的应用程序。
运行速度提升:启动速度和渲染速度较前个版本提升约2倍左右。
DRM增强:支持PlayReady,可以对视频和音频的播放进行的保护,补充了对H.264的DRM保护。
其它增强:本地文件读写、鼠标右键事件支持、剪粘板支持。
当用户安装好Silverlight 4.0运行时后,打开浏览器在任何一个Silverlight应用程序点击鼠标右键可以看到Silverlight4插件的属性,其中加入了WebCam和MIC支持的TAB项,如图所示。
 
风云的银光志Silverlight4.0教程之与摄像头与迈克风设备交互
Silverlight 4.0的CaptureDeviceConfiguration.GetAvailableVideoCaptureDevices可以得到用户本机所有可用的摄像头设备列表,下面我们实现在Silverlight中启用用户本机的摄像头,首先在界面中添加一个用来显示视频的“容器”Grid,然后添加一个按钮用来启用CAM设备,如图所示。
风云的银光志Silverlight4.0教程之与摄像头与迈克风设备交互
XAML:
1      <Border x:Name="LayoutRoot" CornerRadius="5"  
2          BorderBrush="Gray" BorderThickness="3"> 
3          <Border.Background> 
4              <VideoBrush x:Name="myVideoBrush"/> 
5          </Border.Background> 
6          <Button x:Name="btnCam" HorizontalAlignment="Right" 
7              VerticalAlignment="Bottom" 
8              Width="120" Height="30"  
9              Content="启动摄像头"/> 
10     </Border>
C#:
1          public VideoAndAudio() 
2          { 
3              InitializeComponent(); 
4              this.btnCam.Click += new RoutedEventHandler(btnCam_Click); 
5          } 
6  
7          void btnCam_Click(object sender, RoutedEventArgs e) 
8          { 
9              //取得默认视频设备对象 
10             VideoCaptureDevice cam = CaptureDeviceConfiguration.GetDefaultVideoCaptureDevice(); 
11             //创建视频捕获源对象 
12             CaptureSource videoSource = new CaptureSource(); 
13             //获取用户启用本机摄像头的许可 
14             if (CaptureDeviceConfiguration.RequestDeviceAccess()) 
15             { 
16                 //设置视频设备 
17                 videoSource.VideoCaptureDevice = cam; 
18                 //设置视频来源 
19                 myVideoBrush.SetSource(videoSource); 
20                 myVideoBrush.Stretch = Stretch.Fill; 
21                 //启动摄像头 
22                 videoSource.Start(); 
23             } 
24         }
点击启用摄像头按钮后,Silverlight会提示用户是否允许应用程序访问你的本机视频设备。
 
风云的银光志Silverlight4.0教程之与摄像头与迈克风设备交互
用户选择是后,用户的视频内容就会立刻显示在Border的VideoBrush区域内,是不是很容易呢。
风云的银光志Silverlight4.0教程之与摄像头与迈克风设备交互
风云的银光志Silverlight4.0教程之与摄像头与迈克风设备交互
  启用前                                                                     启用后
Silverlight 4.0不但支持视频设备的显示,同时结合控件的截图功能,可以很方便的得到用户的照片,接下来加入截图代码。
XAML:
1      <StackPanel x:Name="LayoutRoot"> 
2          <Border Height="350" x:Name="myBorder" CornerRadius="5"  
3          BorderBrush="Gray" BorderThickness="3"> 
4              <Border.Background> 
5                  <VideoBrush x:Name="myVideoBrush"/> 
6              </Border.Background> 
7          </Border> 
8          <StackPanel x:Name="tsp" Orientation="Horizontal"  
9               Height="100"></StackPanel> 
10         <StackPanel Orientation="Horizontal" Height="30"  
11                 HorizontalAlignment="Center"> 
12             <Button x:Name="btnCam" HorizontalAlignment="Right" 
13             VerticalAlignment="Bottom" 
14             Width="120" Height="30"  
15             Content="启动摄像头"/> 
16             <Button x:Name="btnCrop" HorizontalAlignment="Right" 
17             VerticalAlignment="Bottom" 
18             Width="120" Height="30"  
19             Content="视频截图"/> 
20         </StackPanel> 
21     </StackPanel>
C#:
1          void CropVideo() 
2          { 
3              //创建可写入位图对象 
4              WriteableBitmap wBitmap = new WriteableBitmap(myBorder, new MatrixTransform()); 
5              //创建一个图像 
6              Image img = new Image(); 
7              img.Width = 100; 
8              img.Margin = new Thickness(2); 
9              //将wBitmap做为图像源 
10             img.Source = wBitmap; 
11             //将图像添加到WrapPanel控件 
12             tsp.Children.Add(img); 
13         }
运行结果:
 
风云的银光志Silverlight4.0教程之与摄像头与迈克风设备交互
 
通过这种方式可以很方便的实现用户头像的上传,是不是很方便呢。
上一篇:Windows下的包管理器Chocolatey


下一篇:kbmmw 与extjs 通过JSON Base64 显示图片