Grid with dataGrid resizing in WPF

北战南征 提交于 2021-01-28 03:08:51

问题


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.

Everything is OK

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

I want this

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):

Complete mess

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.

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>

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


回答1:


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>

EDIT:

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">

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




回答2:


I have resolved the issue by adding a code that updates the MinWidth of Grid Columns and Window according to DataGrid Columns sizes. Now the window will stop sizing down where it would start cutting from the second DataGrid.

    void OnLayoutUpdated(object sender, EventArgs e)
    {
        double countersMinWidth = CountersList.Columns[0].ActualWidth + CountersList.Columns[1].ActualWidth + CountersList.Columns[2].ActualWidth + CountersList.Margin.Left + CountersList.Margin.Right;
        double soundsMinWidth = SoundsList.Columns[0].ActualWidth + SoundsList.Columns[1].ActualWidth + SoundsList.Columns[2].ActualWidth + SoundsList.Margin.Left + SoundsList.Margin.Right;
        if (countersMinWidth < 205) countersMinWidth = 205;
        if (soundsMinWidth < 205) soundsMinWidth = 205;
        Grid.ColumnDefinitions[0].MinWidth = countersMinWidth;
        Grid.ColumnDefinitions[2].MinWidth = soundsMinWidth;
        this.MinWidth = countersMinWidth + soundsMinWidth + Splitter.ActualWidth + 18;
    }


来源:https://stackoverflow.com/questions/30131363/grid-with-datagrid-resizing-in-wpf

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!