Haris Hasan
Haris Hasan

Reputation: 30127

Horizontal Scroll Bar Always Appearing in WPF DataGrid

I am facing an issue. In my view I have a DataGrid whose Horizontal Scroll Bar's Visibility is set to Auto. Problem I am facing is that the scroll bar is appearing all the time even if there is enough space for DataGrid to expand and completely display itself. I have tried almost everything but couldn't figure out whats is wrong.

I have uploaded a sample application to demonstrate the problem here. Hoping anyone will point out mistake I am making.

Upvotes: 2

Views: 5394

Answers (2)

Mohammed A. Fadil
Mohammed A. Fadil

Reputation: 9387

You need to remove the MinWidth you set for all the data grid columns, you could also set the data grid columns Width="*" to fill-in all the space available the them. see the code below

Ok, I found it, please remove the HorizontalAlignment from both m_MainGrid and m_DataGrid, moreover, remove all the ColumnDefinitions in m_MainGrid. I tried it on your solution and it worked.

Please follow the following steps

<Window x:Class="Data_Grid_Issue.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">
<Grid>
    <Grid Margin="50" >
        <Grid.RowDefinitions>
            <RowDefinition Height="50"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>
        <Border x:Name="m_Border" CornerRadius="5,5,0,0" BorderBrush="Black" Margin="20,0,0,0"
                BorderThickness="1,1,1,0" HorizontalAlignment="Left" Background="LightBlue"
                Width="{Binding ElementName=m_DataGrid, Path=ActualWidth}">
            <Label Content="Hello" HorizontalAlignment="Center"/>
        </Border>
        <Grid x:Name="m_MainGrid" Grid.Row="1">
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>

            <!--<Grid.ColumnDefinitions>
                <ColumnDefinition Width="{Binding ElementName=col1, Path=ActualWidth}" />
                <ColumnDefinition Width="{Binding ElementName=col2, Path=ActualWidth}" />
                <ColumnDefinition Width="{Binding ElementName=col3, Path=ActualWidth}" />
                <ColumnDefinition Width="{Binding ElementName=col4, Path=ActualWidth}" />
            </Grid.ColumnDefinitions>-->


            <DataGrid ScrollViewer.ScrollChanged="m_DataGrid_ScrollChanged" Width="Auto" x:Name="m_DataGrid" ItemsSource="{Binding Path= Testing}"
                      AutoGenerateColumns="False" Margin="0,0,0,0" EnableRowVirtualization="True"
                      RowHeaderWidth="20"  Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="4"
                      VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">

                <DataGrid.Columns>
                    <DataGridTextColumn Width="Auto" Binding="{Binding Path=a}" MinWidth="200"
                                        x:Name="col1" Header="Col1"></DataGridTextColumn>
                    <DataGridTextColumn Width="Auto" Binding="{Binding Path=b}"  MinWidth="200"
                                        x:Name="col2" Header="Col2"></DataGridTextColumn>
                    <DataGridTextColumn Width="Auto" Binding="{Binding Path=c}"  MinWidth="200"
                                        x:Name="col3" Header="Col3"></DataGridTextColumn>
                    <DataGridTextColumn Width="Auto" Binding="{Binding Path=d}"  MinWidth="200"
                                        x:Name="col4" Header="Col4"></DataGridTextColumn>
                </DataGrid.Columns>
            </DataGrid>
        </Grid>
    </Grid>
</Grid>

Upvotes: 0

Haris Hasan
Haris Hasan

Reputation: 30127

I did following changes/workarounds to solve the issue. It might not be the perfect solution but works for me.

I added two more columns in the Grid, one in the start and one at the end.

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="{Binding ElementName=m_DataGrid, Path=RowHeaderWidth}" />
    <ColumnDefinition Width="{Binding ElementName=col1, Path=ActualWidth}" />
    <ColumnDefinition Width="{Binding ElementName=col2, Path=ActualWidth}" />
    <ColumnDefinition Width="{Binding ElementName=col3, Path=ActualWidth}" />
    <ColumnDefinition Width="{Binding ElementName=col4, Path=ActualWidth}" />
    <ColumnDefinition x:Name="specialCol" />
</Grid.ColumnDefinitions>

Then I increased the ColumnSpan of DataGrid

...Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="6" ....

Then I added this line in Constrcutor of Window

specialCol.Width = new GridLength (2);

and changed UpdateGrid method to this

 void UpdateGrid()
 {
     ScrollViewer scrollview = FindVisualChild<ScrollViewer>(m_DataGrid);
     Visibility verticalVisibility = scrollview.ComputedVerticalScrollBarVisibility;

     if (verticalVisibility == System.Windows.Visibility.Visible)
     {
       specialCol.Width = new GridLength(20);
       m_Border.Width = m_DataGrid.ActualWidth - m_DataGrid.RowHeaderWidth - 17;
     }
     else
     {
        specialCol.Width = new GridLength(2);
        m_Border.Width = m_DataGrid.ActualWidth - m_DataGrid.RowHeaderWidth;
     }
}

I don't see any HorizontalScrollBar now until it is required

Upvotes: 1

Related Questions