Mo controls, mo controls, mo controls… [Announcing the second release of the Silverlight for Windows Phone Toolkit!]


This blog has moved to a new location and comments have been disabled.

All old posts, new posts, and comments can be found on The blog of dlaa.me.

See you there!

Comments (56)
  1. Matt Hidinger says:

    Awesome! Trying them out now, I'll be sure to let you guys know if I have any feedback

  2. Allen Newton says:

    Oh so sweet!  I'll be using those for my app already in development.  Thanks WP7 team!

  3. Jay says:

    Thanks for this, it's great! However, I'm having trouble with the LongListSelector. I have a collection IEnumerable<Person> and try to set it as the ItemsSource like this:

    LongSelector.ItemsSource  = PersonCollection

    but an InvalidCast Exception is thrown. What am I doing wrong?

    Thanks

  4. Delay says:

    Jay,

    It sounds like you didn't set LongListSelector.IsFlatList=True (without which, it assumes it's getting a list of lists). The error could be better here; I'll pass this feedback on. Thanks!

  5. Rod says:

    Thanks for the update – I can't get TransitionFrame to work though – when I ref the new toolkit dll I can see it in the ObjectBrowser under MS.Phone.Controls, but when I try to actual use it in code it has no idea what I am talking about! Very odd…. I have tried Clean etc. but I just can't get TransitionFrames to work…

  6. Jay says:

    Thanks Delay, that was the problem. Working smoothly now!

  7. Pebo says:

    Hello, Delay. I find a bug in ListPicker.

    everything works fine when I change a listbox to a ListPicker, except I can't get my picture shown in the selection page correctly.

    I did a few test and find out that if the picture was shown in the application in other page, it can be shown in the ListPicker.

    But to the others which never shown in application, ListPicker just failed.

    any ideas?

  8. Sébastien P says:

    The TransitionService performances are just AWFUL …

  9. Delay says:

    Rod,

    Could you be missing a "using Microsoft.Phone.Controls;" in your App.xaml.cs? If that's not the case, please have another look at the sample project with an eye towards what might be different about your project.

    Hope this helps!

  10. Delay says:

    Pebo,

    Offhand, I'm not sure why you'd be seeing that kind of behavior or what ListPicker might be doing to cause it. If you'd like to create a small, simplified demonstration of the problem and send it to me in email (use the "Email the author" link on this blog), I could have a look to see what might be going on.

    Thanks for your help!

  11. Delay says:

    Sébastien P,

    It's been our experience that very complicated pages/applications can experience slow transition performance, but that the animation we've provided work well in a lot of common situations/configurations. If you'd like to share a simple, self-contained demonstration of the performance issue you're seeing, I'd be happy to pass it on for investigation. Alternatively, one of the nice things about sharing the transitions is that we've published the XAML for them – you're welcome to use that XAML outside of the TransitionFrame infrastructure if doing so enables you to achieve better performance.

    Hope this helps!

  12. Fabian says:

    Could it be possible that longlistselector has some issues when you try to stop it scrolling? Tapping on it while its scrolling  takes ~200ms to stop? Is that a normal behaviour?

  13. Delay says:

    Fabian,

    I checked with Dave Relyea (blogs.msdn.com/…/devdave), author of LongListSelector, and he tells me the current behavior is deliberate because it takes the control a little time to determine what the user is doing when they touch the screen. For example, if they're touching the screen to do another flick for more scrolling, then stopping the ongoing scroll immediately would result in a jarring experience.

    Hope this helps!

  14. Ben says:

    Thank you!  Thank you!  Thank you!  This helps me out tremendously!

  15. Russ says:

    WP7 is dead. No new developers will support this platform since Muglia has basically killed Silverlight.

  16. PunctuationCop says:

    21 exclamation marks in one article – that must be a record!!!!!!!!!!!!!!!!!!!!!

  17. Delay says:

    Ben,

    Glad we could help. :)

  18. Delay says:

    Russ,

    Your statement may be a bit of an exaggeration. :) Here are some clarifications of Bob Muglia's comments: team.silverlight.net/…/pdc-and-silverlight And even the original articles on this topic were clear that Silverlight was fundamental for Windows Phone 7 (whether or not you think it HTML5 will take over).

    Hope this helps!

  19. Delay says:

    PunctuationCop,

    Thanks. ;) Ya know, you and the guy who dinged me for bolding a lot of text should probably get together and hang out some time: blogs.msdn.com/…/pining-for-windows-phone-7-controls-we-got-ya-covered-announcing-the-first-release-of-the-silverlight-for-windows-phone-toolkit.aspx

  20. Grgeory says:

    How I can set foreground color (text color) for ContextMenu? Tag Foreground doesn't work…

    And how I can  header text color for ListPicker?

    thx

  21. Vinod says:

    Thanks for a great release with a lot of new useful controls. I have a question though.

    I'm using the LongListSelector control to replace an existing Listbox. I've set the IsFlat=True and everything works fine. I would however like to use grouping as well to provide a quick way to jump to different parts of the list.

    The structure that the list is bound to has a Month and Year property and I'd like to group on Year (since the list will span many, many years normally). Is there a quick way to do this?

  22. Adam says:

    After a few hours of prodding, I finally got LongListSelector working in my app.  One issue I'm having though and can't seem to solve…  I'm using a categorized list with the jump list bound to a ModelView surfacing NotifyPropertyChanged.  I have a filter/search feature where the user can filter the list based on a string.  Whenever I trigger this, the list items don't update.  I know it's at least partially updating since the jump list actually does only show the applicable categories for the new dataset, it's just the actual list that's getting the new items.  What's the best way of triggering the main list to re-bind?  I tried resetting the ItemSource to the data source but that doesn't help.

  23. transitions not working on most pages.. says:

    Hi

    I have altered my app.cs as well as added the xaml code you have listed above in most of my pages, however the transition only seems to work when i navigate back to my main page navigating to another page i do not see my main page annimate nor the new page, when i navigate back to my main page the main page is the only one that annimates not the previous page.. (by the way the page i am navigating to is a panoramic page and the main page is a panoramic page as well not sure if this makes any difference)

  24. Delay says:

    Grgeory,

    Please set the Foreground property of the MenuItems instead. If you don't have explicit MenuItem instances (perhaps because you're using ContextMenu.ItemsSource), you can do this by providing a Style/TargetType=MenuItem for the ContextMenu.ItemContainerStyle property.

  25. Delay says:

    Vinod,

    LINQ makes shaping your data very easy. Here's an overview that should help get you started: msdn.microsoft.com/…/bb308959.aspx

  26. Delay says:

    Adam,

    Would you mind creating an issue on the CodePlex site for the problem you're having? If you're able to provide an explicit set of steps (or a sample project) demonstrating the problem, that would be super.

    Regarding your attempted workaround by re-setting ItemsSource to your model, remember that Silverlight and WPF only detect property *changes*. To make your trick work, try setting ItemsSource to null, *then* setting it back to your data source. :)

  27. Delay says:

    transitions not working on most pages..,

    I've not heard of this problem before. You might consider adding a similar page to the samples project to see if the presence of Panorama is the problem. Based on what I know of how TransitionFrame works, I wouldn't expect this to be an issue – but if you're able to demonstrate that a working set of transitions suddenly stops when Panorama is introduced, that would be good to know – and we'd want to get an issue opened on the CodePlex site to track it.

    Thanks for your help!

  28. transitions not working on most pages says:

    yes i tried a new project and it works fine. not sure why i am havving a problem i do have onnavigatedtoevent set for some code i run to update things on the screen. can i send you what a couple of my xaml looks like?

  29. Delay says:

    transitions not working on most pages,

    Sure – if you send a small, self-contained sample, I'll pass it on to the right guy for investigation. Contact me via the email link at the top-right and then we can go from there. :)

  30. Fabian says:

    Ist there a way to enable Tilt Effect on the new controls? and is it possible to bind a observable collection on the longlist? I tried a few hours for now… without succes

  31. Delay says:

    Fabian,

    Here's the official documentation on adding the tilt effect to Windows Phone 7 controls: msdn.microsoft.com/…/ff941094

    I believe that binding an ObservableCollection to the LongListSelector should work – if you want to send a simple, self-contained sample of your issue, I can pass it on for investigation.

    Hope this helps!

  32. Jay says:

    @Fabian – Ironically, I can't suppress the Tilt effect on my AutoCompleteBox. I tried setting 'suppress to True' but it doesn't seem to have any effect.

    @Delay – The autocomplete box works fine, but I've got a list of 30+ items and only one of them begins with the letter 'A'. When I type 'A' in the textbox, a white menu appears, but it's blank. Sometimes, I can drag the box down and the word appears at the top (but not selectable because when you move your mouse to select it, the box scrolls back down). Other times, the box is blank but it only appears when there are potential words in the list, so I'm guessing it's just a case of the suggested text not being visible. I could use IsTextCompletionEnabled but is there a way to stop the blank box from showing at all?

    Thanks for the great tools + support

  33. gaurav says:

    Transition Frame is just useless, if you have any work being done in page constructor or page loaded event, the animation doesn't even shows…, forget about the smoothness

  34. Delay says:

    Jay,

    When you talk about things responding to mouse movement, I start to think you're not talking about a Windows Phone 7 application. Would you mind clarifying that? And if you're able to create a simple, self-contained sample of the problem to share, that would be tremendously helpful.

    Thanks!

  35. Delay says:

    gaurav,

    It's generally best to try to avoid doing a lot in a page's constructor (even if it's not using the Toolkit's transitions) because that work can cause delays that impact the users. The current recommendation (as I understand it) is to defer as much as possible and then "trickle in" the updates once the page has had a chance to get some of its UI on the screen (ex: by waiting to set the page's DataContext). Even if the UI isn't fully populated/updated when it first shows up, simply getting something on the screen quickly can help the application feel more responsive.

  36. Jay says:

    Hi Delay,

    Sorry, I should've been clearer.  By mouse movement, I meant the emulator and the cursor. However, I've now got a device, so I will mess around and see if it's the same on the device. If not, I'll try and get a small demo up.

  37. Bernhard says:

    Great, very much needed controls! Only thing i miss is that the Listpicker in "fullscreen mode" does the same animations on its items as the native listpicker does, you know this "turning" animation of each indivudual item. I think it should not be too hard to add that animation by myself, but maybe you can consider this feature for future releases :)

  38. Delay says:

    Bernhard,

    Thanks for the feedback! The animations aren't in place in the current release mainly to keep things a bit simpler (i.e., fewer moving parts). It's my hope that the new Transitions framework can be used to implement them fairly easily in the next release of the Toolkit. As you suggest, folks who need to can add them manually for now – and blog their solution if so inclined! ;)

  39. Hosain says:

    Is there a Completed event for each transition? I would like to let the transition finish then execute code after entering a page.

    Thanks

  40. Arktronic says:

    I find that the transitions, while working fine in the emulator, have issues on real hardware. Even the Toolkit's own sample project, when deployed, does not show the ForwardOut animation from the main page. Although, for whatever reason, ForwardOut works just fine when clicking "Turnstile navigation transitions". I should also mention that the *In transitions seem to work fine.

    So far, the only page transition code I've seen out there that works (near) perfectly on both the emulator and physical devices is the Page Transitions Sample from Clarity Consulting.

  41. Delay says:

    Hosain,

    There's a Completed event on the ITransition interface that should be helpful here if you're able to get at it – via TransitionService.GetNavigationInTransition(myPage).Forward.GetTransition(myPage) in the Page's constructor, I'd assume. Alternatively, you might be able to use the existing (On)NavigatedFrom/To events/overrides on Frame/Page to know when to run the code you want.

    Hope this helps!

  42. Delay says:

    Arktronic,

    The transitions are currently pretty sensitive to the complexity of the destination page; I see the ForwardOut of the main page in the public samples for some of the destinations (AutoCompleteBox, ContextMenu), but not as much for others (ToggleSwitch). The Toolkit transitions are intended to be platform-consistent and easy to use – and I fully expect them to improve in future releases. That said, if you're happy with a different solution, that's great and I don't think you should feel the need to switch away from it. :)

  43. woctaog says:

    Hey Delay,

    We are developing an app for a large Seattle company, and are seeing the same performance problems with transitions.  The Forward Out transitions almost never fire if the next page has any sort of complexity.  We are probably going to migrate to either Clarity Consulting's transitions or manually implement our own…  future releases of the toolkit are at least a month out I would imagine?

  44. Delay says:

    woctaog,

    Thanks very much for your feedback – I'll pass it on to the right folks internally to see if it'll be possible to improve things for the next release!

  45. Brian says:

    Hi Delay,

    I've just started messing around with the toolkit, and this could be just a problem on my machine but the animation easing on the page transitions seem to be utterly broken in the new release. I've been able to fix it on my machine by applying the EasingDoubleKeyFrame.EasingFunction to the second keyframe in the storyboards instead of the first and reducing the Exponent to 5.

    My code for TurnstileForwardIn.xaml here:

    <Storyboard

       xmlns="schemas.microsoft.com/…/presentation"

       xmlns:x="schemas.microsoft.com/…/xaml">

       <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)">

           <EasingDoubleKeyFrame KeyTime="0" Value="-80" />

           <EasingDoubleKeyFrame KeyTime="0:0:0.35" Value="0">

               <EasingDoubleKeyFrame.EasingFunction>

                   <ExponentialEase EasingMode="EaseOut" Exponent="5"/>

               </EasingDoubleKeyFrame.EasingFunction>

           </EasingDoubleKeyFrame>

       </DoubleAnimationUsingKeyFrames>

       <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)">

           <EasingDoubleKeyFrame KeyTime="0" Value="0"/>

           <EasingDoubleKeyFrame KeyTime="0:0:0.01" Value="1"/>

       </DoubleAnimationUsingKeyFrames>

       <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)">

           <DiscreteObjectKeyFrame KeyTime="0">

               <DiscreteObjectKeyFrame.Value>

                   <Visibility>Visible</Visibility>

               </DiscreteObjectKeyFrame.Value>

           </DiscreteObjectKeyFrame>

       </ObjectAnimationUsingKeyFrames>

    </Storyboard>

    An impressive release otherwise :]

    – Brian

  46. Delay says:

    Brian,

    Turnstile/ForwardIn seems to run pretty well for me on the public samples (it's actually the default transition after you hit the "Transitions" button on the main page). I'm not sure why you'd be seeing problems on your configuration, quite honestly – though I'm glad you've found a fix! :)

    If you don't mind, could you try the official sample application again? Perhaps the issue you're seeing has something to do with an aspect of your application? Is the problem present in the Emulator as well?

  47. Brian says:

    Hi Delay.

    Thanks for the quick reply. It's actually the public samples I'm using, I haven't tried them in any of my own applications yet. Compiling and running the public samples "out of the box0", I don't see the animation easing working at all in the emulator. Just to clarify, the animation is working "smoothly", but it's moving linearly and then coming to an abrupt stop at the end of the transition instead of easing to a stop like the transitions in the rest of the OS. If you try out my code you might see what i mean, or if you try out the code and you see no difference then I'll know there's a problem on my side ;].

    Thanks again!

  48. Karsten Januszewski says:

    Here's a downloadable code sample of the Page Transitions in action: rhizohm.net/…/Page-Transition-Animations-and-Windows-Phone-7.aspx  

  49. Delay says:

    Brian,

    Got it. I was looking for smoothness of animation, not the presence of an easing at the end. I agree with you, it does seem a tad abrupt and I suspect that the modifications you made will improve that. Thanks for pointing this out – I'll pass it on!

  50. Delay says:

    Karsten Januszewski,

    Great post – thanks a lot for putting this together! :D

  51. Damian says:

    Hi David,

    You mention that the LongListSelector supports data virtualization, but it seems to still enumerate the data items, rather than just getting the ones it needs for the current display – I've posted an entry on Codeplex (silverlight.codeplex.com/…/7670) , but I'd appreciate any insight you might have.

    Thanks,

       Damian

  52. Delay says:

    Damian,

    That's an interesting observation, thanks for pointing it out! I'm not intimately familiar with the LongListSelector, so I can't say whether this is necessary or just a convenience. I suspect you're right that the implementation could be changed in a future release to be more like ListBox's virtualization behavior. For now, please keep an eye on the CodePlex issue – Dave may comment there. :)

  53. jsp3536 says:

    My LongListSelector is showing a list of images pulled from a website.  Do I still need to used the LowProfileImageLoader in my ItemTemplate to handle this senario?  My understading is if I do not use your LowProfileImageLoader then the images will be downloaded on the UI thread and potentially lock it up while the images are downloaded.  Is this correct?

    Thanks,

    jsp3536

  54. Delay says:

    jsp3536,

    Your understanding sounds right to me (there are some technicalities we could discuss, but that's the gist). However, I'd recommend trying things out both with and without LowProfileImageLoader – every scenario/application is different, so the only *real* way to know what works best is to try it out. LowProfileImageLoader was originally intended to help with the ListBox scenario – LongListSelector is a fairly different animal, so results there may vary. When in doubt, measure, measure, measure! :)

  55. actionthomas says:

    Hi

    I figured out that my fill rate jumped from 0.2 without the TransitionFrame, to 1.2 with it.

    Is that a problem with my code, or is it the case for everyone as soon as a TransitionFrame is set ?

    Thanks !

  56. Delay says:

    actionthomas,

    I suspect that's a consequence of how TransitionFrame is implemented. You might check to see if the public sample application exhibits this same behavior – if so, then it's not because of a problem with your code. :)

    Hope this helps!

Comments are closed.