wpf 将 ItemsControl 绑定到 ScrollViewer

Binding ItemsControl to ScrollViewer

提问by user13657

At the begining I'll show some code:

一开始我会展示一些代码：

private ObservableCollection<otwarteBezStolika> otwarteBezStolika = new ObservableCollection<otwarteBezStolika>();

        public ObservableCollection<otwarteBezStolika> listunia
        {
            get { return otwarteBezStolika; }
            set { otwarteBezStolika = value; }
        }
    }
    public class otwarteBezStolika
    {
        public string number { get; set; }
        public string date { get; set; }
        public int orderID { get; set; }
        public decimal price { get; set; }
        public decimal priceR { get; set; }
        public string opisRach { get; set; }
        public string sum { get; set; }
    }

And now in xaml:

现在在 xaml 中：

<Window.Resources>
    <DataTemplate x:Key="dataTempl">
        <Border BorderBrush="Coral" BorderThickness="1" Width="170">
            <Button Name="goToPOS" Tag="{Binding orderID}" Click="goToPOS_Click" Style="{StaticResource TabCloseButtonStyle}" Margin="1">
                <StackPanel>
                    <Label Content="{Binding number}" HorizontalAlignment="Center" FontSize="15" FontWeight="ExtraBold" HorizontalContentAlignment="Center"></Label>
                    <Border BorderBrush="Turquoise" BorderThickness="1" Width="170"></Border>
                    <Label Content="{Binding date}" FontSize="12" HorizontalAlignment="Center"></Label>
                    <TextBlock Text="{Binding opisRach}" FontStyle="Italic" FontSize="12" Foreground="Black" TextAlignment="Center" TextWrapping="Wrap" Margin="0,0,0,2"></TextBlock>
                    <Border BorderBrush="WhiteSmoke" BorderThickness="1" Width="170"></Border>
                    <Label Content="{Binding sum}" FontSize="19" HorizontalAlignment="Center"></Label>
                </StackPanel>
            </Button>
        </Border>
    </DataTemplate>

    <DataTemplate x:Key="mainTemplate">
        <StackPanel>

            <ItemsControl x:Name="imageContent" ItemsSource="{Binding listunia}" ItemTemplate="{StaticResource dataTempl}" >
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <WrapPanel Orientation="Horizontal" ScrollViewer.HorizontalScrollBarVisibility="Disabled" />
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
            </ItemsControl>
        </StackPanel>
    </DataTemplate>
</Window.Resources>

Grid:

网格：

<Grid Grid.Row="0">
        <ScrollViewer VerticalScrollBarVisibility="Auto">
            <ItemsControl Name="templ" ItemsSource="{Binding ElementName=UI, Path=listunia }" ItemTemplate="{StaticResource mainTemplate}" />
        </ScrollViewer>
    </Grid>

Problem is that I cannot see any item (I'm filling items using sqldatareader, and adding them to list - by the way, does DataTable will also work? So instead while(rdr.Read()) i could ouse SqlDataAdapter sda and sda.fill(Datatable))

问题是我看不到任何项目（我正在使用 sqldatareader 填充项目，并将它们添加到列表中 - 顺便说一下，DataTable 也可以工作吗？所以 while(rdr.Read()) 我可以使用 SqlDataAdapter sda 和 sda .fill(数据表))

Second problem is that, it does work when I put "dataTempl" inside scrollviewer ,like :

第二个问题是，当我将“dataTempl”放入 scrollviewer 时它确实有效，例如：

<Grid Grid.Row="0">
        <ScrollViewer VerticalScrollBarVisibility="Auto">
            <ItemsControl Name="templ" ItemsSource="{Binding ElementName=UI, Path=listunia }" ItemTemplate="{StaticResource dataTempl}" />
        </ScrollViewer>
    </Grid>

but items are show vertically, but I need to see them from left to right horizontal.

但项目是垂直显示的，但我需要从左到右水平查看它们。

Thanks for answers!

感谢您的回答！

回答by Nitin

Try doing this.. you dont need maintemplate.

尝试这样做.. 你不需要主模板。

<ScrollViewer VerticalScrollBarVisibility="Auto">
  <ItemsControl Name="templ" ItemsSource="{Binding ElementName=UI, Path=listunia }" ItemTemplate="{StaticResource dataTempl}">
    <ItemsControl.ItemsPanel>
          <ItemsPanelTemplate>
               <StackPanel Orientation="Vertical" ScrollViewer.HorizontalScrollBarVisibility="Disabled" />
           </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
  </ItemsControl>
</ScrollViewer>

OR you can simply use:

或者你可以简单地使用：

  <ListBox Name="templ" ItemsSource="{Binding ElementName=UI, Path=listunia }" ItemTemplate="{StaticResource dataTempl}">
  </ListBox>

回答by Shahid Siddique

This will be displayed in a monospaced font. The first four spaces

这将以等宽字体显示。前四个空格

<ScrollViewer VerticalScrollBarVisibility="Auto">
        <ItemsControl Name="kaloo" DisplayMemberPath="Name" ss:DragDrop.IsDragSource="True" ss:DragDrop.IsDropTarget="True"  >
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
 </ScrollViewer>