2012-05-11 44 views
2

我的DataGrid出现数据超出可视范围。我已经研究了StackOverflow上的几个类似的问题,但他们都没有解决我的问题。我无法弄清楚我做错了什么。这就是我的xaml的样子:水平滚动条没有出现在DataGrid中

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="50"/> 
     <RowDefinition Height="*"/> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"/> 
    </Grid.ColumnDefinitions>   
    <TextBlock HorizontalAlignment="Left" Foreground="{DynamicResource TitleFontColor}" 
    TextWrapping="Wrap" Text="{Binding WindowTitle}" VerticalAlignment="Center" 
    Margin="10,10,0,10" FontSize="18.667" FontFamily="Segoe UI" /> 
    <Border Background="{DynamicResource pnlworkarea}" 
     Grid.Row="1" CornerRadius="2" BorderThickness="1"> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="65"/> 
      <RowDefinition Height="Auto" /> 
      <RowDefinition Height="*"/> 
     </Grid.RowDefinitions> 
     <Border BorderThickness="1" 
     Background="{DynamicResource Brush_HeaderNew}" 
     BorderBrush="{DynamicResource pnlworkareastroke}" 
     CornerRadius="2" Margin="5"> 
     <Grid Margin="0"> 
       <ListBox ItemsSource="{Binding ViewMenuItems}" SelectedItem="{Binding Viewselected}" 
       VerticalAlignment="Center" Style="{DynamicResource Content_Header_ListBoxStyle}" 
     ItemTemplate="{DynamicResource Header_DataTemplate}" 
     ItemContainerStyle="{DynamicResource ContentHeader_ListBoxItemStyle}"    
     ItemsPanel="{DynamicResource Header_ItemsPanelTemplate}" HorizontalAlignment="Left"/>         
    </Grid> 
    </Border> 
    <Grid Grid.Row="1" Margin="5"> 
      <StackPanel HorizontalAlignment="Left" Orientation="Horizontal" VerticalAlignment="Top" Margin="10,0,0,0"> 
        <ContentControl Focusable="False" Content="ContentControl" 
     Background="{DynamicResource Brush_VectorIcon}" 
     Template="{DynamicResource vector_Summary}" 
     Height="16" Margin="0,5,0,0"/> 
     <TextBlock TextWrapping="Wrap" Text="{Binding SearchDisplayMessage}" Margin="5,3,0,0" VerticalAlignment="Center"/> 
      </StackPanel> 
     </Grid> 
     <Grid Grid.Row="2" Margin="5"> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="Auto"/> 
       <RowDefinition Height="*"/> 
      </Grid.RowDefinitions> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="*"/> 
       </Grid.ColumnDefinitions> 
       <DataGrid x:Name="dataGrid" 
        commands:ControlEvents.GridViewSelectionChangedEventCommand="{Binding SelectionItemsChangeCommand}" 
        SelectionMode="Single" 
        AutoGenerateColumns="True"      
        Margin="0,5" Grid.Row="1" IsReadOnly="True" 
        ItemsSource="{Binding GridItem, Mode=TwoWay}" SelectedItem="{Binding SelectedItem}" 
        AlternatingRowBackground="#FFF5F4F8" Background="White" Grid.ColumnSpan="2" 
        ScrollViewer.CanContentScroll="True" 
        ScrollViewer.HorizontalScrollBarVisibility="Auto" 
        ScrollViewer.VerticalScrollBarVisibility="Auto"> 
        <i:Interaction.Behaviors> 
         <Behaviors:SelectorDoubleClickCommandBehavior Command="{Binding GridDoubleclickcommand}"/> 
        </i:Interaction.Behaviors> 

       </DataGrid> 
      </Grid> 

     </Grid> 

    </Border> 

</Grid> 

只是为了补充一点,这里的DataGrid不是我正在使用的实际DataGrid。我的自定义DataGrid是从DataGrid派生的。但我已经试过这与正常的DataGrid,但似乎也没有工作。

回答

1

你有自动

<Grid Grid.Row="2" Margin="5"> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="Auto"/> 
        <RowDefinition Height="*"/> 
       </Grid.RowDefinitions> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="*"/> 
       </Grid.ColumnDefinitions> 
       <DataGrid x:Name="dataGrid" 
        SelectionMode="Single" 
        AutoGenerateColumns="True"      
        Margin="0,5" Grid.Row="1" IsReadOnly="True" 
        ItemsSource="{Binding GridItem, Mode=TwoWay}" SelectedItem="{Binding SelectedItem}" 
        AlternatingRowBackground="#FFF5F4F8" Background="White" Grid.ColumnSpan="2" 
        ScrollViewer.CanContentScroll="True" 
        ScrollViewer.HorizontalScrollBarVisibility="Auto" 
        ScrollViewer.VerticalScrollBarVisibility="Auto"> 
       </DataGrid> 
      </Grid> 

更改为

高度
<DataGrid Grid.Row="2" x:Name="dataGrid" 
        SelectionMode="Single" 
        AutoGenerateColumns="True"      
        Margin="0,5" Grid.Row="1" IsReadOnly="True" 
        ItemsSource="{Binding GridItem, Mode=TwoWay}" SelectedItem="{Binding SelectedItem}" 
        AlternatingRowBackground="#FFF5F4F8" Background="White" Grid.ColumnSpan="2" 
        ScrollViewer.CanContentScroll="True" 
        ScrollViewer.HorizontalScrollBarVisibility="Auto" 
        ScrollViewer.VerticalScrollBarVisibility="Auto"> 
       </DataGrid> 
+0

我按照建议做了,但滚动条似乎并没有出现,即使我将它设置为可见。我甚至试图将DataGrid放入一个ScrollViewer中,但在这种情况下,DataGrid延伸超出想象。我不介意在ScrollViewer中使用DataGrid,如果有一种方法可以限制DataGrid的列宽,从而允许每列伸展到它所包含数据的最大值。 –

+0

“The”滚动条 - 哪个?我没有关注。你能以小代码样本重现问题吗? – Paparazzi

+0

我已经设置了ScrollViewer.Horizo​​ntalScrollBarVisibility =“可见”。但是这并没有帮助。我的时间真的很短。所以,作为一种解决方法,我已经将DataGrid放在ScrollViewer中,并且在DataGrid的加载事件中,我将根据每个列中的内容大小调整列的大小。现在,问题似乎是我需要为每列设置MinWidth,否则如果数据很少,它们会缩小太多。 –

1

我不能猜你在做什么错了,因为你的代码的最缩放dopwn版本显示水平滚动条,我...

<UserControl.Resources> 
    <x:ArrayExtension x:Key="MyArray" Type="{x:Type TextBlock}"> 
     <TextBlock Name="Test1" Text="12345678" 
        DataContext="12345678" Tag="12345689"/> 
     <TextBlock Name="Test2" Text="12345678" 
        DataContext="12345678" Tag="12345689"/> 
     <TextBlock Name="Test1" Text="12345678" 
        DataContext="12345678" Tag="12345689"/> 
     <TextBlock Name="Test2" Text="12345678" 
        DataContext="12345678" Tag="12345689"/> 
     <TextBlock Name="Test1" Text="12345678" 
        DataContext="12345678" Tag="12345689"/> 
     <TextBlock Name="Test2" Text="12345678" 
        DataContext="12345678" Tag="12345689"/> 
     <TextBlock Name="Test1" Text="12345678" 
        DataContext="12345678" Tag="12345689"/> 
     <TextBlock Name="Test2" Text="12345678" 
        DataContext="12345678" Tag="12345689"/> 
     <TextBlock Name="Test1" Text="12345678" 
        DataContext="12345678" Tag="12345689"/> 
     <TextBlock Name="Test2" Text="12345678" 
        DataContext="12345678" Tag="12345689"/> 
     <TextBlock Name="Test1" Text="12345678" 
        DataContext="12345678" Tag="12345689"/> 
     <TextBlock Name="Test2" Text="12345678" 
        DataContext="12345678" Tag="12345689"/>    
    </x:ArrayExtension> 
</UserControl.Resources> 
<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="50"/> 
     <RowDefinition Height="*"/> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"/> 
    </Grid.ColumnDefinitions> 
    <TextBlock HorizontalAlignment="Left" 
       TextWrapping="Wrap" 
       Text="My Text Clock" 
       VerticalAlignment="Center" 
       Margin="10,10,0,10" FontSize="18.667" 
       FontFamily="Segoe UI" /> 
    <Border Grid.Row="1" CornerRadius="2" BorderThickness="1"> 
     <Grid> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="65"/> 
       <RowDefinition Height="Auto" /> 
       <RowDefinition Height="*"/> 
      </Grid.RowDefinitions> 
      <Border BorderThickness="1" 
       CornerRadius="2" Margin="5"> 
       <Grid Margin="0"> 
         <ListBox 
          ItemsSource="{Binding 
           ViewMenuItems}"        
          VerticalAlignment="Center" 
          HorizontalAlignment="Left"/>    
    </Grid> 
    </Border> 
    <Grid Grid.Row="1" Margin="5"> 
      <StackPanel HorizontalAlignment="Left" 
         Orientation="Horizontal" 
         VerticalAlignment="Top" Margin="10,0,0,0"> 
        <ContentControl Focusable="False" 
            Content="ContentControl" 
            Height="16" Margin="0,5,0,0"/> 
        <TextBlock TextWrapping="Wrap" 
           Text="DisplayHerePlz!" 
           Margin="5,3,0,0" 
           VerticalAlignment="Center"/> 
       </StackPanel> 
    </Grid> 
     <Grid Grid.Row="2" Margin="5"> 
      <Grid.RowDefinitions> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition Height="*"/> 
      </Grid.RowDefinitions> 
      <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="*"/> 
      </Grid.ColumnDefinitions> 
    <tk:DataGrid x:Name="dataGrid" 
      SelectionMode="Single" 
     AutoGenerateColumns="True" 
       Margin="0,5" Grid.Row="1" 
      IsReadOnly="True" 
      ItemsSource="{StaticResource MyArray}" 
      ScrollViewer.CanContentScroll="True" 
      ScrollViewer.HorizontalScrollBarVisibility="Auto" 
      ScrollViewer.VerticalScrollBarVisibility="Auto" 
     AlternatingRowBackground="#FFF5F4F8" 
      Background="White" 
      Grid.ColumnSpan="2">       
     </tk:DataGrid> 
    </Grid> 
    </Grid> 
    </Border> 
</Grid> 

它可能是我省略了其他位可能是导致水平宽度伸展超出滚动视图...

+0

感谢您付出的努力。只是想知道是否有什么明显的我失踪。我无法弄清楚尝试不同的解决方案,看看是什么问题。 –

0

这里有几件事你应该记住分配宽度属性od datagrid视图。定义您的列将最后一列的宽度设置为auto,并指定一些minWidth。

  <DataGrid VerticalAlignment="Top" Margin="0,0,0,0" Height="221" HorizontalAlignment="Left" Width="234" 
       DataContext="{DynamicResource ItemCollectionViewSource}" 
         ItemsSource="{Binding}" AutoGenerateColumns="False" IsReadOnly="True" 
         ScrollViewer.CanContentScroll="True" 
         ScrollViewer.VerticalScrollBarVisibility="Auto" 
         ScrollViewer.HorizontalScrollBarVisibility="Auto" > 
       <DataGrid.Columns> 
        <DataGridTextColumn Binding="{Binding ID}" Header="ID"/> 
        <DataGridTextColumn Binding="{Binding URL}" Header="URL" Width="Auto" MinWidth="186"/> 
       </DataGrid.Columns> 
      </DataGrid> 
4

我有一个类似的问题,没有显示水平滚动条。我有一个宽度为“*”的列。一旦我删除了这个滚动条出现了。我想如果你将宽度设置为固定的,它也会出现。

+0

这为我工作(但我实际上已将其从*更改为“自动”)。我相信滚动条会自动显示一个字段是否在网格*上运行*,但是如果列的大小与网格的大小相同,则技术上它不会在网格上运行/触发滚动条显示。 – iliketocode