如何用listview项创建wpf Carousel?

时间:2010-06-11 06:38:19

标签: wpf

我有横向wpf listview

 <ListView Name="indexList" ItemsSource="{Binding}" HorizontalAlignment="Stretch" VerticalAlignment="Top" BorderBrush="Transparent" Background="CadetBlue" Width="450">
                    <ListView.ItemsPanel>
                        <ItemsPanelTemplate>
                            <VirtualizingStackPanel Orientation="Horizontal"></VirtualizingStackPanel>
                        </ItemsPanelTemplate>
                    </ListView.ItemsPanel>
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"></RowDefinition>
                                    <RowDefinition Height="Auto"></RowDefinition>
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition></ColumnDefinition>
                                    <ColumnDefinition></ColumnDefinition>
                                </Grid.ColumnDefinitions>
                                <StackPanel Grid.Row="0" Grid.Column="0" Margin="0,0,0,0" HorizontalAlignment="Stretch" VerticalAlignment="Top">
                                    <TextBlock>
                               <ContentControl Content="{Binding Field1}" FontSize="10" Foreground="GhostWhite" FontWeight="Bold" HorizontalAlignment="Stretch" VerticalAlignment="Top"></ContentControl>
                                    </TextBlock>
                                </StackPanel>
                                <StackPanel Orientation="Horizontal" Grid.Row="2" Grid.Column="0" Margin="0,0,0,0" HorizontalAlignment="Stretch" VerticalAlignment="Bottom">
                                    <TextBlock>
                            <ContentControl Content="{Binding Field2}" FontSize="9" Foreground="Bisque" HorizontalAlignment="Stretch" VerticalAlignment="Bottom"></ContentControl>
                                    </TextBlock>
                                    <TextBlock>
                            <ContentControl Content="{Binding Field3}" FontSize="9" Foreground="Coral" HorizontalAlignment="Stretch" VerticalAlignment="Bottom"></ContentControl>
                                    </TextBlock>
                                </StackPanel>
                                <StackPanel Orientation="Vertical" Grid.Column="1" Grid.RowSpan="2" HorizontalAlignment="Stretch" VerticalAlignment="Center">
                                    <Separator></Separator>
                                </StackPanel>
                            </Grid>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>

我想滚动左/右按钮上的所有项目。 因此,当我点击Prev / Left按钮时,listview项目向左移动,在Right / Next按钮上单击listview项目向右移动。

与jQuery Carousel一样

1 个答案:

答案 0 :(得分:1)

单击上一个/上一个按钮时,请拨打ScrollViewer.LineLeft()

单击右/下一步按钮时,请拨打ScrollViewer.LineRight()

在ListView中访问ScrollViewer的最简单方法是自上而下搜索可视树,例如:

var scrollViewer = SearchVisualTree<ScrollViewer>(listView);

private T SearchVisualTree<T>(Visual vis) where T:Visual
{
  if(vis==null) return null;
  var range = Enumerable.Range(0, VisualTreeHelper.GetChildrenCount(vis));
  return (
    from i in range
    let child = VisualTreeHelper.GetChild(vis, i) as T
    where child!=null
    select child
  ).Concat(
    from j in range
    let descendant = SearchVisualTree<T>(VisualTreeHelper.GetChild(vis, j) as Visual)
    where descendant!=null
    select descendant
  ).FirstOrDefault();
}