I have a user control in WPF that has a DataGrid. I add this user control in a Window inside a TabItem of TabControl. The Vertical scrollbar is not getting visible. I resized the window and it seems the user control is taking its complete height after considering height of DataGrid.
How to make the vertical scrollbar appear and still keep the height of DataGrid to auto depending on the height available as per height of the user control and window?
EDIT: Main Window:
<Window>
<Grid>
<TabControl Name="tc"
SelectionChanged="tc_SelectionChanged">
<TabItem Header="ABC">
<local:uc1 />
</TabItem>
<TabItem Header="DEF">
<local:uc2 />
</TabItem>
</TabControl>
</Grid>
</Window>
User Control:
<UserControl>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="30"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="2*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<StackPanel Grid.Row="0"
Grid.Column="0"
Orientation="Vertical">
<StackPanel Orientation="Horizontal">
<Button>Add</Button>
<Button>Remove</Button>
<Button>Refresh</Button>
</StackPanel>
<Label Name="lblTopMessage">some message</Label>
<DataGrid Name="dg"
IsReadOnly="True">
<DataGrid.Columns>
<DataGridTextColumn Binding="{Binding Name}"
Header="Name"
Width="*"></DataGridTextColumn>
<DataGridTextColumn Binding="{Binding Value}"
Header="Value"
Width="130"></DataGridTextColumn>
<DataGridTextColumn Binding="{Binding List}"
Header="List"
Width="*"></DataGridTextColumn>
</DataGrid.Columns>
</DataGrid>
</StackPanel>
<Grid Grid.Row="0"
Grid.Column="1"
Name="gridTS">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Name="lblNewSource"
Grid.Row="0"
Grid.ColumnSpan="2"
HorizontalAlignment="Center"
Padding="0 5 0 0"
FontWeight="Bold">New Source</TextBlock>
<TextBlock Grid.Row="1"
Grid.Column="0"
Padding="10 10 0 0">Name:</TextBlock>
<TextBlock Grid.Row="2"
Grid.Column="0"
Padding="10 10 0 0">Value:</TextBlock>
<TextBlock Grid.Row="3"
Grid.Column="0"
Padding="10 10 0 0">List:</TextBlock>
<TextBox Grid.Row="1"
Grid.Column="1"
Name="txtName"
IsEnabled="False"></TextBox>
<ComboBox Grid.Row="2"
Grid.Column="1"
Name="cbValue"></ComboBox>
<ListBox Grid.Row="3"
Grid.Column="1"
Name="lbList">
<ListBox.ItemTemplate>
<DataTemplate>
<CheckBox Margin="3 5 0 3"
Content="{Binding Name}"
IsChecked="{Binding IsActive}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Button Name="btnSave"
Click="btnSave_Click"
Grid.Row="4"
Grid.Column="1">Save</Button>
<TextBlock TextWrapping="WrapWithOverflow"
Name="lblMessage"
Grid.Row="5"
Grid.Column="1"
Margin="0 10 10 0"></TextBlock>
</Grid>
</Grid>
</UserControl>
UPDATED: I just took DataGrid out of StackPanel. Try this code:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="45.361"></RowDefinition>
<RowDefinition Height="102.639" />
<RowDefinition Height="30"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="2*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<StackPanel Grid.Row="0"
Grid.Column="0"
Orientation="Vertical">
<StackPanel Orientation="Horizontal">
<Button>Add</Button>
<Button>Remove</Button>
<Button>Refresh</Button>
</StackPanel>
<Label Name="lblTopMessage">some message</Label>
</StackPanel>
<DataGrid Grid.Row="1"
Name="dg"
IsReadOnly="True">
<DataGrid.Columns>
<DataGridTextColumn Binding="{Binding Name}"
Header="Name"
Width="*"></DataGridTextColumn>
<DataGridTextColumn Binding="{Binding Value}"
Header="Value"
Width="130"></DataGridTextColumn>
<DataGridTextColumn Binding="{Binding List}"
Header="List"
Width="*"></DataGridTextColumn>
</DataGrid.Columns>
</DataGrid>
<Grid Grid.Row="0"
Grid.Column="1"
Name="gridTS"
Grid.RowSpan="2">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Name="lblNewSource"
Grid.Row="0"
Grid.ColumnSpan="2"
HorizontalAlignment="Center"
Padding="0 5 0 0"
FontWeight="Bold">New Source</TextBlock>
<TextBlock Grid.Row="1"
Grid.Column="0"
Padding="10 10 0 0">Name:</TextBlock>
<TextBlock Grid.Row="2"
Grid.Column="0"
Padding="10 10 0 0">Value:</TextBlock>
<TextBlock Grid.Row="3"
Grid.Column="0"
Padding="10 10 0 0">List:</TextBlock>
<TextBox Grid.Row="1"
Grid.Column="1"
Name="txtName"
IsEnabled="False"></TextBox>
<ComboBox Grid.Row="2"
Grid.Column="1"
Name="cbValue"></ComboBox>
<ListBox Grid.Row="3"
Grid.Column="1"
Name="lbList">
<ListBox.ItemTemplate>
<DataTemplate>
<CheckBox Margin="3 5 0 3"
Content="{Binding Name}"
IsChecked="{Binding IsActive}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Button Name="btnSave"
Grid.Row="4"
Grid.Column="1">Save</Button>
<TextBlock TextWrapping="WrapWithOverflow"
Name="lblMessage"
Grid.Row="5"
Grid.Column="1"
Margin="0 10 10 0"></TextBlock>
</Grid>
</Grid>
I hope that helps.
Make the vertical scrollbar appear and still keep the height of DataGrid auto.
The answer is NO.
As long as the height is auto it will grow as auto means I get all the height I want.
<RowDefinition Height="Auto"></RowDefinition>
If you want it to use available space then use *
<RowDefinition Height="*"></RowDefinition>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With