Выравнивание вложенной привязки данных с ItemsControl в C# WPF

У меня есть следующий шаблон данных:

<ItemsControl x:Name="Groups" ItemsSource="{Binding Groups}">
    <ItemsControl.ItemTemplate>
         <DataTemplate>
               <StackPanel x:Name="GroupStackPanel" Orientation="Horizontal">
                    <GroupBox Header="{Binding Path=GroupName}">
                         <ItemsControl ItemsSource="{Binding Buttons}">
                               <ItemsControl.ItemTemplate>
                                    <DataTemplate>
                                         <StackPanel x:Name="BtnStackPanel" Orientation="Horizontal">
                                               <Button Content="{Binding Path=LabelString}"
                                                                Command="{Binding Path=ButtonCommand}"/>
                                          </StackPanel>
                                     </DataTemplate>
                                </ItemsControl.ItemTemplate>
                           </ItemsControl>
                      </GroupBox>
                 </StackPanel>
           </DataTemplate>
     </ItemsControl.ItemTemplate>
</ItemsControl>

Это включает в себя некоторые группы кнопок и кнопки, которые находятся в этой группе.

Класс Group включает строковое свойство «GroupName» и свойство ObservableCollection «Buttons». Распределение кнопок и групп работает корректно.

Итак, вот моя проблема: я хочу, чтобы эти группы кнопок находились на вкладке ленты в док-панели. Но выравнивание или ориентация неверны, поэтому кнопки расположены одна под другой, а не рядом друг с другом. Кто-нибудь знает, что не так в моем коде?


mvvm c# wpf xaml itemscontrol
person Tobias    schedule 21.08.2013    source источник

Ответы (1)


arrow_upward
2
arrow_downward

На данный момент вы используете Stackpanel с горизонтальной ориентацией, что является правильной идеей, но Stackpanel находится не в том месте (ItemTemplate). ItemTemplate применяется к каждому элементу в ItemsControl, что означает, что ваш XAML представляет собой набор кнопок, каждая из которых окружена собственным StackPanel.

Чтобы получить желаемый эффект, вместо этого вам нужно указать Stackpanel как ItemsPanelTemplate из ItemsControl.

Попробуйте изменить внутреннее предложение на:

<ItemsControl ItemsSource="{Binding Buttons}">
   <ItemsControl.ItemTemplate>
     <DataTemplate>
       <Button Content="{Binding Path=LabelString}" Command="{Binding Path=ButtonCommand}"/>
     </DataTemplate>
   <ItemsControl.ItemsPanel>
     <ItemsPanelTemplate>
       <StackPanel x:Name="BtnStackPanel" Orientation="Horizontal">
     </ItemsPanelTemplate>  
   <ItemsControl.ItemsPanel>
</ItemsControl>

Изменить

Если вы хотите, чтобы и группы, и кнопки отображались горизонтально, вы можете сделать то же самое для обоих:

 <ItemsControl x:Name="Groups" ItemsSource="{Binding Groups}">
   <ItemsControl.ItemTemplate>
     <DataTemplate>         
       <GroupBox Header="{Binding Path=GroupName}">
          <ItemsControl ItemsSource="{Binding Buttons}">
             <ItemsControl.ItemTemplate>
               <DataTemplate>
                 <Button Content="{Binding Path=LabelString}" Command="{Binding Path=ButtonCommand}"/>
               </DataTemplate>
             <ItemsControl.ItemsPanel>
               <ItemsPanelTemplate>
                 <StackPanel x:Name="BtnStackPanel" Orientation="Horizontal"/>
               </ItemsPanelTemplate>  
             <ItemsControl.ItemsPanel>
          </ItemsControl>
        </GroupBox>
     </DataTemplate>
   </ItemsControl.ItemTemplate>
   <ItemsControl.ItemsPanel>
     <ItemsPanelTemplate>
       <StackPanel x:Name="GroupStackPanel" Orientation="Horizontal"/>
     </ItemsPanelTemplate>
   <ItemsControl.ItemsPanel>
 </ItemsControl>
person Daniel Neal    schedule 21.08.2013
comment
Благодарю. выглядит хорошо. так что теперь кнопки рядом друг с другом, но группы по-прежнему ниже друг друга. - person Tobias; 21.08.2013
comment
Да, вы можете сделать то же самое с группами, если вам нужно :) - person Daniel Neal; 21.08.2013
comment
да, я так и сделал, но теперь я получаю исключение: коллекция панели Children, которая используется как ItemsPanel для ItemsControl, не может быть явно изменена. - person Tobias; 21.08.2013
comment
Я отредактировал свой пример, чтобы сделать это - может быть, проверить, что у вас то же самое? Я не публиковал это изначально, так как думал, что это будет слишком много сразу, и синтаксис будет понятнее только с одним - person Daniel Neal; 21.08.2013
comment
большое спасибо. теперь это работает. Я думаю, что я всегда делал это точно по-другому :) - person Tobias; 21.08.2013