Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

vertical scrollbar not appearing in datagrid inside usercontrol in wpf

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>
like image 473
Brij Avatar asked Apr 18 '13 12:04

Brij


2 Answers

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.

like image 189
Dilshod Avatar answered Sep 20 '22 22:09

Dilshod


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>
like image 37
paparazzo Avatar answered Sep 17 '22 22:09

paparazzo