【发布时间】:2018-05-23 13:49:03
【问题描述】:
我有一个带有简单网格 (2x2) 的页面。在左下角的一个网格中是另一个网格,在这个网格内部是一个绑定到集合的ListView。可以将条目添加到集合中,以便 ListView 增加高度(ListView 的高度设置为自动,以便使用所有可用空间)。
我想要的是,如果使用了所有可用空间(从屏幕高度开始),ListView 的滚动条应该出现并且应该可用。有趣(不有趣)的事情是:滚动条确实出现了,但我无法使用它们,我无法使用悬停 ListView 时出现的垂直滚动条滚动 ListView。
当我将 ListView 的高度设置为固定值时,它可以工作,但我不希望这样,因为它不会使用屏幕上的所有可用空间。
这是页面的 XAML(出于演示目的,我删除了一些部分):
<Page
x:Class="Qooli.TimeTracker.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Qooli.TimeTracker"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Page.Resources>
...
</Page.Resources>
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
</Grid.ColumnDefinitions>
<StackPanel Name="spAddEntry" Grid.Row="0" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="30">
<TextBlock Text="Add new entry:" Name="lblAddNewEntry" />
...
</StackPanel>
<StackPanel Grid.Row="0" Grid.Column="1" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="30">
<TextBlock Text="Allocated time:" Name="lblAllocatedTime" />
...
</StackPanel>
<Grid Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="1" Margin="30">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Text="Daily overview:" Name="lblDailyOverview" Grid.Row="0" Grid.Column="0" />
<ListView Name="lvTimeEntries" Grid.Row="1" Grid.Column="0" HorizontalAlignment="Left"
Height="Auto"
MinHeight="100"
VerticalAlignment="Top"
MinWidth="300"
SelectionMode="Single"
ItemsSource="{x:Bind ViewModel.TimeEntriesAdvancedCollectionView, Mode=OneWay}"
ScrollViewer.VerticalScrollBarVisibility="Visible"
ScrollViewer.IsVerticalRailEnabled="True"
ScrollViewer.VerticalScrollMode="Enabled">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel></StackPanel>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate x:DataType="local:TimeEntry">
<Grid Background="{Binding Type, Converter={StaticResource TimeEntryTypeColorConverter}}" Padding="5">
<Grid.RowDefinitions>
<RowDefinition Height="200"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Text="{x:Bind Time, Mode=OneWay}" Style="{StaticResource TitleTextBlockStyle}"
MinWidth="60"
MaxWidth="60"
Grid.Row="0" Grid.Column="0">
</TextBlock>
<TextBlock Text="{x:Bind Title, Mode=OneWay}" Style="{StaticResource BodyTextBlockStyle}" Margin="5,0,0,0"
MinWidth="100"
MaxWidth="100"
Grid.Row="0" Grid.Column="1">
</TextBlock>
<Button Name="btnEditTimeEntry" Grid.Row="0" Grid.Column="2" Margin="5,5,5,5">
<SymbolIcon x:Name="edit" Symbol="Edit"/>
</Button>
<Button Name="btnDeleteTimeEntry" Grid.Row="0" Grid.Column="3" Margin="5,5,5,5">
<SymbolIcon x:Name="delete" Symbol="Delete"/>
</Button>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ListView>
</Grid>
<StackPanel Grid.Row="1" Grid.Column="1" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="30">
<TextBlock Style="{StaticResource summaryTextStyle}" Text="Start time:" Name="lblDayStartTime" />
...
</StackPanel>
</Grid>
</Page>
有人能看出它为什么会这样吗?
【问题讨论】:
-
网格行/单元格的高度设置为自动 -> 里面的所有东西都会得到它需要的所有空间。如果你有足够的空间,你为什么要滚动?
-
所以我应该为放置 ListView 的网格的行设置高度,或者也为其他网格(例如主 2x2 网格)设置高度?
-
将两个网格的第二行高度设置为“*”。
-
谢谢,通过将第二个网格行定义的高度设置为“*”,它现在按预期工作。你应该发布你的 cmets 作为答案,所以我可以接受它们作为答案。
-
很高兴能帮上忙。
标签: c# listview uwp scrollbar vertical-scrolling