如何让我的数据网格随窗口增长并保持边距？

Everything about my layout will flow with the resizing of the main window. The problem I'm facing is that as you can see, the datagrid goes off the screen. If you maximize the window, the datagrid will resize with the window, but continue to go off the screen. How do I get it to maintain its margin of 20 with it's parent grid?

关于我的布局的一切都将随着主窗口的大小调整而流动。我面临的问题是,正如您所看到的,数据网格离开了屏幕。如果最大化窗口,数据网格将随窗口调整大小,但继续离开屏幕。如何使用它的父网格来保持其20的边际?

<Grid>
    <StackPanel Orientation="Vertical">
        <TextBox Height="170" Name="txtSQL" VerticalAlignment="Top" AcceptsReturn="True" TextWrapping="Wrap" Margin="20"/>
        <Button Content="Run!" Height="23" HorizontalAlignment="Left" Name="btnRun" VerticalAlignment="Top" Margin="20,0,0,0" Width="75" Click="btnRun_Click" />

        <Grid>
            <my:DataGrid Name="dgResults" VerticalAlignment="Top" Margin="20" />
        </Grid>
    </StackPanel>
</Grid>

UPDATE: Just to be more specific. The effect I'm trying to accomplish here is this:

更新:更具体一点。我想在这里完成的效果是这样的:

When the window first loads, you are presented with a blank datagrid, so it's only about 15 pixels high. When you run the query, it will populate the datagrid by reassigning the itemssource. As of now, when you do that, if the data exceeds the window size, it will go off the bottom of the screen. I need it to only expand to the bottom of the window then enable the scrollbar. I can do this just by wrapping it in a scrollviewer im sure. However, when the window is resized, the datagrid needs to resize with it.

当窗口首次加载时,您将看到一个空白的数据网格,因此它只有大约15像素高。运行查询时,它将通过重新分配itemssource来填充数据网格。截至目前,当您这样做时,如果数据超出窗口大小,它将离开屏幕的底部。我需要它只扩展到窗口的底部然后启用滚动条。我只需将它包装在一个scrollviewer中就可以做到这一点。但是,在调整窗口大小时,datagrid需要使用它调整大小。

I'm wondering if the setup might have something to do with it. The form is actually a wpf page being displayed in a frame.

我想知道设置是否与它有关。表单实际上是一个在框架中显示的wpf页面。

UPDATE:

<Page x:Class="Hold_Database___Prototype_1.Views.SQL"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      mc:Ignorable="d" 
      d:DesignHeight="304" d:DesignWidth="732"
    Title="SQL" xmlns:my="http://schemas.microsoft.com/wpf/2008/toolkit" AllowDrop="True">
        <Grid>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="23" />
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
            <TextBox Height="170" Name="txtSQL" VerticalAlignment="Top" AcceptsReturn="True" TextWrapping="Wrap" Margin="20" Grid.Row="0"/>
            <Button Content="Run!" Height="23" HorizontalAlignment="Left" Name="btnRun" VerticalAlignment="Top" 
                    Margin="20,0,0,0" Width="75" Grid.Row="1" Click="btnRun_Click" />
        <DockPanel Grid.Row="2">
            <my:DataGrid Name="dgResults" Margin="20" />
        </DockPanel>
    </Grid>
</Page>

3 个解决方案

#1

What is the dock panel for in this example?

在这个例子中什么是停靠面板?

Try putting the DataGrid directly in the cell with no stackpanel. If you are setting the button height then set set grid to auto.

尝试将DataGrid直接放在没有stackpanel的单元格中。如果要设置按钮高度,请将“设置网格”设置为“自动”。

Also, why give so much space to the text?

另外,为什么要给文本留出这么多空间呢?

    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
        <TextBox Height="170" Name="txtSQL" VerticalAlignment="Top" AcceptsReturn="True" TextWrapping="Wrap" Margin="20" Grid.Row="0"/>
        <Button Content="Run!" Height="23" HorizontalAlignment="Left" Name="btnRun" VerticalAlignment="Top" 
                Margin="20,0,0,0" Width="75" Grid.Row="1" Click="btnRun_Click" />
        <my:DataGrid  Grid.Row="2" <my:DataGrid Name="dgResults" Margin="20" /> 

Then also set HorizontalAlignment, VerticleAlignment, HorizontalContentAlignment, and VerticalContentAlignment = stretch

然后还设置Horizo​​ntalAlignment,VerticleAlignment,Horizo​​ntalContentAlignment和VerticalContentAlignment = stretch

#2

Your Grid is drawn off screen without a scroll bar because you are using a StackPanel. Care must be taken when using StackPanel - it is the most simplistic of all WPF Panel derived classes since its MeasureOverride calls Measure for all of its children with a size of double.PositiveInifity regardless of how much space the panel actually has available. Even a ScrollViewer will not help you with a StackPanel (the ScrollBar will be shown, but you won't be able to move it).

您的网格是在没有滚动条的情况下在屏幕上绘制的,因为您正在使用StackPanel。使用StackPanel时必须小心 - 它是所有WPF Panel派生类中最简单的,因为它的MeasureOverride为其所有子级调用Measure,其大小为double.PositiveInifity,无论面板实际可用的空间大小。即使是ScrollViewer也无法帮助您使用StackPanel(将显示ScrollBar,但您将无法移动它)。

For example, consider a Window 350 in height and width, and a single Button as its content which is 500 in both height and width:

例如,考虑高度和宽度的Window 350,以及单个Button作为其内容,高度和宽度均为500:

<Window x:Class="WpfApplication2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="350">
    <StackPanel>
        <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
            <Button Content="Hello" Height="500" Width="500" />
        </ScrollViewer>
    </StackPanel>
</Window>

Similar to your example, the Button here is drawn off screen in both the vertical and horizontal directions and a non-functional scroll bar will be present. If we change the panel to one which respects the size of its given area (e.g. DockPanel):

与您的示例类似,此处的按钮在垂直和水平方向上都在屏幕上绘制,并且将存在无功能的滚动条。如果我们将面板更改为一个尊重其给定区域大小的面板(例如DockPanel):

<Window x:Class="WpfApplication2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <DockPanel>
        <ScrollViewer>
            <Button Content="Hello" Height="500" />
        </ScrollViewer>
    </DockPanel>
</Window>

then scroll bars appear which are functional and hence allow the content off screen to be shown by scrolling.

然后出现滚动条功能,因此滚动显示内容关闭屏幕。

Hope this helps!

希望这可以帮助!

#3

What I have done was do define the horizontal and vertical alignments to "Stretch" respectively at the control you want (your DataGrid) to take up the size based on the window being resized.

我所做的是在你想要的控件(你的DataGrid)分别根据被调整大小的窗口定义水平和垂直对齐到“拉伸”。