Home > Windows Phone 7 > Silverlight for Windows Phone Toolkit November 2010 release

Silverlight for Windows Phone Toolkit November 2010 release

November 10, 2010 Leave a comment Go to comments

Download

The default install directory: C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v7.0\Toolkit

  • New Components
    • AutoCompleteBox
    • ListPicker
    • LongListSelector
    • Page Transitions
  • Existing Components
    • GestureService/GestureListener
    • ContextMenu
    • DatePicker
    • TimePicker
    • ToggleSwitch
    • WrapPanel
  • What’s New?

    ListPicker

    ListPicker sample ListPicker popup sample

    <toolkit:ListPicker Header="background">
        <sys:String>dark</sys:String>
        <sys:String>light</sys:String>
        <sys:String>dazzle</sys:String>
    </toolkit:ListPicker>

    ListPicker is the Windows Phone 7 equivalent of the ComboBox control: give it a list of items and it will show the selected one and also allow the user to pick from a list if they want to change it. The core applications on Windows Phone 7 implement two kinds of list selection: an in-place expander for picking among five or fewer items, and a full-screen popup for picking among more. The Toolkit’s ListPicker control combines both experiences into one handy package byautomatically selecting the right UX based on the number of items in its list! It is a standard ItemsControl subclass with all the common elements of a Selector, so the API will be familiar to just about everyone. In fact, you can take most existing ListBoxes and convert them to ListPickers just by changing the control name in XAML!

    LongListSelector

    LongListSelector movies sample LongListSelector people sample LongListSelector jump-list sample

    <toolkit:LongListSelector
        ItemsSource="{StaticResource movies}"
        ListHeaderTemplate="{StaticResource movieListHeader}"
        GroupHeaderTemplate="{StaticResource movieGroupHeader}"
        GroupFooterTemplate="{StaticResource movieGroupFooter}"
        GroupItemTemplate="{StaticResource groupItemHeader}"
        ItemTemplate="{StaticResource movieItemTemplate}">
    </toolkit:LongListSelector>

    While ListPicker is about simple selection scenarios, LongListSelector is about advanced ones! Think of it asListBox++–, it has everything you expect from ListBox plus a bunch of advanced capabilities and great on-device performance minus the levels of abstraction and generality that tend to slow ListBox down. LongListSelectorsupports full data and UI virtualization, flat lists, grouped lists (with headers!), and also implements the “jump list” header navigation UI that makes the “People” app so efficient! The theory behind LongListSelector is that it should be easy to fix a poorly-performing ListBox scenario by swapping in a LongListSelector instead: it handles all the tricky parts foryou, so there’s less to worry about and it “just works”. Unless you’ve spent a lot of time fine-tuning your application’s list behavior, you should see improved performance by switching to LongListSelector!

    TransitionFrame (and Transitions)

    TransitionFrame sample

    RootFrame = new TransitionFrame();
    <toolkit:TransitionService.NavigationInTransition>
        <toolkit:NavigationInTransition>
            <toolkit:NavigationInTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardIn"/>
            </toolkit:NavigationInTransition.Backward>
            <toolkit:NavigationInTransition.Forward>
                <toolkit:TurnstileTransition Mode="ForwardIn"/>
            </toolkit:NavigationInTransition.Forward>
        </toolkit:NavigationInTransition>
    </toolkit:TransitionService.NavigationInTransition>
    <toolkit:TransitionService.NavigationOutTransition>
        <toolkit:NavigationOutTransition>
            <toolkit:NavigationOutTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardOut"/>
            </toolkit:NavigationOutTransition.Backward>
            <toolkit:NavigationOutTransition.Forward>
                <toolkit:TurnstileTransition Mode="ForwardOut"/>
            </toolkit:NavigationOutTransition.Forward>
        </toolkit:NavigationOutTransition>
    </toolkit:TransitionService.NavigationOutTransition>

    The Windows Phone UI Guidelines encourage smooth, attractive page-to-page animations like the core applications show, but there has been little platform support for creating similar experiences in your own applications – until now! 🙂 The new transition classes in the Windows Phone Toolkit aims to make it easy for application developers to add attractive, platform-consistent transitions to their applications. All that’s necessary to enable transitions for an application’s pages is tweak App.xaml.cs (shown above) and add a bit of XAML to each page to specify its transitions (also shown above). Everything else is done for you!

    Aside: This release includes support for multiple flavors of the following transitions: turnstile, slide, rotate, swivel, and roll. It’s also possible to implement custom transitions using the same framework!

    AutoCompleteBox

    AutoCompleteBox sample

    <toolkit:AutoCompleteBox
        ItemsSource="{StaticResource words}"/>

    AutoCompleteBox first appeared in the Silverlight 2 Toolkit, then later graduated to the Silverlight 3 SDK. Now it’s back in the Toolkit – this time for Windows Phone 7! Because phones are about being small and quick to use, simplifying tedious tasks like text input is an important goal. Toward that end, a number of the core applications (like Bing search) make use of auto-completion to predict what the user is typing and save time by allowing them to click on the completed word instead. AutoCompleteBox makes it easy to bring the same convenience to your own applications by taking advantage of a phone-friendly implementation of this popular Silverlight control. By providing a suitable completion list (in any of a variety of ways), users are automatically prompted with the relevant matches as they start typing!

    API Documentation

    CHM file example

    The source code for the Windows Phone Toolkit has included full XML Documentation Comments from the beginning, but now we’ve begun generating a separate CHM file with all the property/method/event comments in a single, easy-to-browse location. The documentation file is automatically installed by the Windows Phone Toolkit installer and a handy link is added to the “Silverlight for Windows Phone Toolkit” folder in the Start Menu. Because we don’t have dedicated documentation writers on the Toolkit team, our documentation is a bit on the terse side – but the CHM file is still a great way to survey the Toolkit classes and get a feel for what’s available. And because the sample syntax is available in bothC# and VB, everyone should be comfortable with the examples!

Categories: Windows Phone 7 Tags: , ,
  1. alek
    January 20, 2011 at 9:58 am

    Can anyone get the transition to work. I have seen many ‘supposed’ examples of how to do it. All say the same thing and none work.

    The tag ‘TurnstileTransition’ does not exist in XML namespace ‘clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit’.

  1. November 14, 2010 at 12:30 am
  2. January 3, 2011 at 11:27 am

Leave a comment