Как преобразовать ListBox в LongListSelector

Question

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

То, что я в настоящее время

<ListBox Name="ListBoxEffects" SelectionMode="Single" ItemsSource="{Binding}" Margin="{Binding}" 
        toolkit:TiltEffect.IsTiltEnabled="True" SelectionChanged="ListBox_SelectionChanged" > 
       <ListBox.ItemsPanel> 
        <ItemsPanelTemplate> 
         <toolkit:WrapPanel ItemWidth="Auto" /> 
        </ItemsPanelTemplate> 
       </ListBox.ItemsPanel> 
       <ListBox.ItemTemplate> 
        <DataTemplate> 
         <StackPanel Orientation="Vertical" Margin="12,0,0,24" > 
          <Image Source="{Binding Thumbnail}" Width="128" Height="128" /> 
          <TextBlock Text="{Binding Name}" TextWrapping="Wrap" FontSize="{StaticResource PhoneFontSizeNormal}" VerticalAlignment="Center" HorizontalAlignment="Center" /> 
         </StackPanel> 
        </DataTemplate> 
       </ListBox.ItemTemplate> 
      </ListBox> 

И то, что я пытаюсь выполнить

<phone:LongListSelector Name="ListBoxEffects" Margin="{Binding}" 
            toolkit:TiltEffect.IsTiltEnabled="True" 
            LayoutMode="Grid" GridCellSize="128,128" 
            SelectionChanged="ListBox_SelectionChanged" > 
       <phone:LongListSelector.ItemTemplate> 
        <DataTemplate> 
         <StackPanel Orientation="Vertical" Margin="12,0,0,24" > 
          <Image Source="{Binding Thumbnail}" Width="128" Height="128" /> 
          <TextBlock Text="{Binding Name}" TextWrapping="Wrap" FontSize="{StaticResource PhoneFontSizeNormal}" VerticalAlignment="Center" HorizontalAlignment="Center" /> 
         </StackPanel> 
        </DataTemplate> 
       </phone:LongListSelector.ItemTemplate> 
      </phone:LongListSelector> 

Я мог бы просто изменить <toolkit:WrapPanel ItemWidth="Auto" /> в оригинале до заданной ширины, но я полагаю, в долгосрочной перспективе запускается с добавлением нескольких элементов динамически, LongListSelector будет намного лучшим вариантом. На данный момент ошибок нет, но в представлении ничего не отображается.

Answer 1

Вы можете попробовать изменить ListBox к Phone:LongListSelector с LayoutMode="Grid" и GridCellSize="250,250", где 250 представляет собой произвольное число вы определяете для страницы ..

Answer 2

 List<LonglistSelectorPivot1<Class>> DataSource = LonglistSelectorPivot1<Class>.CreateGroups(observableSource, 
      System.Threading.Thread.CurrentThread.CurrentUICulture, 
      (Classs) => { return s.elementToSortAfter; }, true); 
     LongListSelectorName.ItemsSource = DataSource; 

И включают класс

public class LonglistSelectorPivot1<T> : List<T> 
{ 
    public delegate string GetKeyDelegate(T item); 

    /// <summary> 
    /// The Key of this group. 
    /// </summary> 
    public string Key { get; private set; } 

    /// <summary> 
    /// Public constructor. 
    /// </summary> 
    /// <param name="key">The key for this group.</param> 
    public LonglistSelectorPivot1(string key) 
    { 
     Key = key; 
    } 

    /// <summary> 
    /// Create a list of AlphaGroup<T> with keys set by a SortedLocaleGrouping. 
    /// </summary> 
    /// <param name="slg">The </param> 
    /// <returns>Theitems source for a LongListSelector</returns> 
    private static List<LonglistSelectorPivot1<T>> CreateGroups(SortedLocaleGrouping slg) 
    { 
     List<LonglistSelectorPivot1<T>> list = new List<LonglistSelectorPivot1<T>>(); 

     foreach (string key in slg.GroupDisplayNames) 
     { 
      list.Add(new LonglistSelectorPivot1<T>(key)); 
     } 

     return list; 
    } 

    /// <summary> 
    /// Create a list of AlphaGroup<T> with keys set by a SortedLocaleGrouping. 
    /// </summary> 
    /// <param name="items">The items to place in the groups.</param> 
    /// <param name="ci">The CultureInfo to group and sort by.</param> 
    /// <param name="getKey">A delegate to get the key from an item.</param> 
    /// <param name="sort">Will sort the data if true.</param> 
    /// <returns>An items source for a LongListSelector</returns> 
    public static List<LonglistSelectorPivot1<T>> CreateGroups(IEnumerable<T> items, CultureInfo ci, GetKeyDelegate getKey, bool sort) 
    { 
     SortedLocaleGrouping slg = new SortedLocaleGrouping(ci); 
     List<LonglistSelectorPivot1<T>> list = CreateGroups(slg); 

     foreach (T item in items) 
     { 
      int index = 0; 
      if (slg.SupportsPhonetics) 
      { 
       //check if your database has yomi string for item 
       //if it does not, then do you want to generate Yomi or ask the user for this item. 
       //index = slg.GetGroupIndex(getKey(Yomiof(item))); 
      } 
      else 
      { 
       index = slg.GetGroupIndex(getKey(item)); 
      } 
      if (index >= 0 && index < list.Count) 
      { 
       list[index].Add(item); 
      } 
     } 

     if (sort) 
     { 
      foreach (LonglistSelectorPivot1<T> group in list) 
      { 
       group.Sort((c0, c1) => { return ci.CompareInfo.Compare(getKey(c0), getKey(c1)); }); 
      } 
     } 

     return list; 
    } 

}