Entries:
Comments:
Posts:

Loading User Information from Channel 9

Something went wrong getting user information from Channel 9

Latest Achievement:

Loading User Information from MSDN

Something went wrong getting user information from MSDN

Visual Studio Achievements

Latest Achievement:

Loading Visual Studio Achievements

Something went wrong getting the Visual Studio Achievements

Silverlight TV 25: No More Boxes! Exploring the PathListBox

Download

Right click “Save as…”

In this video, Adam Kinney explains what the PathListBox is and why it is so compelling. Then, he demonstrates several ways of using it in creative examples. The PathListBox is one of the newest features available in Expression Blend, Silverlight 4 and WPF 4. It redefines how users look at lists of data as it breaks the mold of a list "box" and opens the possibilities to use any shape or path. Don't miss this episode and be sure to download Adam's sample code.
 

Relevant links:

Follow us on Twitter @SilverlightTV or on the web at http://silverlight.tv/

Don’t miss the next episode on Thursday May 13th...Exposing SOAP, JSON, and OData Endpoints to RIA Services.

Tags:

Follow the Discussion

  • Great video!  I think we need a "Greatest Blend 4 Video Ever" in the near future:)  How do you setup a simple transition when clicking the Move button on last example?  Meaning.... how would you add easing to animated between the location of PLB?

     

    Thanks

  • I can see the pathlistbox being used for gaming and possibily 3D stuff.

  • Ian WalkerIan2 In geeks we trust ...

    Very cool - (I'm currently looking at integrating this into http://FromTheMalverns.com)

  • Great Stuff guys, I love the PathListBox to bits!!!

     

    As you have asked on what others have done.

    Checkout my BusyBee animation on CodeProject: http://www.codeproject.com/KB/expression/BusyBee.aspx

    It uses the PathlistBox, along with some Spirographic Layout Paths created by Ken Johnson.

     

    Ken's done some amazing work here http://www.codeproject.com/KB/WPF/SpirographShapes.aspx

    And a perfect compliment for the PathListBox....

  • Teresa Burgertburger pnb

    Perfect!  Thank you very much!

  • I looking at the posibility of using the control in a complex business application that I am developing, this would require manipulating the PathListBox in c# at runtime, but I couldnt find any examples of this anywhere ...is it posible?

  • I could see this being used, like MadLibrarian said, in gaming... suppose you make the items "enemies" that travel around on the path...

  • John Papajopapa Evangelist on the Loose

    Exactly! I have a space-invaders-like sample I should share. Smiley

  • Do you mind sharing? that'd be neat to take a peek at, even though i'm more of a web programmer than a game developer... oh yeah, another idea, that i'm using... i'll post the code in a moment, is custom loading control...so, use an ellipse as the path, put a few smaller circles on it, and animate the "start" property to get the classic spinning-ball loading icon...

  • Here's the code...

    XAML:

    <UserControl.Resources> <Storyboard x:Name="LoadingSpin"> <DoubleAnimation Duration="0:0:0.8" To="0.91" Storyboard.TargetProperty="(PathListBox.LayoutPaths)[0].(LayoutPath.Start)" Storyboard.TargetName="pathListBox" d:IsOptimized="True"/> </Storyboard> </UserControl.Resources>
     

    ...

     

    <StackPanel Orientation="Horizontal" x:Name="loadingSP" Visibility="Collapsed" Margin="0,4,0,0"> <Ellipse x:Name="ellipse" Fill="#FFF4F4F5" HorizontalAlignment="Center" Margin="10,0,0,0" Stroke="Black" Width="21" Height="21" VerticalAlignment="Center"> </Ellipse> <sdk:Label VerticalAlignment="Center" HorizontalAlignment="Center" Content="Loading..." Margin="5,0,0,0" /> </StackPanel> 

    ...

     <ec:PathListBox x:Name="pathListBox" HorizontalAlignment="Left" Height="23" Width="23"> <ec:PathListBox.LayoutPaths> <ec:LayoutPath SourceElement="{Binding ElementName=ellipse}" Padding="0" Start="-0.08" /> </ec:PathListBox.LayoutPaths> <Ellipse Fill="Black" Stroke="Black" Height="9.25" Width="9.25" /> <Ellipse Fill="Black" Stroke="Black" Height="9.25" Width="9.25" /> <Ellipse Fill="Black" Stroke="Black" Height="9.25" Width="9.25" /> <Ellipse Fill="Black" Stroke="Black" Height="9.25" Width="9.25" /> <Ellipse Fill="Black" Stroke="Black" Height="9.25" Width="9.25" /> <Ellipse Fill="Black" Stroke="Black" Height="9.25" Width="9.25" /> <Ellipse Fill="Blue" Stroke="Blue" Height="9.25" Width="9.25" /> </ec:PathListBox>

     

    and then, the Code Behind...

    loadingSP.Visibility = Windows.Visibility.Visible Dim sb As Storyboard = DirectCast(Me.Resources("LoadingSpin"), Storyboard) sb.Begin() sb.RepeatBehavior = RepeatBehavior.Forever

     

    ...and then of course, you could tweak it...make ball 1 white, ball 2 light light gray, ball 3 light gray, ball 4 gray, ball 5 black, etc. for a more graphically appealing image...i'll give it a try. in the mean time, there it is. Smiley

Remove this comment

Remove this thread

close

Comments Closed

Comments have been closed since this content was published more than 30 days ago, but if you'd like to continue the conversation, please create a new thread in our Forums,
or Contact Us and let us know.