Comment ajouter une barre d'outils en bas, en haut, à gauche ou à droite de l'intérieur d'une zone de liste dans WPF?

Question

J'ai une listbox avec un style qui a des coins arrondis. Je voudrais ajouter une barre d'outils dans la zone de liste qui se rapporte à cette zone de liste spécifique. Actuellement, si j'ajoute une barre d'outils dans la grille qui contient une zone de liste, elle chevauchera le dernier élément de la ligne (en fonction de la hauteur de la barre d'outils). Quelqu'un at-il des idées sur la meilleure façon de mettre en œuvre cela? Je sais que je pourrais créer un contrôle des frontières qui correspond à l'aspect des bords listbox puis placez une zone de liste qui a un style sans frontières à l'intérieur de la frontière principale empilée avec la barre d'outils en bas, mais j'espère qu'il ya une meilleure façon de conserve mon style de listbox actuel et place juste une barre d'outils au bas de la listbox qui ne cache aucun élément de listbox.

Merci,

John

Answer 1

Je ne sais pas je suis tout à fait, mais je pense que vous avez deux options:

1. intégrons les ToolBar dans le modèle ListBox, probablement en écrivant un contrôle qui étend ListBox et ajoute une propriété pour définir la ToolBar articles.
2. Désactivez le Border sur le ListBox et collez votre propre Border autour de celui-ci qui englobe également le ToolBar.

2 est un peu plus facile et est probablement ce que vous voulez.

Exemple de 1

(je ne l'ai pas pris la peine ListBox subclassing ici - je viens de Codés en dur certains éléments toolbar à la place)

<Grid Margin="10"> 
     <ListBox> 
      <ListBox.Template> 
       <ControlTemplate TargetType="ListBox"> 
        <Border BorderThickness="{TemplateBinding Border.BorderThickness}" Padding="1,1,1,1" BorderBrush="{TemplateBinding Border.BorderBrush}" Background="{TemplateBinding Panel.Background}" Name="Bd" SnapsToDevicePixels="True" CornerRadius="5"> 
         <Grid> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="Auto"/> 
           <RowDefinition Height="*"/> 
          </Grid.RowDefinitions> 

          <ToolBarTray Background="White"> 
           <ToolBar Band="1" BandIndex="1"> 
            <Button> 
             Cut 
            </Button> 
            <Button> 
             Copy 
            </Button> 
            <Button> 
             Paste 
            </Button> 
           </ToolBar> 
           <ToolBar Band="2" BandIndex="1"> 
            <Button> 
             Undo 
            </Button> 
            <Button> 
             Redo 
            </Button> 
           </ToolBar> 
          </ToolBarTray> 
          <ScrollViewer Grid.Row="1" Padding="{TemplateBinding Control.Padding}" Focusable="False"> 
           <ItemsPresenter SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}" /> 
          </ScrollViewer> 
         </Grid> 
        </Border> 
        <ControlTemplate.Triggers> 
         <Trigger Property="UIElement.IsEnabled" Value="False"> 
          <Setter Property="Panel.Background" TargetName="Bd"> 
           <Setter.Value> 
            <DynamicResource ResourceKey="{x:Static SystemColors.ControlBrushKey}" /> 
           </Setter.Value> 
          </Setter> 
         </Trigger> 
         <Trigger Property="ItemsControl.IsGrouping" Value="True"> 
          <Setter Property="ScrollViewer.CanContentScroll" Value="False"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </ListBox.Template> 
      <ListBoxItem>One</ListBoxItem> 
      <ListBoxItem>Two</ListBoxItem> 
      <ListBoxItem>Three</ListBoxItem> 
     </ListBox> 
    </Grid> 

Exemple de 2

<Grid Margin="10"> 
    <Border CornerRadius="5" BorderThickness="1" BorderBrush="Black" Padding="1"> 
     <Grid> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="Auto"/> 
       <RowDefinition Height="*"/> 
      </Grid.RowDefinitions> 

      <ToolBarTray Background="White"> 
       <ToolBar Band="1" BandIndex="1"> 
        <Button> 
         Cut 
        </Button> 
        <Button> 
         Copy 
        </Button> 
        <Button> 
         Paste 
        </Button> 
       </ToolBar> 
       <ToolBar Band="2" BandIndex="1"> 
        <Button> 
         Undo 
        </Button> 
        <Button> 
         Redo 
        </Button> 
       </ToolBar> 
      </ToolBarTray> 
      <ListBox Grid.Row="1" BorderThickness="0"> 
       <ListBoxItem>One</ListBoxItem> 
       <ListBoxItem>Two</ListBoxItem> 
       <ListBoxItem>Three</ListBoxItem> 
      </ListBox> 
     </Grid> 
    </Border> 
</Grid> 

Dans les deux cas, le résultat est similaire:

alt text http://img42.imageshack.us/img42/372/screenshotof.png

Answer 2

vous avez probablement quelque chose de mal déclaré dans votre code, si les choses sont visuellement chevauchaient. Vous devez avoir votre ListBox déclaré avec Grid.Row = « 0 » et la barre d'outils comme Grid.Row = « 1 » (ou quelque chose de similaire) si vous les aimez pas se chevaucher. This MSDN article explique bien les dispositions de la grille.

Si vos ListBoxItems ne sont pas databound, vous pouvez simplement ajouter un ListBoxItem avec un style personnalisé comme dernier élément de votre liste. Sinon, vous pouvez utiliser un DataTemplateSelector pour formater vos styles d'éléments en fonction du contenu qui y est lié.