在WPF中使用dataGrid调整大小的网格 [英] Grid with dataGrid resizing in WPF

查看:76
本文介绍了在WPF中使用dataGrid调整大小的网格的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

调整应用程序窗口大小时出现问题.我有两个DataGrid,每个DataGrid都放置在自己的Grid列中,而另一列位于Grid的中间,其中包含GridSplitter来调整DataGrid的大小.

I have an issue when resizing window of my application. I have two DataGrids each placed in its own Column of Grid with another Column in the middle of the Grid containing GridSplitter to adjust the size of DataGrids.

通过从这种状态减小窗口宽度,我需要得到这个:

By reducing the window width from this state I need to get this:

这样,每个列和窗口都将达到MinWidth.但是相反,我得到了这个(左列不在其MinWidth处):

This way the each column and window would hit the MinWidth. But instead of that I get this (the left Column is not at its MinWidth):

我注意到是DataGrid中的Columns停止/减慢了Grid Column的收缩,从而导致最小尺寸的窗口切割了第二部分.当另一列的列变宽时,同样的事情也会发生.

I noticed that it is the Columns in the DataGrid that stop/slow the shrinking of the Column of the Grid causing window at minimum size to cut the second part. The same thing happens to the other column when its columns are wider.

这是我的XAML文件:

This is my XAML file:

<Window x:Class="DC_SB.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Application" Height="350" Width="525" MinWidth="430" MinHeight="150" Background="WhiteSmoke">
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Menu Grid.Row="0" Background="#FFE0E0E0">
        <MenuItem Header="Settings">
            <MenuItem Header="Key bindings" Click="keyBindings" />
            <MenuItem Header="Color settings" Click="colorSettings" />
        </MenuItem>
        <MenuItem Header="View">
            <MenuItem x:Name="ViewCounters" Header="Counters" IsCheckable="True" IsChecked="True" Click="OnMouseDownView" />
            <MenuItem x:Name="ViewSounds" Header="Sounds" IsCheckable="True" IsChecked="True" Click="OnMouseDownView" />
        </MenuItem>
        <MenuItem Header="Enable">
            <MenuItem x:Name="EnableCounters" Header="Counters" IsCheckable="True" IsChecked="True" Click="OnMouseDownEnable" />
            <MenuItem x:Name="EnableSounds" Header="Sounds" IsCheckable="True" IsChecked="True" Click="OnMouseDownEnable" />
        </MenuItem>
    </Menu>

    <Grid Grid.Row="1" x:Name="Grid" >
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" MinWidth="205" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" MinWidth="205" />
        </Grid.ColumnDefinitions>

        <GridSplitter Margin="0,25,0,10" Grid.Column="1" ResizeBehavior="PreviousAndNext" Width="3" />

        <Grid x:Name="CountersGrid" Grid.Column="0">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>

            <Label Grid.Row="0" Content="Counters" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,0,0,0" />

            <DataGrid x:Name="CountersList" Grid.Row="1" HorizontalAlignment="Stretch" Margin="10,0,10,10" AutoGenerateColumns="False" VerticalAlignment="Stretch" 
                      CanUserResizeColumns="True" CanUserReorderColumns="False" CanUserSortColumns="False" SelectionMode="Single" CanUserDeleteRows="False" 
                      CanUserAddRows="False" CanUserResizeRows="False" SelectionUnit="FullRow" MouseDoubleClick="OnDoubleClick" HeadersVisibility="Column" >
                <DataGrid.Columns>
                    <DataGridTextColumn Header="Name" IsReadOnly="True" Binding="{Binding Path=Name}" />
                    <DataGridTextColumn Header="Path" IsReadOnly="True" Binding="{Binding Path=Path}" />
                    <DataGridTextColumn Header="Count" IsReadOnly="True" Binding="{Binding Path=CountKey}" />
                </DataGrid.Columns>
                <DataGrid.Resources>
                    <Style TargetType="{x:Type DataGridColumnHeader}">
                        <Setter Property="Foreground" Value="Black" />
                    </Style>
                </DataGrid.Resources>
            </DataGrid>

            <Button Grid.Row="2" Content="Add" HorizontalAlignment="Left" Margin="10,0,0,10" VerticalAlignment="Bottom" Width="60" Click="addCounter" />
            <Button Grid.Row="2" Content="Remove" HorizontalAlignment="Left" Margin="75,0,0,10" VerticalAlignment="Bottom" Width="60" Click="removeCounter" />
            <Button Grid.Row="2" Content="-" HorizontalAlignment="Right" Margin="0,0,40,10" VerticalAlignment="Bottom" Width="25" Click="decrement" />
            <Button Grid.Row="2" Content="+" HorizontalAlignment="Right" Margin="0,0,10,10" VerticalAlignment="Bottom" Width="25" Click="increment" />
        </Grid>

        <Grid x:Name="SoundsGrid"  Grid.Column="2">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>

            <Label Grid.Row="0" Content="Sounds" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,0,0,0" />
            <Image Grid.Row="0" HorizontalAlignment="Right" Margin="0,8,110,0"  VerticalAlignment="Top" Height="10" Width="10" >
                <Image.Source>
                    <BitmapImage UriSource="volume.png" />
                </Image.Source>
            </Image>
            <Slider x:Name="Slider" Grid.Row="0" HorizontalAlignment="Right" VerticalAlignment="Bottom" Margin="0,0,10,5" Width="100" Maximum="100" Minimum="0" 
                    AutoToolTipPlacement="BottomRight" IsMoveToPointEnabled="True" ValueChanged="volume" >
                <Slider.LayoutTransform>
                    <ScaleTransform ScaleY="0.75" CenterX="15" CenterY="15"/>
                </Slider.LayoutTransform>
            </Slider>

            <DataGrid x:Name="SoundsList" Grid.Row="1" HorizontalAlignment="Stretch" Margin="10,0,10,10" AutoGenerateColumns="False" VerticalAlignment="Stretch" 
                      CanUserResizeColumns="True" CanUserReorderColumns="False" CanUserSortColumns="False" SelectionMode="Single" CanUserDeleteRows="False" 
                      CanUserAddRows="False" CanUserResizeRows="False" SelectionUnit="FullRow" MouseDoubleClick="OnDoubleClick" HeadersVisibility="Column" >
                <DataGrid.Columns>
                    <DataGridTextColumn Header="Name" IsReadOnly="True" Binding="{Binding Path=Name}" />
                    <DataGridTextColumn Header="Path" IsReadOnly="True" Binding="{Binding Path=Path}" />
                    <DataGridTextColumn Header="Key" IsReadOnly="True" Binding="{Binding Path=CountKey}" />
                </DataGrid.Columns>
                <DataGrid.Resources>
                    <Style TargetType="{x:Type DataGridColumnHeader}">
                        <Setter Property="Foreground" Value="Black" />
                    </Style>
                </DataGrid.Resources>
            </DataGrid>

            <Button Grid.Row="2" Content="Add" HorizontalAlignment="Left" Margin="10,0,0,10" VerticalAlignment="Bottom" Width="60" Click="addSound" />
            <Button Grid.Row="2" Content="Remove" HorizontalAlignment="Left" Margin="75,0,0,10" VerticalAlignment="Bottom" Width="60" Click="removeSound" />
            <Button Grid.Row="2" HorizontalAlignment="Right" Margin="0,0,40,10" VerticalAlignment="Bottom" Width="25" Height="22" Click="play" >
                    <Image Source="play.png" Width="8" Height="8" />
            </Button>
            <Button Grid.Row="2" HorizontalAlignment="Right" Margin="0,0,10,10" VerticalAlignment="Bottom" Width="25" Height="22" Click="stop" >
                <Image Source="stop.png" Width="8" Height="8" />
            </Button>
        </Grid>
    </Grid>
</Grid>

我需要做的是使DataGrid不会影响Grid Column的大小调整.感谢您的帮助

What I need is to make it so the DataGrid does not infulence resizing of the Grid Column. Thanks for help

推荐答案

下面是您对我所做的更改的代码.我删除了MinWidth值,从而解决了该问题.两个面板保持相等.如果要为整个面板设置最小尺寸,则将有效地为网格中的每一列创建最小宽度.看来您已经拥有了:

Below is your code with my changes. I have removed the MinWidth values and that resolved the issue. Both panels remain equal. If you want to set a minimum size to the whole panel, that will effectively create minimum widths for each columns in the grid. It looks like you already have that though:

<Window x:Class="WPFTestApp.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:System="clr-namespace:System;assembly=mscorlib"
    xmlns:Collections="clr-namespace:System.Collections;assembly=mscorlib"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:l="clr-namespace:WPFTestApp"
    Title="MainWindow" Height="350" Width="525" MinWidth ="430">
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Menu Grid.Row="0" Background="#FFE0E0E0">
        <MenuItem Header="Settings">
            <MenuItem Header="Key bindings" Click="keyBindings" />
            <MenuItem Header="Color settings" Click="colorSettings" />
        </MenuItem>
        <MenuItem Header="View">
            <MenuItem x:Name="ViewCounters" Header="Counters" IsCheckable="True" IsChecked="True" Click="OnMouseDownView" />
            <MenuItem x:Name="ViewSounds" Header="Sounds" IsCheckable="True" IsChecked="True" Click="OnMouseDownView" />
        </MenuItem>
        <MenuItem Header="Enable">
            <MenuItem x:Name="EnableCounters" Header="Counters" IsCheckable="True" IsChecked="True" Click="OnMouseDownEnable" />
            <MenuItem x:Name="EnableSounds" Header="Sounds" IsCheckable="True" IsChecked="True" Click="OnMouseDownEnable" />
        </MenuItem>
    </Menu>

    <Grid Grid.Row="1" x:Name="Grid" >
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" MinWidth="0" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" MinWidth="0" />
        </Grid.ColumnDefinitions>

        <GridSplitter Margin="0,25,0,10" Grid.Column="1" ResizeBehavior="PreviousAndNext" Width="3" />

        <Grid x:Name="CountersGrid" Grid.Column="0">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>

            <Label Grid.Row="0" Content="Counters" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,0,0,0" />

            <DataGrid x:Name="CountersList" Grid.Row="1" HorizontalAlignment="Stretch" Margin="10,0,10,10" AutoGenerateColumns="False" VerticalAlignment="Stretch" 
                  CanUserResizeColumns="True" CanUserReorderColumns="False" CanUserSortColumns="False" SelectionMode="Single" CanUserDeleteRows="False" 
                  CanUserAddRows="False" CanUserResizeRows="False" SelectionUnit="FullRow" MouseDoubleClick="OnDoubleClick" HeadersVisibility="Column" >
                <DataGrid.Columns>
                    <DataGridTextColumn Header="Name" IsReadOnly="True" Binding="{Binding Path=Name}" />
                    <DataGridTextColumn Header="Path" IsReadOnly="True" Binding="{Binding Path=Path}" />
                    <DataGridTextColumn Header="Count" IsReadOnly="True" Binding="{Binding Path=CountKey}" />
                </DataGrid.Columns>
                <DataGrid.Resources>
                    <Style TargetType="{x:Type DataGridColumnHeader}">
                        <Setter Property="Foreground" Value="Black" />
                    </Style>
                </DataGrid.Resources>
            </DataGrid>

            <Button Grid.Row="2" Content="Add" HorizontalAlignment="Left" Margin="10,0,0,10" VerticalAlignment="Bottom" Width="60" Click="addCounter" />
            <Button Grid.Row="2" Content="Remove" HorizontalAlignment="Left" Margin="75,0,0,10" VerticalAlignment="Bottom" Width="60" Click="removeCounter" />
            <Button Grid.Row="2" Content="-" HorizontalAlignment="Right" Margin="0,0,40,10" VerticalAlignment="Bottom" Width="25" Click="decrement" />
            <Button Grid.Row="2" Content="+" HorizontalAlignment="Right" Margin="0,0,10,10" VerticalAlignment="Bottom" Width="25" Click="increment" />
        </Grid>

        <Grid x:Name="SoundsGrid"  Grid.Column="2">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>

            <Label Grid.Row="0" Content="Sounds" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,0,0,0" />
            <Image Grid.Row="0" HorizontalAlignment="Right" Margin="0,8,110,0"  VerticalAlignment="Top" Height="10" Width="10" >
                <Image.Source>
                    <BitmapImage UriSource="volume.png" />
                </Image.Source>
            </Image>
            <Slider x:Name="Slider" Grid.Row="0" HorizontalAlignment="Right" VerticalAlignment="Bottom" Margin="0,0,10,5" Width="100" Maximum="100" Minimum="0" 
                AutoToolTipPlacement="BottomRight" IsMoveToPointEnabled="True" ValueChanged="volume" >
                <Slider.LayoutTransform>
                    <ScaleTransform ScaleY="0.75" CenterX="15" CenterY="15"/>
                </Slider.LayoutTransform>
            </Slider>

            <DataGrid x:Name="SoundsList" Grid.Row="1" HorizontalAlignment="Stretch" Margin="10,0,10,10" AutoGenerateColumns="False" VerticalAlignment="Stretch" 
                  CanUserResizeColumns="True" CanUserReorderColumns="False" CanUserSortColumns="False" SelectionMode="Single" CanUserDeleteRows="False" 
                  CanUserAddRows="False" CanUserResizeRows="False" SelectionUnit="FullRow" MouseDoubleClick="OnDoubleClick" HeadersVisibility="Column" >
                <DataGrid.Columns>
                    <DataGridTextColumn Header="Name" IsReadOnly="True" Binding="{Binding Path=Name}" />
                    <DataGridTextColumn Header="Path" IsReadOnly="True" Binding="{Binding Path=Path}" />
                    <DataGridTextColumn Header="Key" IsReadOnly="True" Binding="{Binding Path=CountKey}" />
                </DataGrid.Columns>
                <DataGrid.Resources>
                    <Style TargetType="{x:Type DataGridColumnHeader}">
                        <Setter Property="Foreground" Value="Black" />
                    </Style>
                </DataGrid.Resources>
            </DataGrid>

            <Button Grid.Row="2" Content="Add" HorizontalAlignment="Left" Margin="10,0,0,10" VerticalAlignment="Bottom" Width="60" Click="addSound" />
            <Button Grid.Row="2" Content="Remove" HorizontalAlignment="Left" Margin="75,0,0,10" VerticalAlignment="Bottom" Width="60" Click="removeSound" />
            <Button Grid.Row="2" HorizontalAlignment="Right" Margin="0,0,40,10" VerticalAlignment="Bottom" Width="25" Height="22" Click="play" >
                <Image Source="play.png" Width="8" Height="8" />
            </Button>
            <Button Grid.Row="2" HorizontalAlignment="Right" Margin="0,0,10,10" VerticalAlignment="Bottom" Width="25" Height="22" Click="stop" >
                <Image Source="stop.png" Width="8" Height="8" />
            </Button>
        </Grid>
    </Grid>
</Grid>
</Window>

以上解决方案未解决隐藏面板之一的拆分器.为此,您需要在每一侧添加一列:

The above solution does not address the splitter hiding one of the panels. To do this, you will need to add a column to each side:

            <ColumnDefinition Width="*" MinWidth="40" />
            <ColumnDefinition Width="*" MinWidth="0" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" MinWidth="0" />
            <ColumnDefinition Width="*" MinWidth="40" />

然后,您需要移动网格和拆分器以跨越两列:

Then you need to move the grids and the splitter around to span the two columns:

        <GridSplitter Margin="0,25,0,10" Grid.Column="2" ResizeBehavior="PreviousAndNext" Width="3" Padding="5"/>

        <Grid x:Name="CountersGrid" Grid.Column="0" Grid.ColumnSpan="2">

        <Grid x:Name="SoundsGrid"  Grid.Column="3" Grid.ColumnSpan="2">

这应该为您提供足够的解决方案.您可能需要调整minWidth以满足您的需求.

That should give you enough for the solution. You may need to adjust the minWidth to meet your needs.

这篇关于在WPF中使用dataGrid调整大小的网格的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆