1 / 43

Integrating Stunning Media Experiences in XAML

APP-788T. Integrating Stunning Media Experiences in XAML. Marco Matos Senior Program Manager Microsoft Corporation. Agenda. What’s new for media in Windows for XAML apps Understanding MediaElement , MediaPlayer , and CaptureElement

skip
Download Presentation

Integrating Stunning Media Experiences in XAML

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. APP-788T Integrating Stunning Media Experiences in XAML Marco Matos Senior Program Manager Microsoft Corporation

  2. Agenda • What’s new for media in Windows for XAML apps • Understanding MediaElement, MediaPlayer, and CaptureElement • Enable your Metro style app to play audio in the background • Tackling advanced scenarios around Media You’ll leave with examples of how to • Create apps with rich, integrated media experiences • Incorporate media into your apps in new ways

  3. Media powered by Windows 8 • Access the full power of the Windows media platform through XAML. - Playback; Capture; Connect • Simple to use media sourced from these locations: • Application storage; Local libraries; HomeGroup PC libraries, network attached storage; Web servers; Apps • Support for streaming, background audio, communications, playto, extensions, etc.

  4. Media Platform <MediaElement /> <MediaPlayer /> <CaptureElement /> Windows Runtime (WinRT) Windows Metro Style Web App (XAML) Streaming Protection MediaControl Capture Transcode Extensibility Windows Runtime (WinRT) Playback/Preview Capture Streaming Extensibility MediaControl Transcode Protection Media Foundation Media Foundation Audio/Video Source Video Decoder Video Effect 1 Video Effect 2 Video Encoder Audio/Video Sink Audio Decoder Audio Effect 1 Audio Effect 2 Audio Encoder DirectX Windows Audio Session API (WASAPI)

  5. Audio and video are a key element of visually rich and engaging applications.

  6. demo Memories app Take your scrapbooking app and make it come to life with video Video files packaged with the app Video files from disk Camera Capture UI

  7. MediaAPIs

  8. Familiar MediaElement • Events • CurrentStateChanged • DownloadProgressChanged • MarkerReached • MediaEnded\Opened\Failed • SeekCompleted • VolumeChange • Methods • Play() • Pause() • Stop() • Properties • AspectRatioHeight/Width • AudioStreamSelection • Balance • BufferingProgress • CurrentState • DownloadProgress • Markers • NaturalDuration • Source • Volume

  9. MediaElement <code snippet> • //MainPage.xaml • <MediaElementAutoPlay="True" Stretch="Uniform"Height=“250" Width=“250"/> • //MainPage.xaml.cs • if (myME.CurrentState == MediaElementState.Playing) • { • myME.Pause(); • }

  10. Building a Media Player

  11. MediaPlayer control • Templated control around MediaElement • Windows 8 look and feel transport controls • Targeted for basic playback scenarios • Can be styled like any other XAML control

  12. MediaPlayer • <MediaPlayerx:Name=“myMP"AutoPlay="True" Stretch="Uniform" Height=“250" Width=“250"/>

  13. Capture

  14. demo Capture app CaptureElement Preview Images Playback Video

  15. Capture Element • Camera app provides it’s own UI • UI Element for customizing preview scenarios • Capture photos and videos from within XAML application • Integrates with MediaCapture Manager

  16. CaptureElement • //MainPage.xaml • <CaptureElementx:Name=“myCaptureElement" Width="320" Height="240"/> • //MainPage.xaml.cs • MediaCapturemediaCaptureMgr = newMediaCapture(); • MediaCaptureInitializationSettingsinitSettings = newMediaCaptureInitializationSettings(); • awaitmediaCaptureMgr.InitializeAsync(initSettings); • myCaptureElement.Source = mediaCaptureMgr; • awaitmediaCaptureMgr.StartPreviewAsync();

  17. Building a Media App

  18. demo My Media Player Walk through an end to end media application FilePicker MediaPlayer

  19. Local Library Access • Allow app user to pick files for your application • Access My Music/Videos/Pictures libraries via capabilities • Visualize user’s library with XAML modern collections • Utilize APIs to access rich set of media related file properties

  20. demo My Media Player Walk through an end to end media application Music APIs access Music Library access Visualize Media Full Screen Video

  21. Fullscreen video • Respect your application’s XAML tree • Utilize Visibility property • Window.Current.Bounds is your friend • MediaPlayer & MediaElement

  22. Background Audio

  23. I can listen to my favorite songs while using other Metro style apps

  24. demo My Media Player Walk through an end to end media application Background Audio

  25. Background Audio • Windows 8 manages playback so users can focus on enjoying their media • Apps opt in via PackageManifest and MediaElement • Hierarchy of media categories for Metro apps • Only use background audio if your scenario requires it

  26. Enable Background Audio • <!--package.appxmanifest--> • … • <ExtensionCategory="windows.backgroundTasks" • StartPage="default.html"> • <BackgroundTasks> • <TaskType="audio" /> • </BackgroundTasks> • </Extension> • //MainPage.xaml • <MediaElement x:Name="myME"AudioCategory=“Media"/>

  27. Background Audio – “AudioCategory”

  28. demo My Media Player Mixing Audio

  29. Advanced media scenarios

  30. Integrate your Windows 8 device with your home media experiences

  31. Play To User Experience Play To Controller Play To Receiver

  32. Implementing PlayTo • voidmyPlayToManager_SourceRequested(PlayToManager sender, PlayToSourceRequestedEventArgs e) • { • PlayToSourceDeferralDeferral = e.SourceRequest.GetDeferral(); • e.SourceRequest.SetSource(myMediaElement.PlayToSource); • Deferral.Complete(); • }

  33. Media Buttons MediaControlexposes events for media buttons PlaySelected, PauseSelected, PlayPauseSelected FastForwardSelected, RewindSelected NextTrackSelected, PreviousTrackSelected RecordSelected ChannelDownSelected, ChannelUpSelected Will work with USB-HIDdevices

  34. Audio Device Type • Choose the audio output device specific to your scenario • Multimedia • Communication (default if AudioCategory=“Communications”) • Users can set the default devices in control panel

  35. Media Formats and Codecs System-wide • File format: MP4 (preferred) or ASF • Video: H.264 or VC-1 • Audio: AAC, MP3 or WMA • Broad support across consumer hardware: great performance and battery life Per-app • Your Metro style app can package private plug-ins for its own use (e.g. adaptive streaming)

  36. Extended Media Functionality • Audio/Video Effects • MediaFoundation is completely extensible and supports C++/COM components packaged with app • Microsoft will make a SmoothStreaming SDK for Windows Metro style apps available • Microsoft will provide an implementation of PlayReady for Windows 8 Metro style apps.

  37. Recap

  38. Media powered by Windows 8 • Built-in controls of MediaPlayer • Source media to your app from multiple locations • Enable media multitasking scenarios • Media Platform is completely extensible for your specific scenario

  39. Related sessions • [APP-914T] The lifetime of XAML text: from input to display through printing • [PLAT-775T] Immersive video and audio Metro style apps part 1 • [PLAT-776T] Immersive video and audio Metro style apps part 2 • [PLAT-777T] Capturing personal photos, video and audio in Metro style apps • [HW-715T] Tailoring the Metro Camera Experience • [PLAT-783T] Extending the media platform using input, output and processing plug-ins

  40. Further reading and documentation Metro style app Dev Center Links • Learn to build Metro style apps • Metro style app samples • Building your first Metro style app with C#, C++, and Visual Basic • Developing basic Metro style apps with C#, C++, and Visual Basic Windows 8 SDK Samples

  41. thank you Feedback and questions http://forums.dev.windows.com Session feedbackhttp://bldw.in/SessionFeedback

  42. © 2011 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

More Related