WrapPanel이 DataTemplate에서 가로로 줄 바꿈하지 않습니다.

Question

DataTemplate을 통해 Button으로 두 개의 WrapPanel을 채우고 있습니다. 그러나 어떤 이유로 든 세로로 정렬되어 있습니다. 왜 여기 정확히 잘못 되었습니까? Orientation 속성을 설정했는지 여부는 중요하지 않습니다.

XAML : 이것은 WrapPanel의 모습입니다

<UserControl x:Class="DashboardClient.View.DashboardView" 
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      mc:Ignorable="d" 
      Width="940" Height="640"> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="400" /> 
      <ColumnDefinition /> 
     </Grid.ColumnDefinitions> 
     <DockPanel Grid.Column="0" Height="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Grid}},Path=ActualHeight}"> 
      <ScrollViewer VerticalScrollBarVisibility="Auto" DockPanel.Dock="Top" Height="520" Margin="5"> 
       <WrapPanel> 
        <ItemsControl ItemsSource="{Binding Dashboards}"> 
         <ItemsControl.ItemTemplate> 
          <DataTemplate> 
           <Button Width="120" Height="120" Margin="5" Command="{Binding DataContext.DashboardCommand, RelativeSource={RelativeSource AncestorType=ItemsControl}}" CommandParameter="{Binding}"> 
            <TextBlock TextWrapping="Wrap" HorizontalAlignment="Center" Text="{Binding Name}" /> 
           </Button> 
          </DataTemplate> 
         </ItemsControl.ItemTemplate> 
        </ItemsControl> 
        <Button Width="120" Height="120" Margin="5" Command="{Binding DashboardAddCommand}" Content="+" FontSize="100" /> 
       </WrapPanel> 
      </ScrollViewer> 
      <StackPanel Height="100" Margin="5"> 
       <Label>Dashboardname:</Label> 
       <TextBox Text="{Binding SelectedDashboard.Name}" /> 
       <RadioButton Content="Sichtbar" Margin="0 10" IsChecked="{Binding SelectedDashboard.IsVisibleOnDashboard, UpdateSourceTrigger=PropertyChanged}" /> 
       <Button Content="Dashboard löschen" Command="{Binding DashboardRemoveCommand}" /> 
      </StackPanel> 
     </DockPanel> 
     <StackPanel Grid.Column="1" Margin="0"> 
      <ScrollViewer VerticalScrollBarVisibility="Auto" Height="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type StackPanel}},Path=ActualHeight}"> 
       <WrapPanel> 
        <ItemsControl ItemsSource="{Binding SelectedDashboard.DashboardItems}"> 
         <ItemsControl.ItemTemplate> 
          <DataTemplate> 
           <Button Width="200" Height="120" Command="{Binding DataContext.DashboardItemCommand, RelativeSource={RelativeSource AncestorType=ItemsControl}}" CommandParameter="{Binding}" Margin="10"> 
            <TextBlock TextWrapping="Wrap" HorizontalAlignment="Center" Text="{Binding Name}" /> 
           </Button> 
          </DataTemplate> 
         </ItemsControl.ItemTemplate> 
        </ItemsControl> 
        <Button Width="200" Height="120" Content="+" FontSize="100" Command="{Binding DashboardItemAddCommand}" Margin="10" /> 
       </WrapPanel> 
      </ScrollViewer> 
     </StackPanel> 
    </Grid> 
</UserControl> 

:
이

추가 버튼은 항상 너무, 어떻게 든 잘립니다. 당신이 WrapPanel에 수평으로 ItemsControl에의 자식을 넣어하려는 경우

Answer 1

, 당신은 ItemsPanelTemplate를 통해 그 아이에 대한 WrapPanel을 사용하는 ItemsControl에 말할 필요 :

<WrapPanel Orientation="Horizontal"> 
    <ItemsControl ItemsSource="{Binding Dashboards}"> 
     <ItemsControl.ItemTemplate> 
      <DataTemplate> 
       <Button 
        Width="120" 
        Height="120" 
        Margin="5" 
        Command="{Binding DataContext.DashboardCommand, RelativeSource={RelativeSource AncestorType=ItemsControl}}" 
        CommandParameter="{Binding}" 
        > 
        <TextBlock 
         TextWrapping="Wrap" 
         HorizontalAlignment="Center" 
         Text="{Binding Name}" 
         /> 
       </Button> 
      </DataTemplate> 
     </ItemsControl.ItemTemplate> 
     <ItemsControl.ItemsPanel> 
      <ItemsPanelTemplate> 
       <WrapPanel Orientation="Horizontal" /> 
      </ItemsPanelTemplate> 
     </ItemsControl.ItemsPanel> 
    </ItemsControl> 
    <Button 
     Width="120" 
     Height="120" 
     Margin="5" 
     VerticalAlignment="Top" 
     Command="{Binding DashboardAddCommand}" 
     Content="+" 
     FontSize="100" 
     /> 
</WrapPanel> 

나도 몰라 무엇을 버튼으로하고 싶다. 내 생각 엔 ItemsControl의 오른쪽에 그것을 원한다는 것이고, 그것은 나에게 더 이해하기 쉽기 때문에 Top으로 정렬했다.

Answer 2

대신

<ScrollViewer> 
    <WrapPanel> 
     <ItemsControl ItemsSource="{Binding Dashboards}"> 
      <ItemsControl.ItemTemplate ... /> 
     </ItemsControl> 
     <Button Content="+" ... /> 
    </WrapPanel> 
</ScrollViewer> 

의 당신은

<ScrollViewer> 
    <ItemsControl ItemsSource="{Binding Dashboards}"> 
     <ItemsControl.ItemTemplate ... /> 
     <ItemsControl.ItemsPanel> 
      <ItemsPanelTemplate> 
       <WrapPanel /> 
      </ItemsPanelTemplate> 
     </ItemsControl.ItemsPanel> 
    </ItemsControl> 
    <Button Content="+" ... /> <!-- A --> 
</ScrollViewer> 
<Button Content="+" ... /> <!-- B --> 

WrapPanel

레이아웃 대시 보드에 ItemsControl 내부를 이동 할 수 있습니다. 당신은 버튼 다른 곳를 넣을 수 있습니다

는 (같은 @EdPlunkett 나는 어디에 넣어하는 좋은 생각이 없어) : A - 당신이 대시 보드와 함께 버튼을 스크롤 할 수 있도록하고 B 버튼 고정, 무시하고 계속됩니다 스크롤링.