The Top 10 Things I've Learned About Building Windows Store Apps as a Silverlight Developer

This session will help existing Silverlight developers get over the hump of building Windows 8 Store apps using XAML/C#. I have built both Silverlight and Windows 8 apps and share 10 things that I’ve found every Silverlight developer should know before starting their first XAML/C# Windows Store App.

Transcript

1. The Top 10 Things I’ve Learned About Building Windows Store Apps as a Silverlight Developer Michael Crump | Telerik | @mbcrump
2. Introduction Michael Crump Microsoft MVP, Pluralsight & MSDN Author </XAML>, Telerik • @mbcrump • http://michaelcrump.net • http://blogs.telerik.com/michaelcrump • http://linkedin.com/in/mbcrump
3. SO YOU’RE A SILVERLIGHT DEVELOPER…NOW WHAT?
4. #1: Starting with the Fundamentals • Bullet 1 • Bullet 2 • Bullet 3 • Bullet 4 • Bullet 5 • Bullet 6
5. Fundamentals Silverlight • Hosted inside a web browser via plug-in. • SL Apps can run on Windows/Mac even Linux. • You primarily use C#/VB and XAML to develop applications. • XNA – (partial support) Available in SL5. • Uses .NET Framework 2.0-4.5 • Can use any version of Visual Studio to develop for it. • Built primary for mouse/keyboard input. Windows Store App • Runs on top of WinRT inside Windows 8. • Windows Store Applications can only run in Windows 8. • You can use C#/VB/C++/XAML or HTML5/JS/CSS3. • XNA removed. Direct3D available in C++ apps. • Uses .NET Framework 4.5. • Can only develop for it using VS2012 or VS2013 Preview and Windows 8. • Built primary for touch input. (No Chrome)
6. #2: Application Lifecycle App Launched Running App Terminated App
7. Silverlight User Request Webpage HTML Page <object> tag loads plug-in Plug-in downloads XAP file and reads manifest Create instance of Application Class Fire Application Start up Event Completed page rendering.
8. Windows Store App Running App Suspended App suspending Terminated App Low Memory Code gets to run No code runs App not running resuming User Launches App Splash screen
9. #3: XML Namespaces You only declare the namespace (never the assembly) and you should use "using" instead of "clr-namespace"
10. #3: XML Namespaces Silverlight <UserControl x:Class="DiggSample.Page" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:Digg="clr-namespace:DiggSample"> Windows Store App <UserControl x:Class="DiggSample.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:Digg="using:DiggSample">
11. #3: XML Namespaces Silverlight xmlns:ad="clr- namespace:Microsoft.Advertising.Mobile.UI;assembly=Mi crosoft.Advertising.Mobile.UI" Windows Store App xmlns:ad="using:Microsoft.Advertising.WinRT.UI"
12. #3: Code Namespaces (continued…) The majority of changes occur in the UI related classes. System.Windows -> Windows.UI.Xaml
13. #3: Code Namespaces cont. Silverlight using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Imaging; using System.Windows.Navigation; using System.Windows.Shapes; Windows Store using Windows.UI.Xaml; using Windows.UI.Xaml.Controls; using Windows.UI.Xaml.Data; using Windows.UI.Xaml.Documents; using Windows.UI.Xaml.Input; using Windows.UI.Xaml.Media; using Windows.UI.Xaml.Media.Imaging; using Windows.UI.Xaml.Navigation; using Windows.UI.Xaml.Shapes;
14. SL5 vs WinRT Comparison by NS http://bit.ly/I4eWTt
15. SL5 #3: Code Namespaces (cont.) WinRT
16. #4: Making WebRequest • WebClient has been removed from WinRT. Instead, you can now use HttpClient or WinJS.xhr. • WebRequest makes use of async, await and Tasks<T>. • Callbacks such as IAsyncResult will need to be re-written.
17. Asynchronous Demystified async avoids the bottleneck of your application being executed line by line. • our program can continue to execute. • The "async" keyword enables the "await" keyword in that method. await operator is applied to a task to suspend execution of the method until the task is complete. Tasks<T> represents an asynchronous operation that can return a value.
18. DEMO WebClient and HttpClient
19. #5: Storage
20. File I/O Silverlight • IsolatedStorage – Can do anything. • Read/Write a file to Documents Folder, etc. via Open/SaveFileDialog or by using Elevated Trust (SL4). • Read/Write a file to the local HDD possible via Open/SaveFileDialog or Full Trust (SL5) will not require user intervention. Windows Store • IsolatedStorage – Can do anything. • Read/Write a file to Documents folder, etc. if you indicate it in the application manifest or use File and Folder Picker API. • Read/Write a file to the local HDD possible via FilePicker only!
21. DEMO Reading and Writing Files
22. #6: Navigation
23. Silverlight <navigation:Frame x:Name="ContentFrame" Style="{StaticResource ContentFrameStyle}" Source="/Home" Navigated="ContentFrame_Navigated" NavigationFailed="ContentFrame_NavigationFailed"> <navigation:Frame.UriMapper> <uriMapper:UriMapper> <uriMapper:UriMapping Uri="" MappedUri="/Views/Home.xaml"/> <uriMapper:UriMapping Uri="/{pageName}" MappedUri="/Views/{pageName}.xaml"/> </uriMapper:UriMapper> </navigation:Frame.UriMapper> </navigation:Frame> this.NavigationService.Navigate(new Uri("/Page1.xaml", UriKind.Relative));
24. Windows Store Apps private void HyperlinkButton_Click_1(object sender, RoutedEventArgs e) { this.Frame.Navigate(typeof(BasicPage2)); } <HyperlinkButton Content="Click to go to page 2" Click="HyperlinkButton_Click_1"/>
25. #7: Controls
26. Silverlight Controls - MIA Calendar ChildWindow DataGrid DataPager DescriptionViewer MultiScaleImage OpenFileDialog RichTextBox SaveFileDialog TabControl TabItem TreeView Validation WebBrowser
27. Wall of Controls Progress Ring GridView FlipView Semantic Zoom ListView Web View
28. DEMO Controls
29. #8: Animations
30. Silverlight Animations Animation Easing allows you to apply built in animation functions to your Silverlight controls. The result is a variety of animation effects that make your controls move in a more realistic way.
31. Windows Store Animations Animation Library – FREE! http://bit.ly/IO3oVR • Theme Transitions – animate loading, unloading or changing location on the screen. • Theme Animations – build to run on user interaction and you must trigger them. You can create custom animations as well.
32. DEMO Animations
33. #9: Freebies
34. Charms Charms are a way of preparing Windows 8 for an ultimate integration with natural user interface (NUI) technology, which allows you to have everything at your fingertips without going through a whole lot of effort.
35. Contracts • Windows Store apps use contracts and extensions to declare the interactions that they support with other apps and with Windows. • Search contracts opens up your application to intregrate with Windows search. • Share contract allows your app to share content with other apps. • Many others exist and can be found at http://bit.ly/K7hd2B.
36. #10: Monetizing
37. Windows Store Sell your application in the Windows Store. • Designed for Discovery. • Reach – Global (231 markets) • Enterprise • Flexible business model (free, paid or trial) • Microsoft AD SDK available.
38. Windows Store • Registration Fee is $49 USD ($99 for Companies) • Share up to 80% of the revenue generated from app sales.
39. Recap 1. Starting with the Fundamentals – A,B,C’s 2. Application Lifecycle 3. XML/Code Namespaces 4. Making WebRequest - Async 5. Storage – Files and Isolated Storage 6. Navigation – No more URI 7. Controls – New ones Added 8. Animations – Baked into WinRT 9. Freebies – Charms (Searching and Sharing) 10.Monetizing – With the Microsoft Store
40. Resources • Main starting point: http://dev.windows.com/ • Silverlight 5 vs.WinRT comparison by namespace - http://bit.ly/I4eWTt • See my article in Visual Studio Magazine where I ported a SL2 app to a Windows Store App. http://bit.ly/x2YEI4 • Telerik RadControls for Windows Store Apps – http://www.telerik.com
41. Thank you! Michael Crump | Telerik • @mbcrump • http://michaelcrump.net • http://blogs.telerik.com/michaelcrump • http://linkedin.com/in/mbcrump