带有水平ListViews的C#UWP ListView

时间:2018-10-29 13:30:16

标签: c# listview scroll uwp direction

我有一个垂直的ListView。它承载多个水平ListView。

示例:

<ListView ScrollViewer.HorizontalScrollMode="Disabled" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollMode="Enabled" ScrollViewer.VerticalScrollBarVisibility="Hidden">
    <ListView ScrollViewer.HorizontalScrollMode="Enabled" ScrollViewer.HorizontalScrollBarVisibility="Hidden">
            <ListView.ItemsPanel>
                    <ItemsPanelTemplate>
                            <ItemsWrapGrid Orientation="Vertical" MaximumRowsOrColumns="1"/>
                    </ItemsPanelTemplate>
            </ListView.ItemsPanel>
            <Grid Width="50" Height="50" Background="Green"/>
            <Grid Width="50" Height="50" Background="Green"/>
            <Grid Width="50" Height="50" Background="Green"/>
            <Grid Width="50" Height="50" Background="Green"/>
            <Grid Width="50" Height="50" Background="Green"/>
            <Grid Width="50" Height="50" Background="Green"/>
            <Grid Width="50" Height="50" Background="Green"/>
    </ListView>
    <ListView ScrollViewer.HorizontalScrollMode="Enabled" ScrollViewer.HorizontalScrollBarVisibility="Hidden">
            <ListView.ItemsPanel>
                    <ItemsPanelTemplate>
                            <ItemsWrapGrid Orientation="Vertical" MaximumRowsOrColumns="1"/>
                    </ItemsPanelTemplate>
            </ListView.ItemsPanel>
            <Grid Width="50" Height="50" Background="Green"/>
            <Grid Width="50" Height="50" Background="Green"/>
            <Grid Width="50" Height="50" Background="Green"/>
            <Grid Width="50" Height="50" Background="Green"/>
            <Grid Width="50" Height="50" Background="Green"/>
            <Grid Width="50" Height="50" Background="Green"/>
            <Grid Width="50" Height="50" Background="Green"/>
    </ListView>
</ListView>

现在滚动根本不起作用,只能通过触摸进行操作。

我需要使用鼠标滚轮进行滚动以使其只能在垂直方向上工作,并进行操纵以保持其当前状态(垂直和水平方向)。

我在这里做什么错了?

1 个答案:

答案 0 :(得分:0)

对于水平ListView,您可以编辑默认的ItemsPanelTemplate并将Orientation设置为Horizontal,然后将crollViewer.HorizontalScrollMode设置为Enabled。您也可以直接使用以下水平ListView样式。我已经按照您的代码进行了测试,该样式有效。

<Style x:Key="MyListViewStyle" TargetType="ListView">
    <Setter Property="IsTabStop" Value="False"/>
    <Setter Property="TabNavigation" Value="Once"/>
    <Setter Property="IsSwipeEnabled" Value="True"/>
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Disabled"/>
    <Setter Property="ScrollViewer.IsHorizontalRailEnabled" Value="False"/>
    <Setter Property="ScrollViewer.VerticalScrollMode" Value="Enabled"/>
    <Setter Property="ScrollViewer.IsVerticalRailEnabled" Value="True"/>
    <Setter Property="ScrollViewer.ZoomMode" Value="Disabled"/>
    <Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False"/>
    <Setter Property="ScrollViewer.BringIntoViewOnFocusChange" Value="True"/>
    <Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}"/>
    <Setter Property="ItemContainerTransitions">
        <Setter.Value>
            <TransitionCollection>
                <AddDeleteThemeTransition/>
                <ContentThemeTransition/>
                <ReorderThemeTransition/>
                <EntranceThemeTransition IsStaggeringEnabled="False"/>
            </TransitionCollection>
        </Setter.Value>
    </Setter>
    <Setter Property="ItemsPanel">
        <Setter.Value>
            <ItemsPanelTemplate>
                <VirtualizingStackPanel 
                    Orientation="Horizontal"  
                    VerticalAlignment="Top"
                    ScrollViewer.HorizontalScrollMode="Enabled"
                    ScrollViewer.VerticalScrollMode="Disabled"
                    />
            </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ListView">
                <Border Background="{TemplateBinding Background}" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}">
                    <ScrollViewer x:Name="ScrollViewer" AutomationProperties.AccessibilityView="Raw" 
                                  BringIntoViewOnFocusChange="{TemplateBinding ScrollViewer.BringIntoViewOnFocusChange}" 
                                  HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" 
                                  HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" 
                                  IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" 
                                  IsVerticalScrollChainingEnabled="{TemplateBinding ScrollViewer.IsVerticalScrollChainingEnabled}" 
                                  IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" 
                                  IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" 
                                  IsHorizontalScrollChainingEnabled="{TemplateBinding ScrollViewer.IsHorizontalScrollChainingEnabled}"
                                  TabNavigation="{TemplateBinding TabNavigation}" 
                                  VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" 
                                  VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" 
                                  ZoomMode="{TemplateBinding ScrollViewer.ZoomMode}">
                        <ItemsPresenter Footer="{TemplateBinding Footer}" 
                                        FooterTransitions="{TemplateBinding FooterTransitions}"
                                        FooterTemplate="{TemplateBinding FooterTemplate}"
                                        Header="{TemplateBinding Header}" 
                                        HeaderTransitions="{TemplateBinding HeaderTransitions}" 
                                        HeaderTemplate="{TemplateBinding HeaderTemplate}"
                                        Padding="{TemplateBinding Padding}"/>
                    </ScrollViewer>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>