Как изменить порядок элементов с помощью перетаскивания внутри большого вертикального списка при сохранении вертикальной прокрутки? - PullRequest
Новая
       25

Как изменить порядок элементов с помощью перетаскивания внутри большого вертикального списка при сохранении вертикальной прокрутки?

6 голосов
/ 22 апреля 2011

Существует множество советов по перетаскиванию на Windows Phone, но в настоящее время я не могу собрать все вместе.Поэтому я надеюсь, что вы можете дать мне несколько советов для достижения моей цели: Показать прокручиваемый список элементов с хорошим переупорядочением и опытом прокрутки.

Я использую StackPanel для представления вертикального спискаконтроля.Допустим, эти элементы управления CheckBoxes отображают некоторую информацию (на самом деле я создал немного более сложные пользовательские элементы управления).Там может быть много элементов, поэтому я ставлю ScrollViewer вокруг StackPanel, чтобы пользователь мог прокручивать вверх и вниз.Но теперь я также хочу дать пользователю возможность изменить порядок элементов управления в списке с помощью перетаскивания.

Для меня неясны некоторые вещи:

  1. Как включить Перетаскивание функциональность в StackPanel?(Таким образом, он выглядит плавным, и элементы меняются в анимированном, приятном на вид виде; они должны продолжать выделять пространство для вставляемого элемента, пока пользователь перетаскивает его.)
  2. Какможно ли добиться, чтобы пользователь мог вертикально прокручивать список , при этом сохраняя возможность перетаскивания объектов?(Я думаю, что может быть специальное «место перетаскивания» на каждом элементе, на который пользователь должен перетащить, поэтому я могу различать перетаскивание и прокрутку.)
  3. Как мне автопрокрутка список, когда пользователь перетаскивает один элемент в верхнюю или нижнюю границу, если список больше экрана?
  4. Это даже правильная комбинация элементов управления?Есть ли лучший?(Но я не хочу рассчитывать позиции элементов вручную.)

Мне бы очень хотелось услышать ваши идеи по этой теме, любая помощь будет принята с благодарностью!

Ответы [ 3 ]

1 голос
/ 08 апреля 2013

Вы можете сослаться на эту ссылку .Это имеет хорошее изменение порядка списка с вертикальной прокруткой.Удерживайте перетаскиваемый элемент в течение 1 минуты и начинайте перетаскивание.

1 голос
/ 23 января 2014

Ответ, который вы ищете, это ReorderListBox элемент управления, разработанный Джейсоном Гиншеро.

Я собираюсь показать его быструю реализацию, но если вам нужна полная демонстрация, загрузите исходный код с CodePlex здесь .

Сначала установите элемент управления из Nuget:

  • Инструменты >>> Диспетчер пакетов библиотеки >>> Управление пакетами NuGet для решения ...
  • Найдите ReorderListBox и установите созданный Джейсоном Джиншеро

Затем в XAML стартовой страницы вашего приложения (т. Е. MainPage.xaml ) скопируйте и вставьте выделенную ссылку на сборку в тег phone: PhoneApplicationPage вверху, где другие ссылки на сборку находятся. 

    xmlns:rlb="clr-namespace:ReorderListBox;assembly=ReorderListBox"

Затем поместите это на страницу XAML 

    <rlb:ReorderListBox
        x:Name="reorderListBox"
        Grid.Row="2"
        Margin="12,0,12,12"
        IsReorderEnabled="True">
            <rlb:ReorderListBox.ItemTemplate>
                <DataTemplate>
                    <TextBlock
                        Margin="12,4,12,4"
                        FontSize="36"
                        Text="{Binding}" />
                 </DataTemplate>
            </rlb:ReorderListBox.ItemTemplate>
    </rlb:ReorderListBox>

Наконец, в вашем коде (т. Е. MainPage.xaml.cs ) вы хотите определить ObservableCollection со своим списком данных и присвоить его reorderListBox.ItemsSource. Вы также можете сохранить состояние списка после его восстановления в следующий раз, когда приложение открывается. Вот пример: 

public partial class MainPage : PhoneApplicationPage
{
    public ObservableCollection<string> SampleDataList { get; set; }

    // Constructor
    public MainPage()
    {
        InitializeComponent();

        if (IsolatedStorageSettings.ApplicationSettings.Contains("SampleDataList"))
        {
            SampleDataList = IsolatedStorageSettings.ApplicationSettings["SampleDataList"] as ObservableCollection<string>;
        }
        else
        {
            SampleDataList = new ObservableCollection<string>();
            SampleDataList.Add("Zero");
            SampleDataList.Add("One");
            SampleDataList.Add("Two");
            SampleDataList.Add("Three");
            SampleDataList.Add("Four");
            SampleDataList.Add("Five");
            SampleDataList.Add("Six");
            SampleDataList.Add("Seven");
            SampleDataList.Add("Eight");
            SampleDataList.Add("Nine");
            SampleDataList.Add("Ten");
            SampleDataList.Add("Eleven");
            SampleDataList.Add("Twelve");
            SampleDataList.Add("Thirteen");
            SampleDataList.Add("Fourteen");
        }

        reorderListBox.ItemsSource = SampleDataList;
    }

    protected override void OnNavigatedFrom(NavigationEventArgs e)
    {
        base.OnNavigatedFrom(e);
        IsolatedStorageSettings.ApplicationSettings["SampleDataList"] = SampleDataList;
        IsolatedStorageSettings.ApplicationSettings.Save();
    }
}
1 голос
/ 19 июня 2011

Привет, вы можете проверить это, может быть, то, что вы ищете: http://blogs.msdn.com/b/jasongin/archive/2011/01/03/wp7-reorderlistbox-improvements-rearrange-animations-and-more.aspx

...