WPF,让verticalstretch按预期工作!

时间:2009-11-09 12:27:31

标签: wpf xaml prism

我正在尝试使垂直拉伸按预期工作在WPF中,但由于某种原因,它只占用它所需的空间,而不是可用的空间。

首先,我使用的是带有C#和Prism的WPF。

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

然后我使用prism将视图(作为UserControl组件)插入主应用程序区域。 UserControl也设置为自动宽度和高度,通过查看Expression Blend中的默认设置,Horizo​​ntalAlignment和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,以便更容易理解!

谢谢!

3 个答案:

答案 0 :(得分:10)

ItemsControl.ItemsPanelTemplate的默认值为StackPanel,它会垂直压缩所有子项,并提供您描述的症状。

解决方案代码 - 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>

答案 1 :(得分:8)

我找到了解决方案。我必须覆盖ItemsPanel模板以使用网格(或类似的容器):

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

在这种情况下我也删除了一些xaml以使其更易读!

由于

答案 2 :(得分:1)

您是否尝试在 ItemsControl 中将Horizo​​ntalContentAlignment和VerticalContentAlignment设置为Stretch?