1

我在我的页面中编写了以下代码:

<StackPanel HorizontalAlignment="Left" Height="166" Margin="10,602,0,0" VerticalAlignment="Top" Width="1346" x:Name="thumbnailViewer">
               <ScrollViewer
                x:Name="thumbnailViewerScroller"
                Padding="0"
                BorderThickness="0"
                VerticalScrollBarVisibility="Hidden"
                HorizontalScrollBarVisibility="Hidden">
                    <StackPanel Orientation="Horizontal" >
                        <ItemsControl x:Name="UserList">
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <!--<StackPanel Orientation="Horizontal">-->
                                        <Image Source="{Binding imageurl}" Tag="{Binding Path=id}" Width="164" Height="150" Margin="4" Stretch="Fill"></Image>
                                    <!--</StackPanel>-->
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </StackPanel>
</ScrollViewer>
</StackPanel>

在滚动查看器内部,我提到了堆栈面板并将项目对齐为水平。但是在运行代码时我总是将项目对齐为垂直。请告诉我如何将项目对齐为水平?我的代码中有什么问题为什么项目是即使我在 stackpanel 中提到 Orientation="Horizo​​ntal 也可以垂直对齐。

编辑:

<ScrollViewer
                x:Name="thumbnailViewerScroller"
                Padding="0"
                BorderThickness="0"
                VerticalScrollBarVisibility="Hidden"
                HorizontalScrollBarVisibility="Hidden">
                    <!--<StackPanel Orientation="Horizontal" >-->
                        <ItemsControl x:Name="UserList">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <!--<DataTemplate>-->
                                    <StackPanel Orientation="Horizontal">
                                        <Image Source="{Binding imageurl}" Tag="{Binding Path=id}" Width="164" Height="150" Margin="4" Stretch="Fill"></Image>
                                    </StackPanel>
                                <!--</DataTemplate>-->
                                    </ItemsPanelTemplate>
                                        </ItemsControl.ItemsPanel>
                        </ItemsControl>
</Scrollviewer>
</Stackpanel>
4

1 回答 1

2

改用ItemsPanelof ItemsControl

<ScrollViewer>
   <ItemsControl ...>
      <ItemsControl.ItemsPanel>
         <ItemsPanelTemplate>
             <StackPanel Orientation="Horizontal" />
         </ItemsPanelTemplate>
      </ItemsControl.ItemsPanel>
      <ItemsControl.ItemTemplate>
         <DataTemplate>
            <Image Source="{Binding imageurl}" 
                   Tag="{Binding Path=id}" Width="164" Height="150" 
                   Margin="4" Stretch="Fill"></Image>

         </DataTemplate>
      </ItemsControl.ItemTemplate>
    </ItemsControl>
</ScrollViewer>
于 2013-07-31T10:38:32.323 回答