首页 文章

WPF，让verticalstretch按预期工作！

提问于
浏览 次
7

我试图使垂直拉伸按预期工作在WPF中，但由于某种原因它只需要它所需的空间，而不是可用的空间 .

首先，我使用的是带有C＃和Prism的WPF .

在Shell.xaml（应用程序的主要xaml）中，我有一个包含2列和一行的网格 . 我们的想法是拥有一个侧面板和一个主应用区域 . 主应用程序区域网格设置为“自动宽度”和“自动高度” . 这是按预期工作的，并且它可以缩放以适应整个应用程序的高度和宽度 .

然后我使用prism将视图（作为UserControl组件）插入主应用程序区域 . UserControl也设置为自动宽度和高度，通过查看Expression Blend中的默认设置，HorizontalAlignment和VerticalAlignment设置为拉伸！

但是，装载了棱镜的UserControl只能以宽度拉伸而不是高度！通过为背景颜色提供视觉反馈，我可以看到它只需要根据需要的垂直空间，而不是整个区域可用！

这可能是什么解决方案？我试过通过所有设置手动覆盖它们到宽度和高度自动，水平和垂直对齐拉伸，但似乎没有任何工作按预期！

一些代码：（Shell.xaml）

<Window Height="1140" Width="1450">
    <Grid Margin="0" Background="White">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="250" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <Grid Background="#FFEEEEEE" Grid.Column="0" Grid.Row="0">   
            </Grid>          
            <ItemsControl Width="Auto" Height="Auto" Grid.Row="0" Grid.Column="1" Name="MainRegion" cal:RegionManager.RegionName="MainRegion" Padding="10" Margin="10, 0, 0, 0" Background="#FFFFFFD5" />
        </Grid>
    </Grid>
</Window>

（视图应该继承父高度）：

<UserControl Width="Auto" Height="Auto" Background="Red" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
     <!-- I want this to take the full width and height of the parent -->
</UserControl>

那么这是视图加载到主xaml中的方式的限制，还是这是UserControl限制，还是我不理解的其他内容？

只是为了澄清;我确实看到Shell.xaml中定义的ItemsControl的背景颜色同时拉伸水平和垂直，但不是加载到ItemsControl中的视图的背景 .

请注意，我删除了一些xaml，以便更容易理解！

谢谢！

wpf xaml prism

3 回答

  • 1

    ItemsControl.ItemsPanelTemplate 的默认值为 StackPanel ，它会垂直压缩所有子项，并给出您描述的症状 .

    解决方案code-zoop将此更改为 <Grid> . 只要该区域只能有一个视图，这将很有效 . 但如果该地区有多个视图，它们将全部放在彼此之上，而不是彼此相邻 .

    如果您想要一个可以处理多个视图但允许视图拉伸到该区域的完整大小的区域，请使用 DockPanel 代替：

    <ItemsControl>
  <ItemsControl.ItemsPanel>
    <ItemsPanelTemplate>
      <DockPanel />
    </ItemsPanelTemplate>
  </ItemsControl.ItemsPanel>
</ItemsControl>

    这会将第一个视图放在左侧的面板中，下一个放在旁边，依此类推，直到最后一个视图将填满所有剩余的空间 .

    如果您希望像StackPanel那样垂直堆叠多个视图，则必须在ItemContainerStyle中进行设置：

    <ItemsControl>
  <ItemsControl.ItemsPanel>
    <ItemsPanelTemplate>
      <DockPanel />
    </ItemsPanelTemplate>
  </ItemsControl.ItemsPanel>
  <ItemsControl.ItemContainerStyle>
    <Style>
      <Setter Property="DockPanel.Dock" Value="Top" />
    </Style>
  </ItemsControl.ItemContainerStyle>
</ItemsControl>
    回复于
  • 10

    我找到了解决方案 . 我必须覆盖ItemsPanel模板以使用网格（或类似的容器）：

    <ItemsControl>
  <ItemsControl.ItemsPanel>
    <ItemsPanelTemplate>
      <Grid/>
    </ItemsPanelTemplate>
  </ItemsControl.ItemsPanel>
</ItemsControl>

    我也在这种情况下删除了一些xaml，使其更加可读！

    谢谢

    回复于
  • 8

    您是否尝试在 ItemsControl 中将HorizontalContentAlignment和VerticalContentAlignment设置为Stretch？

    回复于

相关问题