IPhone, как прокрутка на Silverlight ListBox

Question

Мне нужен список с функциональностью, подобной IPhone, для Silverlight. То есть, анимированная прокрутка, и перетащите, чтобы прокрутить. Прокрутка будет продолжаться через некоторое время после нажатия кнопки мыши на основании «скорости» перетаскивания. Я искал и не нашел поставщиков управления, обеспечивающих это. Итак, вопрос в том, как мне это построить? Мне нужно несколько советов, чтобы начать.

Этот вопрос состоит из двух частей:

Часть 1, Как получить анимированную прокрутку списка.

Часть 2, Как построить «перетаскиваемую» прокрутку, я полагаю, я должен поставить холст сверху и отследить событие мыши, и имитировать некоторую физику. Некоторые намеки здесь были бы великолепны.

Спасибо, Ларси.

Answer 1

Некоторое время назад я сделал элемент управления, который сделал что-то вроде этого. Все, что я сделал, это поместил стековую панель внутрь холста. Просто отрегулируйте canvas.top всей стековой панели при перемещении мыши (пока нажата мышь). Чтобы анимировать прокрутку после наведения мыши, вам просто нужно отследить перемещенную сумму и применить анимацию к свойству canvas.top.

Answer 2

Вот очень хороший полный пример для WPF, который выполняет как перетаскивание, так и автоматическую прокрутку с прокруткой / инерцией. Я не уверен, что если что-то нужно будет изменить, чтобы оно работало в Silverlight.

http://sachabarbs.wordpress.com/2009/12/24/friction-scrolling-now-an-wpf-attached-behaviour-too/

Просто примечание, что вы не можете щелкнуть и перетащить вид, если щелкнете по дочернему элементу (например, кнопкам), который фиксирует ввод мыши. На самом деле я изменил этот пример, чтобы вы могли перетаскивать прокрутку, когда нажимаете на дочерние элементы, и в то же время позволяли дочерним элементам принимать ввод от мыши, когда прокрутка без перетаскивания.

Answer 3

Еще один пост с сайта Саши Барбера:

http://sachabarber.net/?p=481

Джеремия Моррилл делится кодом, который реализует анимированную прокрутку с инерцией в пользовательском ContentControl (на основе шаблона с включенным ScrollViewer)

Answer 4

Это будет проще в Silverlight 3, чем Silverlight 2, но не невозможно в 2.

Это видео из MIX 09, Создание элементов управления Microsoft Silverlight , должно вам помочь.

Answer 5

<ScrollViewer x:Name="sv1" Width="500" Height="285">
   <StackPanel x:Name="sp1" Width="450" Height="285">
   </StackPanel>
</ScrollViewer>

Установив поз. и нег. поля на панели стека внутри прокрутки Вы можете создать эффект прокрутки.

onScroll_Up()
{
  //Change this based on your scrollviewer dimension
  if (this.sv1.ScrollableHeight < 300)
  {
    Thickness thickness = this.sp1.Margin;
    thickness.Top += 50;
    this.sv1.SetValue(StackPanel.MarginProperty, thickness);
  }   
}


onScroll_Down()
{
  if (this.sv1.ScrollableHeight > 1)
  {
    Thickness thickness = this.sp1.Margin;
    thickness.Top += -50;
    this.sv1.SetValue(StackPanel.MarginProperty, thickness);
  }
}