2010-04-29 5 views
6

Je reçois beaucoup d'espace sous ma liste personnalisée si j'ajoute un élément avec plusieurs lignes de texte. Que puis-je faire pour résoudre ce problème?WPF Supprimer l'espace supplémentaire au bas de ListBox

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

Mon code

<!-- 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> 

CodeBehind

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; 
    } 
} 

Répondre

11

Actuellement, vous faites défiler l'élément par élément.

Le problème est que Test 5 dans votre zone de liste est l'élément suivant qui sera affiché (et il est plus grand que l'espace vide indiqué dans l'image que vous avez inclus). Seulement une fois que l'espace est suffisamment grand pour que le test 5 soit complètement affiché, il sera réellement affiché.

Cependant, si vous voulez un défilement fluide au lieu de point par point de défilement, définissez simplement la propriété ScrollViewer.CanContentScroll false.

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

Hope that helps!

+1

qui ont fixé mon changement de barre de défilement de la taille et l'espace vide au fond. Merci beaucoup pour l'explication. – Ryan

+0

Cela désactivera la virtualisation de l'interface utilisateur. –

+0

@Stephen Drew - Vrai, il va désactiver la virtualisation, avec les tailles d'objets étant différentes hauteur et en essayant d'obtenir une représentation correcte dans la barre de défilement, il est logique pourquoi ils ont conçu comme ça ... mais c'est une réponse de près de 4 ans il y a, et je crois qu'il y a plus d'options avec .NET 4.5: http://stackoverflow.com/questions/1977929/wpf-listbox-with-a-listbox-ui-virtualization-and-scrolling – Scott