영욱닷컴(http://youngwook.com)

작년에 집에서 나오다가 뭔가 이상한 카메라가 장착된 차량이 휙 지나가긴 했지만 지나가고 나서야 그게 로드뷰 차량인 줄 알았습니다. ^^  미리 알았으면 좀 더 재미있는 퍼포먼스를 했을 텐데 위의 사진 속의 인물이 저라는 것을 확인 시켜 드리기 위해서 이전에 공개 한 바 있는 사진을 다시 공개 합니다.

KBS의 폭소클럽에서 유상무 뒤에 있다가 카메라에 잡혔는데 로드뷰에 잡혔을 때랑 같은 옷을 입고 있습니다.

어딘가에 흔적이 남는 다는 건 그 자체로 어떤 의미 같은게 느껴지는 것 같습니다.

작년 2009년 11월 PDC 현장에서 알려진 데로 Windows Azure Platform 정식으로 세상에 나왔습니다. Windows Azure는 잘 알려져 있는 데로 Microsoft의 Cloud Platform 입니다. (Azure 자체에 대한 꼼꼼한 설명과 내용은 1월 중에 다시 하도록 할 예정입니다. )

한 가지 안타까운 점은 이번 정식 버전의 출시에 한국은 포함되어 있지 않다는 점입니다. 하지만 글로벌 기업이나 해외에 지사가 있는 업체의 경우는 사용이 가능 한 것으로 알려져 있습니다.

정식 출시에 포함된 내용들은

• Windows Azure
  Cloud Service를 제공하는 기반 플랫폼으로 스토리지, CPU등을 제공하고 있다.
• SQL Azure
  관계형 데이터 베이스인  SQL Server를  Cloud 기반으로 제공하는 서비스.
• Windows Azure Platform AppFabric
  이번 정식 발표에서 가장 큰 변화가 아닐까 하는 생각이 드는 요소가 바로 AppFabric 입니다.
  서비스의 연계 및 제어 그리고 인증 체계의 통합을 SAML 토근을 사용해서 제공.

이렇게 세 가지 입니다.

좀 더 자세한 정보는 Windows Azure 팀 블로그를 통해서 정보를 얻을 수 있습니다.

1.RichTextArea Part 1
2.RichTextArea Part 2
3.Accessing Web Camera and Microphone
4.Right Click Mouse Events
5.MouseWheel API

6.Using Silveright Controls As Drop Targets
7.DataGrid Enhancements
8.Printing API Basics 
9.Hosting HTML Content
10.Accessing the Global Clipboard Programmatically 
11.Using the ViewBox Control 
12.Asynchronous Data Validation 
13.BiDi and Right-to-Left Support 
14.Notification API
15.Local File Access 
16.RIA Services support in Visual Studio 2010 

김영욱 차장 Microsoft Korea  .NET Evangelist Enterprise UX 를 위한  UI 기술과 SOA, Cloud Computing, NUI등 다양한 분야의 접목과 응용을 통해 최적의 IT 인프라 구축을 위해서 노력하고 있다. Email: iwinkey@hotmail.com Blog: http://winkey.tistory.com

Silverlight 4 에서 추가 된 기능 중에서 가장 재미있는 기능을 하나 뽑으라고 한다면 저는 주저 없이 Web Camera와 Microphone의 지원이라고 이야기 할 수 있을 만큼 Web Camera와 Microphone의 추가는 많은 가능성을 가지고 있는 기능 중에 하나 입니다. Flash에서도 이미 지원되고 있지만 효율 및 신뢰성 측면에서는 Silverlight 4가 좀 더 안정된 기능을 제공 할 수 있을 것으로 기대하고 있습니다.

Web Camera를 활용할 수 있는 분야라면 어떤 것이 있을 까요? 우선 화상회의 와 같은 부분들도 생각할 수 있고 또 Web Camera를 사용한 사진 촬영으로 각종 프로필 사진을 대치 한다든지 하는 용도로 요긴하게 사용할 수 있습니다. 하지만 무엇보다도 어학 및 기타 교육 관련 사이트에서 적극적으로 활용해 볼 만한 기능인 것 같습니다.

이번 강좌에서는 아래와 같은 기능을 완성해 볼 예정입니다.

먼저 Web Camera나 Microphone이 하나 이상 있을 수 있기 때문에 해당 되는 장치의 목록을 보여주고 원하는 장치를 선택할 수 있게 할 예정입니다. 장치를 선택하고 나서 바로 Web Camera 영상을 볼 수도 있고 스넵셧 컷도 찍을 수 있게 만들어 볼 예정입니다.

1. 출력은 Rectangle로 한다.

Silverlight 4가 Web Camera의 출력을 위해서 새로운 컨트롤을 제공하지는 않습니다. 대신 기존의 컨트롤에 출력할 수 있도록 Brush 형태로 제공할 수 있습니다. 이번 샘플에서는 사각형을 나타내는 Rechtangle 컨트롤에 출력할 예정입니다.

<Rectangle x:Name="WebcamCapture" Width="320" Height="240" Fill="White"/>

UI를 나타내는 XAML에 위와 같이 Rectangel을 하나 추가해서 여기에서 Web Camera의 출력을 보여줄 예정입니다.

2. Video & Audio 장치는 복수개가 있을 수 있다.

노트북을 사용하는 사용자 혹은 데스크탑을 사용한 다 하더라도 시스템에 기본 장착되어 있는 Video & Audio 장치 이외에도 추가로 다양한 장치들이 설치되어 있는 경우들이 많이 있습니다. Silverlight에서는 어떤 장치를 사용하게 될까요? 기본적인 대답은 ‘골라 쓰는 재미가 있다’ 정도 일 것입니다.

Silverlight에서는 기본적으로 해당 PC에서 설치된 장치 목록을 가져올 수 있는 System.Windows.Media.CaptionDeviceConfiguration 객체를 제공합니다. 이 객체의 주요 메소드는 다음과 같습니다.

화면에 해당 Video & Audio 장치 목록을 보여줄 ListBox 컨트롤을 두 개 추가해야 합니다.

<TextBlock Margin="5" HorizontalAlignment="Center" Foreground="White" Text="Available AUDIO Sources" Grid.Column="0" Grid.Row="0" />
<ListBox x:Name="AudioSources" Grid.Row="1" Grid.Column="0">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding FriendlyName}" />
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

<TextBlock Margin="5" HorizontalAlignment="Center" Foreground="White" Text="Available VIDEO Sources" Grid.Column="1" Grid.Row="0" />
<ListBox x:Name="VideoSources" Grid.Row="1" Grid.Column="1">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding FriendlyName}" />
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

두 개의 ListBox 컨트롤의 이름은 각 각 AudioSource와 VideoSourde로 지었습니다. ListBox 안에는 DataTemplate으로 바인딩 하기 좋은 형태로 구성했는데 TextBlock을 출력하는 형태로 만들었습니다. Binding FriendlyName이라고 해서 해당 장치의 FrinedlyName을 바인딩 할 수 있게 구성했습니다. FriendlyName은 이름 그대로 해당 장치 명을 의미합니다.

사용하는 방법은 간단해서 아래와 같이 두 개의 ListBox에 CatureDeviceConfiguratuion 객체를 사용해서 장치 목록을 가져와서 넣기만 하면 바로 바인딩 된 결과를 볼 수 있습니다.

// get list of audio sources
AudioSources.ItemsSource = CaptureDeviceConfiguration.GetAvailableAudioCaptureDevices();

// get list of the video sources
VideoSources.ItemsSource = CaptureDeviceConfiguration.GetAvailableVideoCaptureDevices();

3. Web Camera의 내용을 출력하자.

장치 목록을 선택했다면 이제 화면에 Web Camera의 내용을 출력할 수 있는 준비가 거의 끝났습니다. 이제 캡쳐 버튼을 누르게 되면 호출 될 이벤트 핸들러의 내용을 채워 보도록 하겠습니다.

private void CaptureButton_Click(object sender, RoutedEventArgs e)
{
    if (_captureSource != null)
    {
        _captureSource.Stop(); // stop whatever device may be capturing

        // set the devices for the capture source
        _captureSource.VideoCaptureDevice = (VideoCaptureDevice)VideoSources.SelectedItem;
        _captureSource.AudioCaptureDevice = (AudioCaptureDevice)AudioSources.SelectedItem;

        // create the brush
        VideoBrush vidBrush = new VideoBrush();
        vidBrush.SetSource(_captureSource);
        WebcamCapture.Fill = vidBrush; // paint the brush on the rectangle

        // request user permission and display the capture
        if (CaptureDeviceConfiguration.AllowedDeviceAccess || CaptureDeviceConfiguration.RequestDeviceAccess())
        {
            _captureSource.Start();
        }
    }
}

먼저 if문에서 캡쳐 소스가 널 값인지 아닌지 먼저 체크를 합니다. 뜬금없이 _captureSoure가 나왔는데 Silverlight 4에서는 Web Camera나 혹은 Microphone의 내용을 저장할 수 있는 객체로 CaptureSoure라는 객체를 제공하고 있습니다.

여기 소스에서는 보이지 않지만

CaptureSource _captureSource;

와 같은 문장으로 해당 객체를 이미 맴버 변수로 정의해 두었습니다.

캡쳐를 시작할 때 이미 해당 객체가 캡쳐를 하고 잇으면 해당 캡쳐 장치들이 응답하지 못하기 때문에 _captureSource.Stop()을 호출해서 먼저 정지를 시킵니다.

아래의 두 줄은 캡쳐 할 장치를 선택할 수 있게 해주는 소스 입니다.  

_captureSource.VideoCaptureDevice = (VideoCaptureDevice)VideoSources.SelectedItem;
_captureSource.AudioCaptureDevice = (AudioCaptureDevice)AudioSources.SelectedItem;

위에서도 언급했지만 Web Camera를 위한 특별한 컨트롤은 제공되지 않는다고 했습니다. 대신 Brush를 사용 할 수 있다고 했는데 아래 내용은 Brush를 설정하는 부분입니다.

VideoBrush vidBrush = new VideoBrush();
vidBrush.SetSource(_captureSource);
WebcamCapture.Fill = vidBrush; // paint the brush on the rectangle

VideoBrush를 정의하고 해당 VideoBrush의 소스를 _captrueSoure로 설정하고 있습니다. 그리고 앞에서 Web Camera의 출력용으로 사용하기 위해서 미리 정의해둔 Rectangle 객체인 WebcamCaptrue의 Fill 속성에 해당 VideoBrush를 설정 합니다.

이제 장치들이 접근 가능하다면 _captureSource.Start()를 호출하는 것으로 Web Camera의 연결이 끝났습니다.

참 쉽죠 ^^

  4. 사진을 찍어 보자.

Web Camera를 사용해서 스냅 셧을 찍는 기능을 구현 하는 작업이 이전에는 그리 단순한 작업이 아니었지만 Silverlight 4에서는 아주 심플하게도 아래 한 줄이 해당 기능을 다 구현해 줍니다. 

_captureSource.AsyncCaptureImage((snapImage)

나머지 소스는 첨부된 샘플을 참조하시면 이해하시리라 믿고 일단 패스 합니다.

First Look Silverlight 4 19-3 Web Camera and Microphone.zip