WPF水平列表框垂直填充

时间:2016-12-13 22:52:42

标签: c# wpf listbox

我正在列出在水平滚动的列表框中显示的产品列表。我有列表水平滚动但是我只获得1行项目,即使列表框足够高,可以在开始水平滚动之前填充2行。

我的部分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

任何帮助都会很棒。

2 个答案:

答案 0 :(得分:2)

用作ItemsPanel的WrapPanel必须具有垂直方向,并且ListBox不能垂直滚动:

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

答案 1 :(得分: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>