将 GridView 拉伸到父控件边界答案

【问题标题】：Stretch GridView to parent control bounds将 GridView 拉伸到父控件边界
【发布时间】：2014-05-27 13:13:05
【问题描述】：

我有一个自定义控件，我将 SemanticZoom 和 GridView 放在里面。问题是，如果 GridView 只有很少的项目要显示，那么 SemanticZoom 的宽度小于容器的宽度。结果放大/缩小按钮被错误地放置在屏幕中间。

如果要显示的项目很多，则 GridView 将自身拉伸到父控件边界，一切正常。

即使里面只有很少的项目，如何正确拉伸语义缩放（或内部 GridView）？

自定义容器代码：

<controls:DataLoader Grid.RowSpan="2" >
                <controls:DataLoader.DataContent>
                    <SemanticZoom x:Name="SemanticZoom"  Style="{StaticResource SemanticZoomStyle}"  Margin="0,0,0,0" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch">
                        <SemanticZoom.ZoomedOutView>
                            ..skipped..
                        </SemanticZoom.ZoomedOutView>

                        <SemanticZoom.ZoomedInView>
                            <GridView x:Name="ZoomedInView"
                                ItemsSource="{Binding Source={StaticResource GroupedPatients}}" 
                                      ItemTemplate="{StaticResource PatientItemTemplate}" 
                                      Style="{StaticResource DataGridViewStyle}"
                                      behaviors:SelectionChangedCommandBehavior.Command="{Binding SelectPatientCommand}" Margin="0,0,0,0" 
                                      HorizontalAlignment="Stretch"  HorizontalContentAlignment="Stretch"
                                      Background="Yellow">


                                <GridView.GroupStyle>
                                    <GroupStyle HeaderTemplate="{StaticResource PatientItemGroupHeaderTemplate}">
                                        <GroupStyle.Panel>
                                            <ItemsPanelTemplate>
                                                <VariableSizedWrapGrid Orientation="Vertical"/>
                                            </ItemsPanelTemplate>
                                        </GroupStyle.Panel>
                                    </GroupStyle>
                                </GridView.GroupStyle>
                            </GridView>
                        </SemanticZoom.ZoomedInView>
                    </SemanticZoom>
                </controls:DataLoader.DataContent>

GridView 样式：

<Style x:Key="DataGridViewStyle" TargetType="GridView">
    <Setter Property="IsItemClickEnabled" Value="True"/>
    <Setter Property="SelectionMode" Value="None"/>
    <Setter Property="VerticalAlignment" Value="Stretch"/>
    <Setter Property="Width" Value="Auto"/>
    <Setter Property="Padding" Value="0"/>
    <Setter Property="Margin" Value="0"/>
</Style>
            </controls:DataLoader>

【问题讨论】：

我只能说“天哪！”。 DataContext 用于保存/提供数据，而不是UI 元素...线索就在名称中。从 MSDN 上的 FrameworkElement.DataContext Property 页面：获取或设置参与数据绑定的元素的数据上下文。当你用DataLoader.DataContent 做一些奇怪的事情时，所有的牌都没有了……几乎任何事情都可能发生。
顺便说一句，简单的答案是将父容器控件的Control.HorizontalContentAlignment Property 设置为Stretch 以使其内容伸展。我不想说它是否仍然适用于你的奇怪代码。
样本中是DataContent，不是Context。所有可能的属性都已设置为 Stretch 并且没有帮助。
抱歉……我的错。由于您没有提供我们可以测试的Minimal, Complete, and Verifiable example，因此这里的任何人仍然无能为力。
如何在这里上传？最小的例子是一个完整的 VS 解决方案，它超出了复制粘贴几行代码的范围。我必须在某处上传档案

标签： c# wpf wpf-controls

【解决方案1】：

正确的解决方案是使用Grid而不是GridView

【讨论】：