CODEWITHSUNDEEP
c#wpf
Lex Webb
Lex Webb

Reputation: 2852

WPF Using GridSplitter outside of a grid Jumping re-size issue

I'm using a GridSplitter outside of a grid in a DockPanel to try and control the width of my docked items. I'm using it because of it has all the necessary drag events built in. The issue i'm having is that since when i re-size my docked item, the GridSplitter is moving to accommodate the width, thus throwing the Splitters Horrizontal Change value out.

Gif of the result:

enter image description here

You can also see by the console output of the HorrizontalChange value on the splitters DragDelta event exactly whats happening to the internal value.

enter image description here

The code i'm using for this can be found below:

Window.xaml.cs:

        private double _rightContainerWidthBeforeDrag;

        private void RightGridSplitter_DragDelta(object sender, System.Windows.Controls.Primitives.DragDeltaEventArgs e)
        {
            Console.WriteLine("Change: " + e.HorizontalChange);
            DockContainerRight.Width = _rightContainerWidthBeforeDrag + e.HorizontalChange * -1;
        }

        private void RightGridSplitter_DragStarted(object sender, System.Windows.Controls.Primitives.DragStartedEventArgs e)
        {
            Console.WriteLine("Started: " + DockContainerRight.ActualWidth);
            _rightContainerWidthBeforeDrag = DockContainerRight.ActualWidth;
        }

        private void RightGridSplitter_DragCompleted(object sender, System.Windows.Controls.Primitives.DragCompletedEventArgs e)
        {
            _rightContainerWidthBeforeDrag = DockContainerRight.ActualWidth;
        }

Window.xaml

    <DockPanel>
        <controls:DockContainer x:Name="DockContainerLeft" DockPosition="Left" DockPanel.Dock="Left"/>
        <controls:DockContainer x:Name="DockContainerRight" DockPosition="Right" DockPanel.Dock="Right"/>
        <controls:DockContainer x:Name="DockContainerBottom" DockPosition="Bottom" DockPanel.Dock="Bottom"/>

        <GridSplitter Name="RightGridSplitter" DockPanel.Dock="Right" ResizeDirection="Columns" Width="3" Height="Auto" Margin="0"
            DragDelta="RightGridSplitter_DragDelta"
            DragStarted="RightGridSplitter_DragStarted"
            DragCompleted="RightGridSplitter_DragCompleted"/>
    </DockPanel>

I think i must be using the information on the events wrong, or have a floor in my maths. What can i do to fix this? Or alternatively is there a better way for me to do this that wont encounter the problem?

Upvotes: 0

Views: 555

Answers (1)

Newton Zou
Newton Zou

Reputation: 588

The UI(DockContainerRight.Width) update in Window.xaml.cs causes the problem. You can try to wrap the GridSplitter and DockContainerRight in a grid.

<DockPanel>
            <controls:DockContainer  x:Name="DockContainerBottom"  Height="50" DockPanel.Dock="Bottom"/>
            <Grid >
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="200"/>
                </Grid.ColumnDefinitions>
                <controls:DockContainer x:Name="DockContainerLeft" Grid.Column="0"  />
                <GridSplitter Grid.Column="1" VerticalAlignment="Stretch" HorizontalAlignment="Center" Width="3"  Margin="0"/>
                <controls:DockContainer x:Name="DockContainerRight" Grid.Column="2"  />

            </Grid>
        </DockPanel>

Upvotes: 1

Related Questions