如何在metro应用程序中使网格列水平滚动

本文关键字:网格 水平 滚动 metro 应用程序 | 更新日期: 2023-09-27 18:27:39

我有一个Grid列,其中有一个列表视图。我正在从另一列中的表单中填充它。在表单中输入的值将保存到列表中。我希望该列表显示在列表视图中。当表单中输入的文本增加时,剩余值将消失。我希望该列水平滚动,这样值就不会消失。

这就是我迄今为止所尝试的。。

<Grid Grid.Column="2" Margin="0,0,46,10" ScrollViewer.HorizontalScrollBarVisibility="Visible">
                <ScrollViewer HorizontalScrollMode="Auto"  HorizontalScrollBarVisibility="Auto" VerticalScrollMode="Disabled" VerticalScrollBarVisibility="Hidden" Margin="0,0,-60,10">
                <ListView x:Name="lsvLessons" IsItemClickEnabled="True" ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.VerticalScrollMode="Enabled" ScrollViewer.HorizontalScrollBarVisibility="Auto" BorderThickness="1" SelectionMode="Multiple" ItemsSource="{Binding Source={StaticResource cvsLessons}}" Margin="7,0,62,0">
                    <ListView.ItemsPanel>
                        <ItemsPanelTemplate>
                            <WrapGrid Orientation="Vertical" HorizontalChildrenAlignment="left"/>
                        </ItemsPanelTemplate>
                    </ListView.ItemsPanel>
                    <ListView.ItemContainerStyle>
                        <Style TargetType="ListViewItem">
                            <Setter Property="Padding" Value="0"/>
                            <Setter Property="Margin" Value="-12"/>
                        </Style>
                    </ListView.ItemContainerStyle>
                    <ListView.ItemTemplate>
                        <DataTemplate >
                            <StackPanel Orientation="Horizontal" Width="375" Height="20" Background="Transparent" HorizontalAlignment="Left">
                                <StackPanel Width="230" VerticalAlignment="Center" Margin="15,5,0,0">
                                    <TextBlock Text="{Binding Name}" Foreground="white" FontSize="14" Margin="0,3,0,0" FontWeight="Normal"  VerticalAlignment="Center" HorizontalAlignment="Left"/>
                                </StackPanel>
                            </StackPanel>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>
                </ScrollViewer>
            </Grid> 

有人请帮我做这个。

任何形式的帮助都将不胜感激。。。。

如何在metro应用程序中使网格列水平滚动

您是否尝试在没有ScrollViewer控件的情况下执行此操作?和启用水平滚动模式?

试试这个:

<Grid Grid.Column="2" Margin="0,0,46,10" ScrollViewer.HorizontalScrollBarVisibility="Visible">
                           <ListView x:Name="lsvLessons" IsItemClickEnabled="True" ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.VerticalScrollMode="Enabled" ScrollViewer.HorizontalScrollBarVisibility="Auto" BorderThickness="1" SelectionMode="Multiple" ItemsSource="{Binding Source={StaticResource cvsLessons}}" Margin="7,0,62,0"  ScrollViewer.HorizontalScrollMode="Enabled"   >
                <ListView.ItemsPanel>
                    <ItemsPanelTemplate>
                        <WrapGrid Orientation="Vertical" HorizontalChildrenAlignment="left"/>
                    </ItemsPanelTemplate>
                </ListView.ItemsPanel>
                <ListView.ItemContainerStyle>
                    <Style TargetType="ListViewItem">
                        <Setter Property="Padding" Value="0"/>
                        <Setter Property="Margin" Value="-12"/>
                    </Style>
                </ListView.ItemContainerStyle>
                <ListView.ItemTemplate>
                    <DataTemplate >
                        <StackPanel Orientation="Horizontal" Width="375" Height="20" Background="Transparent" HorizontalAlignment="Left">
                            <StackPanel Width="230" VerticalAlignment="Center" Margin="15,5,0,0">
                                <TextBlock Text="{Binding Name}" Foreground="white" FontSize="14" Margin="0,3,0,0" FontWeight="Normal"  VerticalAlignment="Center" HorizontalAlignment="Left"/>
                            </StackPanel>
                        </StackPanel>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </Grid>  

添加ScrollViewer.HorizontalScrollMode="Enabled"&正在删除ScrollViewer控件。。

更新:

您可以在不使用列的情况下实现这一点。。这是我的尝试:

<Grid x:Name="rootGrid">
            <ScrollViewer HorizontalScrollMode="Enabled" >
                <StackPanel Orientation="Horizontal" >

                    <Grid x:Name="form" >
                        <!-- your form here.. -->
                    </Grid>
                    <Grid x:Name="list" >
                        <!-- your listview here.. -->
                    </Grid>
                </StackPanel>
            </ScrollViewer>
        </Grid>

祝你好运:)