2016-12-13 164 views
0

我正在製作一個顯示在水平滾動的列表框中的產品列表。我有列表水平滾動,但我只獲得1行的項目,即使列表框高到足以填充2行,然後開始水平滾動。WPF水平列表框垂直填充

我的WPF代碼的一部分。

<DataTemplate x:Key="productTemplate"> 
    <WrapPanel Orientation="Horizontal" Width="10" Height="10"> 
      <Image Source="{Binding Photo}" Stretch="Fill" HorizontalAlignment="Center" VerticalAlignment="Center" Width="288" Height="320"/> 
      <Label Content="{Binding Name}" /> 
      <Label Content="{Binding Cost}" /> 
    </WrapPanel> 
</DataTemplate> 

<ListBox Width="1334" ItemsSource="{Binding Products}" SelectedItem="{Binding SelectedProduct}" ItemTemplate="{DynamicResource productTemplate}" Height="865" ScrollViewer.HorizontalScrollBarVisibility="Hidden" ScrollViewer.VerticalScrollBarVisibility="Disabled" BorderThickness="0"> 
    <ListBox.Background> 
     <SolidColorBrush Color="White" Opacity="0.85"/> 
    </ListBox.Background> 
    <ListBox.ItemsPanel> 
     <ItemsPanelTemplate> 
      <WrapPanel IsItemsHost="True" /> 
     </ItemsPanelTemplate> 
    </ListBox.ItemsPanel> 
</ListBox> 

我在尋找:enter image description here

任何幫助將是巨大的。

回答

1

被用作ItemsPanel必須垂直方向,並列表框不能垂直滾動WrapPanel:

<ListBox ScrollViewer.VerticalScrollBarVisibility="Disabled" ...> 
    <ListBox.ItemsPanel> 
     <ItemsPanelTemplate> 
      <WrapPanel Orientation="Vertical" /> 
     </ItemsPanelTemplate> 
    </ListBox.ItemsPanel> 
    ... 
</ListBox> 
+0

媽逮到它,我是如此接近嘗試此¬¬乾杯(Y) – Sjc311

0

也許下面的代碼將幫助你。以下代碼將幫助您按以下方式綁定圖像。

enter image description here

<ListBox Grid.Column="1" ItemsSource="{Binding Items}" Name="detailList" ScrollViewer.HorizontalScrollBarVisibility="Disabled"> 
    <ListBox.ItemsPanel> 
     <ItemsPanelTemplate> 
      <WrapPanel Orientation="Horizontal"></WrapPanel> 
     </ItemsPanelTemplate> 
    </ListBox.ItemsPanel> 

    <ListBox.ItemTemplate> 
     <DataTemplate> 
      <StackPanel Orientation="Vertical" Width="90"> 
       <Image Width="80" Source="{Binding Type, 
        Converter={x:Static local:HeaderToImageConverter.Instance}}"/> 
       <TextBlock FontSize="11" Text="{Binding Name}" VerticalAlignment="Center"/> 
      </StackPanel> 
     </DataTemplate> 
    </ListBox.ItemTemplate> 
</ListBox>