Опитвам се динамично да попълня Grid с елементи (Rectangle). Искам да на един ред и да заемат цялото хоризонтално пространство в Grid-a, като ширината на всеки елемент се определя в зависимост от това колко елементи са, а височината е random. Всичко работи, но елементите се подреждат вертикално, а не хоризонтално. Ето и малко код:

Взимам контейнера (Grid) през code-behind-a:

private void Page_Loaded(object sender, RoutedEventArgs e) { ((MainViewModel)this.DataContext).Container = this.FindName("algContainer") as Grid; }

View model-а за всеки елемент:

public class ElementViewModel : BaseViewModel { private int _column; private double _width; private double _height; private double _strokeTickness; private Brush _fill; private SolidColorBrush _stroke; private VerticalAlignment _verticalAlignment; public ElementViewModel() { } public double Width { get { return _width; } set { _width = value; NotifyPropertyChanged(); } } public double Height { get { return _height; } set { _height = value; NotifyPropertyChanged(); } } public Brush Fill { get { return _fill; } set { _fill = value; NotifyPropertyChanged(); } } public VerticalAlignment VerticalAlignment { get { return _verticalAlignment; } set { _verticalAlignment = value; NotifyPropertyChanged(); } } public double StrokeThickness { get { return _strokeTickness; } set { _strokeTickness = value; NotifyPropertyChanged(); } } public SolidColorBrush Stroke { get { return _stroke; } set { _stroke = value; NotifyPropertyChanged(); } } public int Column { get { return _column; } set { _column = value; NotifyPropertyChanged(); } } }

През view model-а на страницата използвам команда за да генерирам елементите:

public ICommand Sort { get { if (this._sortCommand == null) { this._sortCommand = new RelayCommand(this.PerformSort); } return this._sortCommand; } } private void PerformSort() { this.ElementCollection = PopulateElements(); } private List<ElementViewModel> PopulateElements() { var heightsList = GenerateRadnomNumbers(this.ElementsCount, (int)this.Container.ActualHeight); double width = this.Container.ActualWidth / this.ElementsCount; var collection = new List<ElementViewModel>(); /* this.Container.ColumnDefinitions.Clear(); this.Container.Children.Clear();*/ for (int i = 0, j = 1; i < this.ElementsCount; i++, j += 2) { var emptyColDef = new ColumnDefinition(); var elementColDef = new ColumnDefinition(); var element = new ElementViewModel(); emptyColDef.Width = GridLength.Auto; elementColDef.Width = new GridLength(1, GridUnitType.Star); this.Container.ColumnDefinitions.Add(emptyColDef); this.Container.ColumnDefinitions.Add(elementColDef); element.Width = width; element.Height = heightsList[i]; element.Column = j; element.Fill = new SolidColorBrush(Colors.Black); element.Stroke = new SolidColorBrush(Colors.White); element.StrokeThickness = 1; element.VerticalAlignment = VerticalAlignment.Bottom; collection.Add(element); } return collection; }

И XMAL-а, чрез които визуализирам елементите:

<ItemsControl ItemsSource="{Binding ElementCollection, Mode=TwoWay}" Grid.Row="1" Grid.ColumnSpan="2" Margin="12"> <ItemsControl.ItemsPanel> <ItemsPanelTemplate> <Grid x:Name="algContainer" Background="White" /> </ItemsPanelTemplate> </ItemsControl.ItemsPanel> <ItemsControl.ItemTemplate> <DataTemplate> <Rectangle Width="{Binding Width}" Height="{Binding Height}" Fill="{Binding Fill}" StrokeThickness="{Binding StrokeThickness}" Stroke="{Binding Stroke}" Grid.Column="{Binding Column}"/> </DataTemplate> </ItemsControl.ItemTemplate> </ItemsControl>

Някакви идеи къде бъркам?