StackPanel上的HorizontalScrollBar

我有一個StackPanel，它被自定義的UserControls填充。我想在這個堆疊面板的底部包含一個水平滾動條，讓用戶可以向左或向右查看滾動條以查看更多用戶控件。StackPanel上的HorizontalScrollBar

我現在的工作雖然有效，但看起來不正確，因爲ItemsPanel的大小是由ScrollViewer決定的。我的意思是如果我調整垂直滾動條並縮小它，這也縮小了堆疊面板，爲了看到它，我需要向下滾動。我試過把ScrollViewer放在ItemsControl裏面，但這不起作用。

<Window x:Name="MainWindow" x:Class="Test.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="Test Generator" Height="464.5" Width="950"> 
<Grid> 
    <Menu DockPanel.Dock="Top" Height="22" VerticalAlignment="Top"> 
     <MenuItem Header="_File"> 
      <MenuItem Header="New"/> 
      <MenuItem Header="Open Template"/> 
      <MenuItem Header="Save Template"/> 
      <Separator /> 
      <MenuItem Header="_Exit"/> 
     </MenuItem> 
    </Menu> 
    <Button Content="Load Template" HorizontalAlignment="Left" Margin="35,36,0,0" VerticalAlignment="Top" Width="98"/> 
    <Button Content="Add Col" HorizontalAlignment="Right" Margin="0,36,35,0" VerticalAlignment="Top" Width="75"/> 
    <Button x:Name="Generate_Data" Content="Generate Data Window" Height="22" Margin="0,36,0,0" VerticalAlignment="Top" Width="160" Click="Generate_Data_Click" HorizontalAlignment="Center"/> 
     <ScrollViewer HorizontalScrollBarVisibility="Visible" Margin="0,197,0,0"> 
      <ItemsControl Name="userControlContainer" Margin="10,150,10,10" ItemsSource="{Binding MyCollection}"> 
       <ItemsControl.ItemsPanel> 
        <ItemsPanelTemplate> 
         <StackPanel Orientation="Horizontal"/> 
        </ItemsPanelTemplate> 
       </ItemsControl.ItemsPanel> 
       <ItemsControl.ItemTemplate> 
        <DataTemplate> 
         <ContentControl Content="{Binding}" /> 
        </DataTemplate> 
       </ItemsControl.ItemTemplate> 
      </ItemsControl> 
     </ScrollViewer> 
</Grid>

來源

2016-04-12 Talen Kylon

取下外ScrollViewer你，並把它添加到ItemsControl本身的ControlTemplate。

<ItemsControl Name="userControlContainer" Margin="10,150,10,10" ItemsSource="{Binding MyCollection}"> 
    <ItemsControl.ItemsPanel> 
     <ItemsPanelTemplate> 
      <StackPanel Orientation="Horizontal"/> 
     </ItemsPanelTemplate> 
    </ItemsControl.ItemsPanel> 
    <ItemsControl.Template> 
     <ControlTemplate> 
      <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled"> 
       <ItemsPresenter SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}"/> 
      </ScrollViewer> 
     </ControlTemplate> 
    </ItemsControl.Template> 
    <ItemsControl.ItemTemplate> 
     <DataTemplate> 
      <ContentControl Content="{Binding}" /> 
     </DataTemplate> 
    </ItemsControl.ItemTemplate> 
</ItemsControl>

來源

2016-04-12 16:54:05

這個工程非常精美，完全按照我的需要。我可以問你從哪裏獲得這些信息嗎？ –

我第一次開始使用自定義ItemsControl時遇到了類似的問題，這是我想出的方法。我查看了默認的ItemsControl模板，並看到了Scroll內置的工作方式。我不記得在哪裏，但我相信我用它作爲源：https://msdn.microsoft.com/en-us/library/system.windows.controls.itemscontrol.itemcontainerstyle(v=vs.110）。 ASPX –

嘗試刪除外<ScrollViewer/>並設置附加屬性的<StackPanel ScrollViewer.HorizontalScrollBarVisibility="Auto" />。

完整的例子：

<ItemsControl Name="userControlContainer" Margin="10,150,10,10" ItemsSource="{Binding MyCollection}"> 
      <ItemsControl.ItemsPanel> 
       <ItemsPanelTemplate> 
        <StackPanel Orientation="Horizontal" ScrollViewer.HorizontalScrollBarVisibility="Auto"/> 
       </ItemsPanelTemplate> 
      </ItemsControl.ItemsPanel> 
      <ItemsControl.ItemTemplate> 
       <DataTemplate> 
        <ContentControl Content="{Binding}" /> 
       </DataTemplate> 
      </ItemsControl.ItemTemplate> 
</ItemsControl>

來源

2016-04-12 16:22:13 StepUp

這不起作用。我嘗試了Visible而不是Auto。 –

@TalenKylon你可以寫更多的夾板，你想要什麼。你想調整放在''中的物品嗎？ – StepUp

我不想調整它們的大小，我想要一個水平滾動條，這將允許我在StackPanel中的項數超過應用程序視圖的情況下查看更多的滾動條。然後我們向左或向右滾動以查看更多內容。 –

StackPanel上的Horizo​​ntalScrollBar

回答

相關問題

StackPanel上的HorizontalScrollBar