如何让DataGrid在WPF中填充窗口中的空白

时间:2018-01-30 18:00:58

标签: c# wpf datagrid

我正在WPF中开展一个项目。我的要求是将我的DataGrid附加到窗口的底部,这样如果用户将恢复或最大化窗口或更改窗口的大小,DataGrid将不应超出主窗口的高度并应自动调整大小并滚动条应显示查看数据。在下面给出的代码中,DataGrid仅显示可用的数据,例如,如果只显示2行,则在数据网格中仅显示2行,其余用户可以看到背景,如果数据有50 60行数据网格将超出主窗口,用户无法看到数据网格中的所有行。

我的要求 Datagrid高度不应超出主窗口中的可用空间。 如果DataBase中没有要显示的行,则DataGrid应显示Empty Rows或Simply Grey Space。

<StackPanel>

    <StackPanel Orientation="Horizontal">
        <TextBlock Margin="40 50 0 0" Text="Label1:" Foreground="White" FontWeight="Medium" />
        <ComboBox x:Name="CustomerList" Margin="15 40 0 0" Padding="7" Width="300" Foreground="Black" FontWeight="Medium" Cursor="Hand">
    </StackPanel>

    <StackPanel Orientation="Horizontal">
        <TextBlock Margin="25 30 0 0" Text="Label2" Foreground="White" FontWeight="Medium" TextWrapping="Wrap" Width="54"/>
        <TextBox x:Name="AppName" Margin="15 30 0 0" Padding="7" Width="230" Background="LightCyan" Foreground="Black" FontWeight="Medium" />
    </StackPanel>

    <StackPanel Orientation="Horizontal">          
        <TextBox x:Name="Tenure" Margin="20 30 0 0" Padding="7" Width="170" Background="LightCyan" Foreground="Black" FontWeight="Medium" />          
    </StackPanel>

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1000"/>
            <ColumnDefinition Width="150"/>
        </Grid.ColumnDefinitions>
        <StackPanel>
            <StackPanel Orientation="Horizontal" Grid.Column="0">

               <TextBlock Margin="25 30 0 0" Text="Label2.:" Foreground="White" FontWeight="Medium" Width="80" TextWrapping="Wrap"/>
            </StackPanel>

            <StackPanel Orientation="Horizontal" Grid.Column="0">                    
                <Button x:Name="Add_btn" Content="Add Data" Width="120" Padding="12" Background="Transparent" Foreground="White" FontWeight="Medium" Margin="15 30 0 0" BorderBrush="White" BorderThickness="1" Click="Add_btn_Click" Cursor="Hand"/>
            </StackPanel>
        </StackPanel>

        <StackPanel Grid.Column="1" HorizontalAlignment="Right">
            <Image Source="C:\Users\Asim Abbas\Source\Icons\Upload1.png" Height="90" Width="90" Margin="0 25 0 0" MouseLeftButtonDown="Image_MouseLeftButtonDown" Cursor="Hand">
                <Image.Effect>
                    <DropShadowEffect/>
                </Image.Effect>
            </Image>

            <TextBlock Margin="20,5,0,0" Text="Upload" Foreground="White" FontWeight="Medium" />

        </StackPanel>
    </Grid>

这就是事情变得丑陋的地方 - 数据从上面继续

    <DataGrid 
        DockPanel.Dock="Bottom"
        x:Name="Grid"
        Margin="0 20 0 0"
        AutoGenerateColumns="False"
        CanUserAddRows="False"
        CanUserDeleteRows="False"
        ColumnHeaderHeight="60"
        CanUserResizeColumns="False"
        ScrollViewer.VerticalScrollBarVisibility="Visible"
        VerticalScrollBarVisibility="Visible"
        CanUserReorderColumns="False"
        CanUserResizeRows="False"
        CanUserSortColumns="False"
        RowBackground="LightCyan"
        RowHeight="30"
        HorizontalGridLinesBrush="LightGray"
        Width="Auto"            
        IsReadOnly="True"
        VerticalAlignment="Stretch"
        VerticalContentAlignment="Stretch"
        FontSize="11"
        HorizontalAlignment="Left"
        FontWeight="Medium"
        VerticalGridLinesBrush="LightGray" 
        BorderBrush="FloralWhite"
        MouseDoubleClick="LCGrid_MouseDoubleClick">

        <DataGrid.ColumnHeaderStyle>
            <Style TargetType="DataGridColumnHeader">
                <Setter Property="ContentTemplate">
                    <Setter.Value>
                        <DataTemplate>
                            <TextBlock HorizontalAlignment="Center" TextWrapping="Wrap" Text="{Binding}"/>
                        </DataTemplate>
                    </Setter.Value>
                </Setter>
                <Setter Property="VerticalContentAlignment" Value="Bottom"/>
                <Setter Property="HorizontalContentAlignment" Value="Center"/>
                <Setter Property="BorderThickness" Value=".5,.5,.5,.5"/>
                <Setter Property="BorderBrush" Value="LightGray"/>
                <Setter Property="Background" Value="FloralWhite"/>
                <Setter Property="FontWeight" Value="SemiBold"/>
                <Setter Property="FontSize" Value="12"/>
                <Setter Property="Padding" Value="5"/>
                <Setter Property="Width" Value="Auto"/>
            </Style>
        </DataGrid.ColumnHeaderStyle>

        <DataGrid.RowHeaderStyle>
            <Style TargetType="DataGridRowHeader">
                <Setter Property="HorizontalContentAlignment" Value="Right"/>
                <Setter Property="Width" Value="25"/>
                <Setter Property="FontWeight" Value="Medium"/>
                <Setter Property="FontSize" Value="12"/>
                <Setter Property="Background" Value="FloralWhite"/>
            </Style>
        </DataGrid.RowHeaderStyle>

        <DataGrid.CellStyle>
            <Style TargetType="DataGridCell">
                <Setter Property="Padding" Value="3"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type DataGridCell}">
                            <Border Padding="{TemplateBinding Padding}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True" VerticalAlignment="Bottom">
                                <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Bottom"/>
                            </Border>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </DataGrid.CellStyle>

        <DataGrid.Columns>
            <DataGridTextColumn Binding="{Binding Col1}" Header="Col 1" Width="150"/>
            <DataGridTextColumn Binding="{Binding Col1}" Header="Col2" Width="60">
                <DataGridTextColumn.ElementStyle>
                    <Style TargetType="TextBlock">
                        <Setter Property="HorizontalAlignment" Value="Center"/>
                    </Style>
                </DataGridTextColumn.ElementStyle>
            </DataGridTextColumn>
            <DataGridTextColumn Binding="{Binding Col1, StringFormat={}{0:dd-MMM-yy}}" Header="Col 3" Width="80"/>
            <DataGridTextColumn Binding="{Binding Col1}" Header="Col3" Width="80"/>
            <DataGridTextColumn Binding="{Binding Col1}" Header="Col 4" Width="250"/>
            <DataGridTextColumn Binding="{Binding Col1}" Header="Col5" Width="80"/>
            <DataGridTextColumn Binding="{Binding Col1, StringFormat=N2}" Header="LC Value" Width="100">
                <DataGridTextColumn.ElementStyle>
                    <Style TargetType="TextBlock">
                        <Setter Property="HorizontalAlignment" Value="Right"/>
                    </Style>
                </DataGridTextColumn.ElementStyle>
            </DataGridTextColumn>

            <DataGridTextColumn Binding="{Binding Col1, StringFormat=N2}" Header="Col6" Width="100">
                <DataGridTextColumn.ElementStyle>
                    <Style TargetType="TextBlock">
                        <Setter Property="HorizontalAlignment" Value="Right"/>
                    </Style>
                </DataGridTextColumn.ElementStyle>
            </DataGridTextColumn>

            <DataGridTextColumn Binding="{Binding Col1, StringFormat=N2}" Header="Col 7" Width="100">
                <DataGridTextColumn.ElementStyle>
                    <Style TargetType="TextBlock">
                        <Setter Property="HorizontalAlignment" Value="Right"/>
                    </Style>
                </DataGridTextColumn.ElementStyle>
            </DataGridTextColumn>

            <DataGridTextColumn Binding="{Binding Col1, StringFormat=N2}" Header="Col8" Width="100">
                <DataGridTextColumn.ElementStyle>
                    <Style TargetType="TextBlock">
                        <Setter Property="HorizontalAlignment" Value="Right"/>
                    </Style>
                </DataGridTextColumn.ElementStyle>
            </DataGridTextColumn>

            <DataGridTextColumn Binding="{Binding Col1, StringFormat=N2}" Header="Col9" Width="100">
                <DataGridTextColumn.ElementStyle>
                    <Style TargetType="TextBlock">
                        <Setter Property="HorizontalAlignment" Value="Right"/>
                    </Style>
                </DataGridTextColumn.ElementStyle>
            </DataGridTextColumn>

            <DataGridTextColumn Binding="{Binding Col1, StringFormat={}{0:dd-MMM-yy}}" Header="Col10" Width="80"/>
            <DataGridTextColumn Binding="{Binding Col1, StringFormat={}{0:dd-MMM-yy}}" Header="Col11" Width="80"/>
            <DataGridTextColumn Binding="{Binding Col1}" Header="Col12" Width="250"/>
            <DataGridTextColumn Binding="{Binding Col1, StringFormat=N0}" Header="Col13" Width="80">

                <DataGridTextColumn.ElementStyle>
                    <Style TargetType="TextBlock">
                        <Setter Property="HorizontalAlignment" Value="Center"/>
                    </Style>
                </DataGridTextColumn.ElementStyle>
            </DataGridTextColumn>

            <DataGridTextColumn Binding="{Binding Col1, StringFormat=N0}" Header="Col 14" Width="80">
                <DataGridTextColumn.ElementStyle>
                    <Style TargetType="TextBlock">
                        <Setter Property="HorizontalAlignment" Value="Center"/>
                    </Style>
                </DataGridTextColumn.ElementStyle>
            </DataGridTextColumn>

            <DataGridTextColumn Binding="{Binding Col1}" Header="Col 15" Width="150"/>
            <DataGridTextColumn Binding="{Binding Col1}" Header="Col 16" Width="150"/>
            <DataGridTextColumn Binding="{Binding Col1}" Header="Col 17" Width="200"/>
            <DataGridTextColumn Binding="{Binding Col1}" Header="Col 18" Width="80"/>
            <DataGridTextColumn Binding="{Binding Col1}" Header="Col 19" Width="100"/>

        </DataGrid.Columns>
    </DataGrid>

</StackPanel>

1 个答案:

答案 0 :(得分:0)

在简短的回答中,您必须使用Grid RowDefinition Height="*" - 您的行将具有相对高度

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>  <!-- fit componets size -->
        <RowDefinition Height="*"/>     <!-- relative size -->
    </Grid.RowDefinitions>
    <Grid Grid.Row="0">
        <StackPanel>
             ..........
        </StackPanel>
    </Grid
    <Grid Grid.Row="1">
        <DataGrid AutoGenerateColumns="True" 
                  ScrollViewer.CanContentScroll="True" 
                  ScrollViewer.VerticalScrollBarVisibility="Auto"
                  ScrollViewer.HorizontalScrollBarVisibility="Auto">

            ...............
        </DataGrid>
    </Grid>
</Grid>