带有可选分页的自定义 ItemsControl

Custom ItemsControl with optional Paging

我有一个稍微特别的要求;-)

我想开发一个带有 "Previous" 控件和 "Next" 控件的 ItemsControl。像这样绑定到任意 ViewModel:

<controls:PagedItemsControl ItemsSource="{Binding Items}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <UniformGrid Columns="5" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate DataType="system:String">
            <Border Background="Gray" Margin="5">
                <TextBlock Text="{Binding}" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Center" />
            </Border>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
    <controls:PagedItemsControl.PreviousControl>
        <Button Content="Previous" Command="{Binding PreviousCommand}" />
    </controls:PagedItemsControl.PreviousControl>
    <controls:PagedItemsControl.NextControl>
        <Button Content="Next" Command="{Binding NextCommand}" />
    </controls:PagedItemsControl.NextControl>
</controls:PagedItemsControl>

在示例中,我传递了 2 个由 ViewModel 命令控制的按钮。如果有人能告诉我如何收听 Control.IsEnable 状态并在启用时将 PreviousControl 显示为第一项,在启用时将 NextControl 显示为最后一项,那就太棒了。

谢谢

看看下面的XAML。我们无法在使用 ItemsSource 时向 ItemsPanel 添加元素。但是我们可能会尝试构建一个由 ItemsSource 和其他元素组成的棘手集合。不幸的是,CollectionContainer 无法直接绑定到 Items。幸运的是,好心人已经为这种情况找到了 solution

<Grid>
    <Grid.Resources>
        <BooleanToVisibilityConverter x:Key="BoolToVisibilityConverter"/>
    </Grid.Resources>
    <TextBlock Name="TrickyBinder"
                Tag="{Binding Items}"
                Visibility="Collapsed"/>
    <ItemsControl>
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <UniformGrid Columns="5" />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate DataType="system:String">
                <Border Background="Gray" Margin="5">
                    <TextBlock Text="{Binding}" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Center" />
                </Border>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
        <ItemsControl.ItemsSource>
            <CompositeCollection>
                <CollectionContainer>
                    <CollectionContainer.Collection>
                        <col:ArrayList>
                            <Button Content="Previous" Command="{Binding PreviousCommand}" Visibility="{Binding Path=IsEnabled,RelativeSource={RelativeSource Self},Converter={StaticResource BoolToVisibilityConverter}}" />
                        </col:ArrayList>
                    </CollectionContainer.Collection>
                </CollectionContainer>
                <CollectionContainer Collection="{Binding Path=Tag,Source={x:Reference TrickyBinder}}"/>
                <CollectionContainer>
                    <CollectionContainer.Collection>
                        <col:ArrayList>
                            <Button Content="Next" Command="{Binding NextCommand}" Visibility="{Binding Path=IsEnabled,RelativeSource={RelativeSource Self},Converter={StaticResource BoolToVisibilityConverter}}" />
                        </col:ArrayList>
                    </CollectionContainer.Collection>
                </CollectionContainer>
            </CompositeCollection>
        </ItemsControl.ItemsSource>
    </ItemsControl>
</Grid>

希望对您有所帮助!