如何使网格列在 Metro 应用程序中水平滚动?
How to make a grid column scroll horizontally in metro apps?
我有一个网格列,其中有一个列表视图。我从另一列中的表单填充它。在表单中输入的值将保存到列表中。我希望该列表显示在列表视图中。当在表单中输入的文本增加时,剩余的值就会消失。我希望该列水平滚动,这样值就不会消失。
这是我目前尝试过的..
<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>
有人请帮我做这个。
感谢任何形式的帮助....
您尝试过 w/o 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>
祝你好运:)
我有一个网格列,其中有一个列表视图。我从另一列中的表单填充它。在表单中输入的值将保存到列表中。我希望该列表显示在列表视图中。当在表单中输入的文本增加时,剩余的值就会消失。我希望该列水平滚动,这样值就不会消失。
这是我目前尝试过的..
<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>
有人请帮我做这个。
感谢任何形式的帮助....
您尝试过 w/o 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>
祝你好运:)