开发者

WP7 ListBox how to allow user to order items

开发者 https://www.devze.com 2023-01-25 23:16 出处:网络
Scenario: Windows Phone 7 application using MVVM. I have a ListBox that is bound to a collection of items from my ViewModel. The main usage of this view is to allow the user to re-order the items to h

Scenario: Windows Phone 7 application using MVVM. I have a ListBox that is bound to a collection of items from my ViewModel. The main usage of this view is to allow the user to re-order the items to his liking.

How do I implement this in WP7 ? The way I would like to do this would be to si开发者_StackOverflow社区mply allow the user to drag items to the position he wants. Is there any built-in support for such a gesture ? (I haven't been able to find any).


You could include in your project the Silverlight for Windows Phone Toolkit and then use the GestureListener to listen for DragStarted, DragDelta and DragComplete events.


As stated by AnthonyWJones the GesureListener is probably what you are looking for. I just wanted to add that you can use a FluidMoveBehavior for the list in order for the items to animate smoothly when the item order changes. In my opinion it gives a much improved user experience.

A fluid move behavior is simple enough to just "plug in" to your existing list, like this:

<Style TargetType="ListBox" x:Key="FluidListBox">
    <Setter Property="ItemsPanel">
        <Setter.Value>
            <ItemsPanelTemplate>
                <StackPanel>
                    <i:Interaction.Behaviors>
                        <ei:FluidMoveBehavior AppliesTo="Children" Tag="DataContext">
                            <ei:FluidMoveBehavior.EaseY>
                                <BackEase EasingMode="EaseInOut" Amplitude="0.5"/>
                            </ei:FluidMoveBehavior.EaseY>
                            <ei:FluidMoveBehavior.EaseX>
                                <BackEase EasingMode="EaseInOut" Amplitude="0.5"/>
                            </ei:FluidMoveBehavior.EaseX>
                        </ei:FluidMoveBehavior>
                    </i:Interaction.Behaviors>
                </StackPanel>
            </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>
</Style>


This solution works really well

http://blogs.msdn.com/b/jasongin/archive/2011/01/03/wp7-reorderlistbox-improvements-rearrange-animations-and-more.aspx

It's a control you just drop into your app and you can simply enable drag handles and move around items in a ListBox.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号