WPF删除ListBox底部的额外空间

问题描述：

如果我用多行文本添加项目，我会在自定义列表框中获得大量空间。我能做些什么来解决这个问题？WPF删除ListBox底部的额外空间

alt text http://i39.tinypic.com/2ut6e6x.png

我的代码

<!-- List Item Hover --> 
<LinearGradientBrush x:Key="MouseOverFocusStyle" StartPoint="0,0" EndPoint="0,1"> 
    <LinearGradientBrush.GradientStops> 
     <GradientStop Color="#FF013B73" Offset="0.501"/> 
     <GradientStop Color="#FF091F34"/> 
     <GradientStop Color="#FF014A8F" Offset="0.5"/> 
     <GradientStop Color="#FF003363" Offset="1"/> 
    </LinearGradientBrush.GradientStops> 
</LinearGradientBrush> 

<!-- List Item Selected --> 
<LinearGradientBrush x:Key="LostFocusStyle" EndPoint="0.5,1" StartPoint="0.5,0"> 
    <LinearGradientBrush.RelativeTransform> 
     <TransformGroup> 
      <ScaleTransform CenterX="0.5" CenterY="0.5"/> 
      <SkewTransform CenterX="0.5" CenterY="0.5"/> 
      <RotateTransform CenterX="0.5" CenterY="0.5"/> 
      <TranslateTransform/> 
     </TransformGroup> 
    </LinearGradientBrush.RelativeTransform> 
    <GradientStop Color="#FF091F34" Offset="1"/> 
    <GradientStop Color="#FF002F5C" Offset="0.4"/> 
</LinearGradientBrush> 

<!-- List Item Highlight --> 
<SolidColorBrush x:Key="ListItemHighlight" Color="#FFE38E27" /> 

<!-- List Item UnHighlight --> 
<SolidColorBrush x:Key="ListItemUnHighlight" Color="#FF6FB8FD" /> 

<Style TargetType="ListBoxItem"> 
    <EventSetter Event="GotFocus" Handler="ListItem_GotFocus"></EventSetter> 
    <EventSetter Event="LostFocus" Handler="ListItem_LostFocus"></EventSetter> 
</Style> 

<DataTemplate x:Key="CustomListData" DataType="{x:Type ListBoxItem}"> 
    <Border BorderBrush="Black" BorderThickness="1" Margin="-2,0,0,-1"> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBoxItem}}, Path=ActualWidth}" /> 
      </Grid.ColumnDefinitions> 
      <Label 
        VerticalContentAlignment="Center" BorderThickness="0" BorderBrush="Transparent" 
        Foreground="{StaticResource ListItemUnHighlight}" 
        FontSize="24" 
        Tag="{Binding .}" 
        Grid.Column="0" 
        MinHeight="55" 
        Cursor="Hand" 
        FontFamily="Arial" 
        FocusVisualStyle="{x:Null}" 
        KeyboardNavigation.TabNavigation="None" 
        Background="{StaticResource LostFocusStyle}" 
        MouseMove="ListItem_MouseOver" 
        > 
       <Label.ContextMenu> 
        <ContextMenu Name="editMenu"> 
         <MenuItem Header="Edit"/> 
        </ContextMenu> 
       </Label.ContextMenu> 
       <TextBlock Text="{Binding .}" Margin="15,0,40,0" TextWrapping="Wrap"></TextBlock> 
      </Label> 
      <Image 
       Tag="{Binding .}" 
       Source="{Binding}" 
       Margin="260,0,0,0" 
       Grid.Column="1" 
       Stretch="None" 
       Width="16" 
       Height="22" 
       HorizontalAlignment="Center" 
       VerticalAlignment="Center" 
       /> 
     </Grid> 
    </Border> 
</DataTemplate> 

</Window.Resources> 

<Window.DataContext> 
<ObjectDataProvider ObjectType="{x:Type local:ImageLoader}" MethodName="LoadImages" /> 
</Window.DataContext> 


<ListBox ItemsSource="{Binding}" Width="320" Background="#FF021422" BorderBrush="#FF1C4B79" > 

<ListBox.Resources> 
    <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}">Transparent</SolidColorBrush> 

    <Style TargetType="{x:Type ListBox}"> 
     <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" /> 
     <Setter Property="ItemTemplate" Value="{StaticResource CustomListData }" /> 
    </Style> 

</ListBox.Resources>

代码隐藏

public static class ImageLoader 
{ 
    public static List<String> LoadImages() 
    { 
     List<String> images = new List<String>(); 
     for (int x = 0; x < 10; x++) 
     { 
      if (x == 5) 
      { 
       images.Add("Test Test Test Test Test Test Test Test Test TestTest Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test" + x); 
      } 
      else 
      { 
       images.Add("Test " + x); 
      } 
     } 
     return images; 
    } 
}

答

当前您正在逐项滚动。

问题是因为您的列表框中的测试5是将显示的下一个项目（并且它大于您包含的图片中显示的空白空间）。只有这个空间足够大才能使测试5完全显示出来，它才会真正显示出来。

但是，如果您想要平滑滚动而不是逐项滚动，只需将ScrollViewer.CanContentScroll属性设置为false即可。

<ListBox ScrollViewer.CanContentScroll="False" ItemsSource="{Binding}" Width="320" Background="#FF021422" BorderBrush="#FF1C4B79" >

希望有所帮助！

这固定我的滚动条大小更改和底部的空白。非常感谢解释。 – Ryan 2010-04-29 19:31:17

虽然这将禁用UI虚拟化。 – 2014-02-28 11:05:21

@Stephen Drew - 这是真的，它会禁用虚拟化，物品大小是不同的高度，并试图在滚动条中得到适当的表示，这是有道理的，他们为什么这样设计它......但这是近4年的答案以前，我相信在.NET 4.5中有更多的选择：http://stackoverflow.com/questions/1977929/wpf-listbox-with-a-listbox-ui-virtualization-and-滚动 – Scott 2014-02-28 14:40:24

答

作为一个快速的答案，如果有人来解决此在.NET 4.5

VirtualizingStackPanel.IsVirtualizing="True" 
VirtualizingStackPanel.ScrollUnit="Pixel"

会做的伎俩。为更好的解释看看： http://www.jonathanantoine.com/2011/10/07/wpf-4-5-%E2%80%93-part-11-new-features-for-the-virtualizingpanel/

WPF删除ListBox底部的额外空间

相关推荐