GridView с двумя столбцами, шириной заливки

Результат, который я хочу достичь, довольно прост, список с двумя столбцами, одинаковыми по ширине. В Windows Phone 7/8 это может быть легко достигнуто с помощью ListBox с WrapPanel как ItemsPanel и установки ItemWidth на 240 (поскольку ширина экрана равна 480).

Теперь я пишу универсальное приложение, но здесь проблема заключается в том, что на экране не гарантируется ширина 480 (даже не для телефона), поэтому я не могу установить ItemWidth поскольку я хочу, чтобы он заполнил ширину экрана. Я смог добиться почти желаемого эффекта, используя следующий XAML :

                

Это дает следующий результат: введите описание изображения здесь

Как видно, он успешно дает 2 столбца с равной шириной, НО Grid в GridView.ItemTemlate не заполняет всю ширину каждого столбца. Я попытался установить HorizontalAlignment="Stretch" на обоих gridх и на GridView сам без каких-либо успехов. Кто-нибудь имеет представление об этом?

Вы можете попробовать следующее:

    

Другая вещь, которую вы могли бы попробовать, – это вручную установить ItemWidth / ItemHeight всякий раз, когда вы получаете событие SizeChanged в GridView .

Если по какой-либо причине вышеуказанное не работает, вы также можете сделать то, что я делаю ниже, и обновить Value обоих ресурсов SizeChanged событий SizeChanged :

     ...      

Где DoubleViewModel :

 public class DoubleViewModel : BindableBase { #region Value ///  /// Backing field for the Value property. ///  private double value; ///  /// Gets or sets a value indicating the value. ///  public double Value { get { return this.value; } set { this.SetProperty(ref this.value, value); } } #endregion } 

Мое решение:

             

Код:

 private void GridView_SizeChanged(object sender, SizeChangedEventArgs e) { var panel = (ItemsWrapGrid)MyGridView.ItemsPanelRoot; panel.ItemWidth =panel.ItemHeight= e.NewSize.Width / 2; } 

Решение, которое я использовал, было основано на предложении Филиппа Скакунса, но небольшая другая реализация, сделав повторное использование User Control с таким поведением. Пользовательский элемент управления имеет (среди прочих) свойства Columns и ItemsSource . Я изменяю ItemWidth элемента ItemsWrapGrid вместо ширины ItemTemplate и делаю это непосредственно в SizeChanged событий SizeChanged .

Для этого мне также понадобилось использовать ItemsWrapGrid вместо WrapGrid . XAML для конечного пользователя:

            

И для кода:

 using System; using Windows.UI.Xaml; using Windows.UI.Xaml.Controls; namespace MyProject.CustomControls { public sealed partial class ColumnGridView : UserControl { public static readonly DependencyProperty ItemTemplateProperty = DependencyProperty.Register("ItemTemplate", typeof(DataTemplate), typeof(ColumnGridView), new PropertyMetadata(null)); public DataTemplate ItemTemplate { get { return (DataTemplate)GetValue(ItemTemplateProperty); } set { SetValue(ItemTemplateProperty, value); } } public static readonly DependencyProperty ItemsSourceProperty = DependencyProperty.Register("ItemsSource", typeof(object), typeof(ColumnGridView), new PropertyMetadata(null)); public object ItemsSource { get { return (object)GetValue(ItemsSourceProperty); } set { SetValue(ItemsSourceProperty, value); } } public static readonly DependencyProperty ColumnsProperty = DependencyProperty.Register("Columns", typeof(int), typeof(ColumnGridView), new PropertyMetadata(1)); public int Columns { get { return (int)GetValue(ColumnsProperty); } set { if (value <= 0) throw new ArgumentOutOfRangeException("Columns must be greater than 0"); SetValue(ColumnsProperty, value); } } public ColumnGridView() { this.InitializeComponent(); } private void ItemsWrapGrid_SizeChanged(object sender, SizeChangedEventArgs e) { ItemsWrapGrid itemsWrapGrid = sender as ItemsWrapGrid; if (itemsWrapGrid != null) { itemsWrapGrid.ItemWidth = e.NewSize.Width / Columns; } } } } 

Мне удалось решить что-то очень похожее, просто привязав значение Item Width к родительскому ActualWidth, например:

                

В качестве альтернативы вы можете использовать Loaded-Event из своего WrapGrid чтобы установить хотя бы ItemWidth

XAML

                                           

Codebehind

  private void MyWrapGrid_Loaded(object sender, RoutedEventArgs e) { var wg = sender as WrapGrid; wg.ItemWidth = MyGrid.ActualWidth; } 

пример

введите описание изображения здесь

  • Связывание видимости для DataGridColumn в WPF
  • Что означает «{Binding Path =.}» В привязке WPF?
  • DataTrigger не изменяет свойство Text
  • WPF: привязка ContextMenu к команде MVVM
  • Можете ли вы определить несколько TargetTypes для одного стиля XAML?
  • Как я могу сортировать ListBox, используя только XAML и без кода?
  • Windows Phone 8.1. Переключение видимости TextBlock в DataTemplate
  • Как прокручивать в нижней части ScrollViewer автоматически с помощью Xaml и привязки?
  • Передача значения enums в качестве параметра команды из XAML
  • Навигация по страницам с помощью MVVM в приложении Store
  • Как растянуть WPF вкладку Элементы заголовка к размеру родительского контроля
  • Давайте будем гением компьютера.