listview - UWP ListView 不垂直滚动
问题描述
ListView
在a 中添加 a 后Grid
,由于某种原因它不会垂直滚动。我把ListView
里面放了,ScrollViewer
然后又拿出来了,还是没什么区别。需要做些什么来解决这个问题并添加一个垂直滚动条,以便用户知道所有内容都无法适应他们的屏幕?
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="0">
<TextBlock x:Uid="Header" Style="{StaticResource HeaderTextBlockStyle}" />
<TextBlock Text="SubHeader" Style="{StaticResource SubheaderTextBlockStyle}"/>
</StackPanel>
<ListView Grid.Row="1"
ItemsSource="{x:Bind listItems}"
SelectionChanged="ListView_SelectionChanged">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Title}"
Style="{StaticResource TitleTextBlockStyle}" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
更新
<Page
x:Class="MyApp.ContactPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel Grid.Row="0">
<TextBlock x:Uid="Header" Style="{StaticResource HeaderTextBlockStyle}" />
<TextBlock Text="SubHeader" Style="{StaticResource SubheaderTextBlockStyle}"/>
</StackPanel>
<ListView
Grid.Row="1"
ItemsSource="{x:Bind listItems}"
SelectionChanged="ListView_SelectionChanged">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Title}"
Style="{StaticResource TitleTextBlockStyle}" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
</Page>
解决方案
问题是您将第二行ListView
的高度设置为Auto
,这意味着它将拉伸到最大高度,以显示其内容。如果你有足够长的屏幕,你可以看到结果。
但是我们通常不会将ListView
/GridView
的高度设置为Auto
,我们可以将其高度设置为固定值。或者您可以使用 * 代替。* 表示它将是您的窗口高度的其余部分。所以你可以像这样改变你的代码。
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
如上面的代码所示,第一行将自动拉伸其高度,第二行将占用其余的窗口高度。
您还可以设置更多 *.
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
上面的代码显示第二行和第三行各占其余高度的一半。
推荐阅读
- java - Android:如何优化从 firebase 获取数据?
- python-3.x - Python请求发送两次
- android - 如何解决混合支持库版本
- jquery - jquery动画搜索栏运动
- javascript - 重新排序对象数组中的元素
- angular - 在Angular2中,如何使用resolve和promise在应用程序路由渲染页面之前等待从服务器加载数据
- php - cURL 输出中的“local_ip”和“primary_ip”是什么意思?
- java - 从 yaml 文件中读取整数列表
- python - python3计算PI的N位数 python剪切长数
- azure - Azure 应用注册更改/切换目录