英文:
Dynamically Setting ScrollViewer Height
问题
我目前正在开发一个WinUI 3应用程序,并尝试在一个ScrollViewer上方和下方都有一个StackPanel,这两个StackPanel应该始终可见(不受屏幕大小或ScrollViewer中的元素影响):
<Grid Margin="30,30,30,30">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>>
<StackPanel Orientation="Horizontal" Grid.Row="0">
<TextBlock Name="projectNumber" Text="项目编号" Width="100" Margin="10,10,10,10" TextAlignment="Center"/>
<TextBlock Name="taskName" Text="任务" Width="750" Margin="10,10,10,10" TextAlignment="Center"/>
<TextBlock Name="dueDate" Text="截止日期" Width="100" Margin="10,10,10,10" TextAlignment="Center"/>
<TextBlock Name="assignedBy" Text="指派者" Width="100" Margin="10,10,10,10" TextAlignment="Center"/>
</StackPanel>
<Line Name="dividerLine" Stroke="DimGray" X1="0" Y1="0" X2="1130" Y2="0" Grid.Row="1"/>
<ScrollViewer Name="scrollViewer" Grid.Row="2">
<StackPanel>
<ListView Name="tasksPanel" VerticalAlignment="Top" HorizontalAlignment="Left"/>
<ListView Name="completeTasksPanel" VerticalAlignment="Top" HorizontalAlignment="Left"/>
</StackPanel>
</ScrollViewer>
<StackPanel Orientation="Horizontal" Margin="0,10,0,10" Grid.Row="3">
<TextBox/>
<TextBox/>
<TextBox/>
</StackPanel>
</Grid>
然而,ScrollViewer元素的高度似乎不会根据屏幕大小而设置,而是会占用与其中元素相等的空间。我还尝试了将Grid.RowDefinitions的高度设置为固定值而不是"Auto",但没有任何变化:
<RowDefinition Height="50"/>
<RowDefinition Height="3"/>
<RowDefinition Height="*"/>
<RowDefinition Height="50"/>
英文:
I'm currently working on a WinUI 3 app, and I'm trying to have a StackPanel above and below a ScrollViewer which will always be visible (not depending on the size of the screen or the elements in the ScrollViewer):
<Grid Margin="30,30,30,30">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<StackPanel Orientation="Horizontal" Grid.Row="0">
<TextBlock Name="projectNumber" Text="Project Number" Width="100" Margin="10,10,10,10" TextAlignment="Center"/>
<TextBlock Name="taskName" Text="Task" Width="750" Margin="10,10,10,10" TextAlignment="Center"/>
<TextBlock Name="dueDate" Text="Due Date" Width="100" Margin="10,10,10,10" TextAlignment="Center"/>
<TextBlock Name="assignedBy" Text="Assigned By" Width="100" Margin="10,10,10,10" TextAlignment="Center"/>
</StackPanel>
<Line Name="dividerLine" Stroke="DimGray" X1="0" Y1="0" X2="1130" Y2="0" Grid.Row="1"/>
<ScrollViewer Name="scrollViewer" Grid.Row="2">
<StackPanel>
<ListView Name="tasksPanel" VerticalAlignment="Top" HorizontalAlignment="Left"/>
<ListView Name="completeTasksPanel" VerticalAlignment="Top" HorizontalAlignment="Left"/>
</StackPanel>
</ScrollViewer>
<StackPanel Orientation="Horizontal" Margin="0,10,0,10" Grid.Row="3">
<TextBox/>
<TextBox/>
<TextBox/>
</StackPanel>
</Grid>
However, the ScrollViewer element won't have its height set according to the screen, instead, it will take up as much space as the elements inside. I also tried setting the Grid.RowDefinitions with a set height instead of Auto, but it made no difference:
<RowDefinition Height="50"/>
<RowDefinition Height="3"/>
<RowDefinition Height="*"/>
<RowDefinition Height="50"/>
答案1
得分: 1
你应该将ScrollViewer中的StackPanel替换为另一个不会使用无限垂直空间来测量其子元素的Panel,例如一个Grid:
<ScrollViewer Name="scrollViewer" Grid.Row="2">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<ListView Name="tasksPanel" VerticalAlignment="Top" HorizontalAlignment="Left"/>
<ListView Grid.Row="1" Name="completeTasksPanel" VerticalAlignment="Top" HorizontalAlignment="Left"/>
</Grid>
</ScrollViewer>
另一种选择是为StackPanel指定固定的高度。
由于后者(StackPanel)具有无限测量特性,因此ScrollViewers和StackPanels不太适合一起使用。
英文:
You should replace the StackPanel in the ScrollViewer with another Panel that doesn't measure its child elements with infinite vertical space, such as for example a Grid:
<ScrollViewer Name="scrollViewer" Grid.Row="2">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<ListView Name="tasksPanel" VerticalAlignment="Top" HorizontalAlignment="Left"/>
<ListView Grid.Row="1" Name="completeTasksPanel" VerticalAlignment="Top" HorizontalAlignment="Left"/>
</Grid>
</ScrollViewer>
The other option is to specify a fixed height for the StackPanel.
ScrollViewers and StackPanels don't work very well together because of the (infinite measurement) characteristics of the latter.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。


评论