Presentation is loading. Please wait.

Presentation is loading. Please wait.

10 Things a Silverlight Developer Should Know When Building A Metro Application SILVERLIGHTSHOW.NET WEBINARS SERIES Michael Crump, July 3 rd, 2012

Similar presentations

Presentation on theme: "10 Things a Silverlight Developer Should Know When Building A Metro Application SILVERLIGHTSHOW.NET WEBINARS SERIES Michael Crump, July 3 rd, 2012"— Presentation transcript:

1 10 Things a Silverlight Developer Should Know When Building A Metro Application SILVERLIGHTSHOW.NET WEBINARS SERIES Michael Crump, July 3 rd, 2012

2 You can win! Complete the post-webinar survey! Three of you will get a free ebook of choice from SilverlightShow Ebook Shelf! Tweet this webinar using #webinarsilverlightshow tag. Two of you will get an ebook from Packt Publishing, choosing between: Microsoft Silverlight 5 Data and Services Cookbook OR MVVM Survival Guide for Enterprise Architectures in Silverlight and WPF

3 Michael Crump Microsoft MVP, MCPD Telerik ( Web: Introduction

4 Patience my friend – Install Windows 8 you will. Wise would be to install inside a VM.

5 10 Things Intro Q/A

6 Now What? So, youre a Silverlight Developer

7 #1 : Starting with the Fundamentals

8 Silverlight Hosted inside a web browser via plug- in. Silverlight Applications can run in Windows 8 in Desktop Mode only. You can use C#/VB and XAML to develop applications. XNA – (partial) Available in SL5. Uses.NET Framework Can use any version of Visual Studio to develop for it. Built primary for mouse/keyboard input. (Chrome) Metro Runs on top of WinRT inside Windows 8. Metro Applications can only run in Windows 8. You can use C#/VB/C++/XAML or HTML/JS XNA not available in WinRT, but can use DirectX. Uses.NET Framework 4.5 Can only develop for it using VS11 and Windows 8. Built primary for touch input. (No Chrome)

9 #2 : Application Lifecycle

10 User Request Webpage HTML Page tag loads plug-in Plug-in download s XAP file and reads manifest Create instance of Applicatio n Class Fire Applicatio n Start up Event Completed page rendering. Silverlight

11 Metro Running App suspending Code gets to run resuming User Launches App Splash screen

12 You only declare the namespace (never the assembly) and you should use "using" instead of "clr-namespace" #3 : XML Namespaces

13 Silverlight Metro

14 Silverlight xmlns:ad="clr- namespace:Microsoft.Advertising.Mobile.UI;assembly=Microsoft. Advertising.Mobile.UI" Metro xmlns:ad="using:Microsoft.Advertising.WinRT.UI"

15 The majority of changes occur in the UI related classes. System.Windows -> Windows.UI.Xaml #3 : Code Namespaces (cont…)

16 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; Metro 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;

17 Silverlight 5 vs. WinRT comparison by namespace



20 WebClient has been removed from WinRT. Instead, you can now use HttpClient. WebRequest makes use of async, await and Tasks. Callbacks such as IAsyncResult will need to be re-written. #4 : Making WebRequest

21 async avoids the bottleneck of your application being executed line by line. o Your program can continue to execute. o 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 represents an asynchronous operation that can return a value. Asynchronous Programming

22 Silverlight void SearchBtn_Click(object sender, RoutedEventArgs e) { string topic = txtSearchTopic.Text; string diggUrl = String.Format("{0}?count=20&", topic); // Initiate Async Network call to Digg WebClient diggService = new WebClient(); diggService.DownloadStringCompleted += new DownloadStringCompletedEventHandler(DiggService_DownloadStoriesComp leted); diggService.DownloadStringAsync(new Uri(diggUrl)); } void DiggService_DownloadStoriesCompleted(object sender, DownloadStringCompletedEventArgs e) { if (e.Error == null) { // Call another Method DisplayStories(e.Result); }

23 Metro public async void SearchBtn_Click(object sender, RoutedEventArgs e) { // Retrieve Topic to Search for from WaterMarkTextBox string topic = txtSearchTopic.Text; // Construct Digg REST URL string diggUrl = String.Format("{0}&ap pkey=", topic); // Initiate Async Network call to Digg var client = new HttpClient(); var response = new HttpResponseMessage(); //Get response response = await client.GetAsync(new Uri(diggUrl)); Task responseString = response.Content.ReadAsStringAsync(); string result = await responseString; DisplayStories(result); }

24 WebClient & HttpClient Demo

25 Files and Isolated Storage #5 : Storage

26 File I/O Silverlight IsolatedStorage – Can do anything. Read/Write a file to Documents Folder via Open/Save Dialogs or by using Elevated Trust (SL4) Read/Write a file to C:\Temp possible via FilePickers or Full Trust (SL5) will not require user intervention. Metro IsolatedStorage – Can do anything. Read/Write a file to Documents Folder via FilePickers only if set in Application Manifest. Read/Write a file to C:\Temp possible via FilePickers only!

27 Files Demo

28 Rethink URI… #6 : Navigation

29 Silverlight this.NavigationService.Navigate(new Uri("/Page1.xaml", UriKind.Relative));

31 Some added and some missing from Metro. #7 : Controls

32 Calendar, ChildWindow, DataGrid, DataPager, DatePicker, DescriptionViewer, MultiScaleImage, OpenFileDialog, RichTextBox, SaveFileDialog, TabControl, TabItem, TreeView, Validation, WebBrowser Silverlight Controls - MIA

33 Progress Ring GridView FlipView Semantic Zoom ListView

34 ListView – Displays a collection as a stack of items. (Think Snapped Application) GridView – Grid-Based Layouts and grouping of items. Semantic zoom (Old Name JumpViewer) – Zoom in or out on a collection. FlipView – Items Control that displays one item at a time. Media Player – Now with built-in playback buttons. Progress Ring – Simple Progress Indicator with a circular motion. Application Bar, CarouselPanel, RichTextBlock and WrapGrid. New XAML Controls

35 Controls Demo

36 Animations are a key component of the Metro Style Personality. #8 : Animations

37 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. Silverlight Animations

38 Independent animation - is an animation that runs independently from thread running the core UI logic. Dependent animations run on the UI Thread. Must turn on by using AllowDependentAnimation to True. Animation Library – FREE! 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. Metro Animations

39 Animation – created by Colin Eberhardt Transitions-Creating-Fast-and-Fluid-Metro-UI Demo

40 Searching and Sharing… #9 : Freebies

41 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. Charms

42 Metro style 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 Contracts

43 Because who doesnt want to make money. #10 : Monetizing

44 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 out now. Windows Store

45 Registration Fee is $49 USD ($99 for Companies) Share up to 80% of the revenue generated from app sales. Windows Store (cont…)

46 1.Starting with the Fundamentals 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 Recap

47 Main starting point: – Metro style app reference and APIs – Sample Apps, Windows Store, Forums – Windows 8 OS – Release Preview Stage VS2012 RC : DP > BETA > RC > RTM.NET Framework 4.5 See my article in Visual Studio Magazine where I ported a SL2 app to Metro. The Bits

48 Q&A Web: Telerik is creating Windows 8 Controls and more info can be found at:

Download ppt "10 Things a Silverlight Developer Should Know When Building A Metro Application SILVERLIGHTSHOW.NET WEBINARS SERIES Michael Crump, July 3 rd, 2012"

Similar presentations

Ads by Google