défilement horizontal pour StackPanel ne fonctionne pas

Question

je tente de créer un StackPanel horizontal mais je ne scrollable réussissais pas très bien ...

Actuellement, j'ai mon StackPanel avec une largeur auto (et le problème est peut-être ici) qui contient des éléments comme grids.

Maintenant, si toutes mes grilles ne sont pas visibles dans le panneau de la pile (la largeur est trop courte) je ne peux pas faire défiler. J'ai déjà essayé de mettre le panneau de la pile dans un ScrollViewer mais il doesn ' t travailler aussi.

Comment puis-je le faire? Merci

EDIT voici mon code:

<StackPanel Height="85" Margin="0,0,200,15" VerticalAlignment="Bottom"> 
     <ScrollViewer HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Disabled" HorizontalAlignment="Left" Height="85" CanContentScroll="True"> 
      <StackPanel x:Name="Film" Height="85" Width="Auto" Margin="0,0,0,0" Orientation="Horizontal" ScrollViewer.HorizontalScrollBarVisibility="Visible" CanHorizontallyScroll="True" ScrollViewer.VerticalScrollBarVisibility="Disabled" ScrollViewer.CanContentScroll="True" d:LayoutOverrides="TopPosition, BottomPosition"> 
       <StackPanel.Background> 
        <SolidColorBrush Color="{DynamicResource ButtonBackground}"/> 
       </StackPanel.Background> 
       <Grid Width="100" Background="Red"/> 
       <Grid Width="100" Background="#FFFF0051"/> 
       <Grid Width="100" Background="#FFB900FF"/> 
       <Grid Width="100" Background="#FF002EFF"/> 
       <Grid Width="100" Background="#FF00FFDC"/> 
       <Grid Width="100" Background="#FF51FF00"/> 
       <Grid Width="100" Background="Red"/> 
      </StackPanel> 
     </ScrollViewer> 
    </StackPanel> 

Answer 1

Actuellement, j'ai mon StackPanel avec une largeur automatique (et le problème est peut-être ici) qui contient des éléments comme des grilles.

Cette est votre problème. Un StackPanel mesure ses enfants avec un espace horizontal infini si sa propriété Orientation est définie sur Horizontal et espace vertical infini s'il est défini sur Vertical. Vous devrez donc spécifier une largeur explicite pour le StackPanel lui-même ou le ScrollViewer pour que cela fonctionne.

Vous pouvez également placer le ScrollViewer dans un Panel qui mesure ses enfants, comme par exemple un Grid (mais pas un StackPanel). Cela fonctionne par exemple:

<Window x:Class="WpfApplication1.Window1" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:local="clr-namespace:WpfApplication1" 
    mc:Ignorable="d" 
    Title="Window" Height="300" Width="300"> 
<Grid> 
    <ScrollViewer HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Disabled" HorizontalAlignment="Left" Height="85" CanContentScroll="True"> 
     <StackPanel x:Name="Film" Height="85" Width="Auto" Margin="0,0,0,0" Orientation="Horizontal" ScrollViewer.HorizontalScrollBarVisibility="Visible" CanHorizontallyScroll="True" ScrollViewer.VerticalScrollBarVisibility="Disabled" ScrollViewer.CanContentScroll="True" d:LayoutOverrides="TopPosition, BottomPosition"> 
      <StackPanel.Background> 
       <SolidColorBrush Color="Yellow"/> 
      </StackPanel.Background> 
      <Grid Width="100" Background="Red"/> 
      <Grid Width="100" Background="#FFFF0051"/> 
      <Grid Width="100" Background="#FFB900FF"/> 
      <Grid Width="100" Background="#FF002EFF"/> 
      <Grid Width="100" Background="#FF00FFDC"/> 
      <Grid Width="100" Background="#FF51FF00"/> 
      <Grid Width="100" Background="Red"/> 
     </StackPanel> 
    </ScrollViewer> 
</Grid> 
</Window> 

Mais cela ne pas parce que le StackPanel est considéré comme ayant une largeur infinie:

<StackPanel> 
    <ScrollViewer HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Disabled" HorizontalAlignment="Left" Height="85" CanContentScroll="True"> 
     <StackPanel x:Name="Film" Height="85" Width="Auto" Margin="0,0,0,0" Orientation="Horizontal" ScrollViewer.HorizontalScrollBarVisibility="Visible" CanHorizontallyScroll="True" ScrollViewer.VerticalScrollBarVisibility="Disabled" ScrollViewer.CanContentScroll="True" d:LayoutOverrides="TopPosition, BottomPosition"> 
      <StackPanel.Background> 
       <SolidColorBrush Color="Yellow"/> 
      </StackPanel.Background> 
      <Grid Width="100" Background="Red"/> 
      <Grid Width="100" Background="#FFFF0051"/> 
      <Grid Width="100" Background="#FFB900FF"/> 
      <Grid Width="100" Background="#FF002EFF"/> 
      <Grid Width="100" Background="#FF00FFDC"/> 
      <Grid Width="100" Background="#FF51FF00"/> 
      <Grid Width="100" Background="Red"/> 
     </StackPanel> 
    </ScrollViewer> 
</StackPanel> 

ScrollViewers Putting intérieur StackPanels est une mauvaise idée.

Answer 2

Vous devez mettre votre StackPanel dans un ScrollViewer comme celui-ci:

<ScrollViewer Height="85" VerticalAlignment="Bottom" Margin="0,0,200,15" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto"> 
    <StackPanel x:Name="Film" Orientation="Horizontal" > 
     <StackPanel.Background> 
      <SolidColorBrush Color="Black"/> 
     </StackPanel.Background> 
     <Grid Width="100" Background="Red"/> 
     <Grid Width="100" Background="#FFFF0051"/> 
     <Grid Width="100" Background="#FFB900FF"/> 
     <Grid Width="100" Background="#FF002EFF"/> 
     <Grid Width="100" Background="#FF00FFDC"/> 
     <Grid Width="100" Background="#FF51FF00"/> 
     <Grid Width="100" Background="Red"/> 
    </StackPanel> 
</ScrollViewer>