Silverlight for Windows Phone

.Silverlight for Windows Phone

Silverlight, Fair Use

Silverlight for Windows Phone

"Silverlight for Windows Phone is a specific version of Silverlight for developing applications that run on Windows Phone. The WP version contains additional support for touch input, and does not contain support for the HTML DOM bridge."

  • Microsoft Silverlight is a .NET-based framework for building applications that can run on the desktop, as a browser plugin, or on a Windows Phone. Silverlight for Windows Phone is a specific version of Silverlight for developing applications that run on Windows Phone. The Windows Phone version contains additional support for touch input, and does not contain support for the HTML DOM bridge.
    • Silverlight started as a browser plugin (like Adobe Flash), but then gained support for desktop applications (aka out-of-browser applications). Silverlight's most recent usage is in the development of Windows Phone Applications. As such the trend now is to use the term "XAML based applications" instead of Silverlight.

    • Additional Silverlight tools are in the "Silverlight Toolkit" (aka "Windows Phone Toolkit") available from Microsoft's open source website (Codeplex). The Toolkit is on a shorter release cycle than the SDKs. Datepicker and other advanced controls are only in the Toolkit.

    • The main usage of Silverlight is to produce User Interfaces (in XAML) as a separate component of the application; keeping the UI separate from the application logic. XAML is a Microsoft variant of XML. XAML elements always represent .NET elements. So anything you can do in XAML, you can also code in C# or VB.

    • In Silverlight UIs, the XAML and the code-behind file (eg. C#) are tightly-coupled. Each is defined as a partial class and one can not exist without the other.

    • There are a few XAML files that do no contain UI code, such as App.xaml, which is used to host the application-level style resources and the applications lifecycle events.

    • The Silverlight manifest file (AppManifest.xaml) describes your application to the Silverlight runtime engine, and other resources (images, etc). The manifest file is automatically generated and rarely needs to be edited by hand

Silverlight Controls

"Many Silverlight for Windows Phone controls have been modified from the standard PC version to support the Windows Phone touch interface. These controls have been made larger, and their margins larger, to accommodate the user's touch. They also support the touch events."

  • The Windows Phone controls are in the class library Microsoft.Phone.Controls or the The Windows Phone Toolkit.

  • Every UI element in Silverlight has the ability to be visible or hidden by use of the Visibility property which has the values:
    • Visible - (default) is visible.
    • Collapsed - is hidden, will not take up any space on page.
  • There are three ways to specify the size of controls:
    • Absolute - specify the size in a fixed number of pixels. Absolute sizing takes precedence over the other two sizing options and is always the first one to be calculated. An absolute size will impose a constrained view of the control (will not automatically resize).
    • * - star sizing, distribute the available space equally based on amount of available space (eg. *, 2*, 3*) The numbers are used to specify a ratio for dividing the available space.
    • AUTO - makes the size just big enough to hold contents. If there is no contents, the size is zero.


User Controls

"The WebBrowser control for Windows Phone OS 7.1 is based on Internet Explorer 9, while the WebBrowser control for Windows Phone 8.0 is based on Internet Explorer 10. Because of this, slight differences in appearance may exist in the WebBrowser's rendering between Windows Phone 7.5 and Windows Phone 8.0."

  • User Controls for Windows Phone
    1. TextBlock - display (only) of text. A lightweight control for small amounts of text.
    2. TextBox - text input (single line or multi-line).
    3. ListBox - contains an open list of selectable items (Properties: SelectedIndex, Selected Item. Events: SectionChanged).
    4. Image - control displays an image in PNG or JPEG format.
    5. Map - The Windows Phone version of the Bing Maps Silverlight Control is still supported but it is deprecated and should only be kept for an existing app that you have upgraded from Windows Phone OS 7.1 to Windows Phone 8.0. To add Bing Maps to a Windows Phone 7 or Windows Phone 8, you can use Bing Maps AJAX Control, Version 7.0 or the the Windows Phone 8 Maps API. The Windows Phone 8 Maps API does not use Bing Maps.
    6. WebBrowser - The WebBrowser control for Windows Phone OS 7.1 is based on Internet Explorer 9, while the WebBrowser control for Windows Phone 8.0 is based on Internet Explorer 10. Because of this, slight differences in appearance may exist in the WebBrowser's rendering between Windows Phone 7.5 and Windows Phone 8.0.
    7. ProgressBar - A ProgressBar control shows the progress of an operation that has a known duration, or shows that an indeterminate operation is in progress.
    8. MediaElement - a rectangular control that can contain audio and video as its content. See list of supported media formats. Note: Closed Captioning (subtitles) is supported thru the use of the TimeLineMarker object. (Properties: AutoPlay, CanPause, CanSeek, CurrentState, Duration, IsMuted, Volume, Balance, AudioStreamCount, AudioStreamIndex) Note: HTML5 VIDEO and AUDIO tags are now supported in all browsers and is an alternative to the Silverlight controls.
    9. ScrollViewer - creates a scrollable area that can contain other visible elements (text, images, etc.).

    10. ScrollViewer with Image and Text
      Get Microsoft Silverlight
    11. Buttons
      • All buttons have three states that can be used to animate the buttons look. For example when you hover over a button its color changes to blue. The three states are:
        • normal
        • hover
        • pressed
      • The ClickMode property sets when the theClick event should occur:
        • Hover - The Click event occurs every time you hover over the button.
        • Press - The Click event occurs as soon as you click on the button.
        • Release - (default mode) The Click event occurs as soon as the mouse button is released.
      • Button types:
        • Button - represents a Windows button control, which reacts to the ButtonBase.Click event.
        • CheckBox - represents a control that a user can select and clear.
        • RadioButton - represents a Button that can be selected, but not cleared, by a user
        • HyperlinkButton - a button control that displays a hyperlink
        • ToggleButton - base class for controls that can switch states, such as CheckBox and RadioButton
      Buttons Example (Click on Them)
      Get Microsoft Silverlight
    12. Custom Controls
      • A custom control is essentially a combination of existing controls that can be reused throughout the application. To create a customer control:
        1. Right-click on project, Add, New-Item, "Silverlight User Control Template".
        2. Change the design height and width to actual specs (d:DesignHeight="300" => Height="300").
        3. Create a StackPanel with the desired combination of controls inside.
        4. Code the events for the individual controls.
        5. In the page you want to use the control, add a reference to the user control namespace
          xmlns:local="clr-namespace:MyUserControl"
        6. Go to the control insert point and start typing the alias (<local:) and intellisense should have picked up the namespace with the control.

Listbox Photo Viewer Custom Control

,Custom Control - Lixtbox Photo Viewer

Lixtbox Photo Viewer, Own Work

  1. Also available in the Windows Phone Toolkit are:
    • ListPicker.
    • DatePicker
    • TimePicker
    • ContextMenu
    • AutoCompleteBox
    • ToggleSwitch
    • WrapPanel.

.DirectX

DirectX, Fair Use

Silverlight, XNA, DirectX, and HTML5

"Microsoft is migrating from XNA to DirectX in Windows Phone OS 8.0.  XNA apps can only be built and compiled up through Windows Phone OS 7.1."

  • Silverlight for Windows Phone is used for creating data-driven or event-driven applications.
  • XNA and DirectX frameworks are used for graphical game development. XNA uses a game loop and obtains user input by polling (as opposed to being event-driven). The XNA game loop uses only two methods: Update and Draw.
  • You can reliably use some HTML5 features (audio, video, geolocation, and canvas graphics) in the Windows Phone WebBrowser control. Media that uses HTML5 audio and video play back more efficiently and smoothly than media played through a browser plug-in (Silverlight, Flash), and helps to conserve battery power.


Reference Articles