Un style ComboBox personnalisé

J'essaie de créer un style personnalisé pour un WPF ComboBox mais quand je le fais, la liste déroulante ne s'ouvre pas, je veux utiliser le code XAML suivant créé à partir de mon style de boutons, mais le porter pour travailler avec un contrôle ComboBox, comment je vais faire cela pour que la liste déroulante s'affiche et me donnera la possibilité de changer les couleurs de la souris.Un style ComboBox personnalisé

<ControlTemplate TargetType="Button"> 
    <Border Name="border" 
      BorderThickness="{TemplateBinding BorderThickness}" 
      Padding="{TemplateBinding Padding}" 
      BorderBrush="{TemplateBinding BorderBrush}" 
      CornerRadius="1" 
      Background="{TemplateBinding Background}"> 
     <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
    </Border> 
    <ControlTemplate.Triggers> 
     <!--TODO: Set the right colors--> 
     <Trigger Property="IsMouseOver" Value="True"> 
      <Setter TargetName="border" Property="BorderBrush" Value="#FFC6C6C6" /> 
      <Setter Property="Foreground" Value="#FF333333" /> 
     </Trigger> 
     <Trigger Property="IsPressed" Value="True"> 
      <Setter Property="Foreground" Value="#FF666666" /> 
     </Trigger> 
     <Trigger Property="IsEnabled" Value="false"> 
      <Setter Property="Foreground" Value="#FFCCCCCC"/> 
     </Trigger> 
    </ControlTemplate.Triggers> 
</ControlTemplate>

Source

2011-08-01 Sandeep Bansal

Quel est votre objectif? Est-ce pour faire en sorte que le bouton ComboBox toggel ait le même style que les autres boutons de votre application ou pour ajouter des couleurs mouseover à chaque ComboBoxItem? Si ce dernier, vous pouvez le faire simplement en stylisant les éléments eux-mêmes. – sellmeadog

Sinon, je recommande de consulter le modèle de contrôle ComboBox par défaut et de modifier ce dont vous avez besoin car il s'agit d'un contrôle beaucoup plus complexe qu'un bouton: http://msdn.microsoft.com/fr-fr/library/ms752094(v= vs.85) .aspx – sellmeadog

Je voudrais que le modèle de contrôle de style ci-dessus soit recodé pour fonctionner avec une liste déroulante, y compris la bordure, etc. S'il y a un moyen plus facile d'enlever la couleur bleue, alors soyez mon invité –

ComboBoxes sont assez complexes, si vous changez un aspect de la ControlTemplate comme ces déclencheurs vous auriez besoin de fournir toutes les autres fonctionnalités ainsi, votre meilleur pari peut-être copier le modèle par défaut et l'ajuster. Les modèles par défaut peuvent être trouvés on MSDN (voir le lien Default WPF Themes).

Source

2011-08-02 00:14:36

C'est génial, c'était utile et ça m'a permis de progresser. Merci –

Si vous voulez changer l'apparence de l'ensemble du contrôle ComboBox, la meilleure chose à faire est de commencer avec le original template et le modifier pour répondre à vos besoins. Pour modifier la mise en surbrillance des éléments, vous devez réinitialiser la valeur HighlightBrushKey. Espérons que cette ressource est utile: http://bea.stollnitz.com/blog/?p=26

Source

2011-08-02 00:21:51 sellmeadog

+1 l'exemple a démontré une méthode de le faire. –

Vous devrez remplacer le modèle ComboBox par défaut pour le faire fonctionner correctement (voir cet article SO).

Avez-vous accès à Expression Blend? Vous pouvez l'utiliser pour extraire et modifier des modèles de contrôle. Je le trouve très utile aux modèles edit/.

Show Me the Templates est un autre outil pour afficher les modèles de contrôle.

Source

2011-08-02 00:23:00 Stuart

Vous pouvez essayer ce modèle et l'éditer comme vous le souhaitez.

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> 
    <ControlTemplate x:Key="ComboBoxToggleButton" TargetType="ToggleButton"> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition /> 
       <ColumnDefinition Width="20" /> 
      </Grid.ColumnDefinitions> 
      <Border 
      x:Name="Border" 
      Grid.ColumnSpan="2" 
      CornerRadius="0" 
      Background="#FF535353" 
      BorderBrush="#FF535353" 
      BorderThickness="0" /> 
      <Border 
      Grid.Column="0" 
      CornerRadius="0,0,0,0" 
      Margin="1" 
      Background="#FF323232" 
      BorderBrush="#FF535353" 
      BorderThickness="3,0,0,0" /> 
      <Path 
      x:Name="Arrow" 
      Grid.Column="1"  
      Fill="#3a3a3a" 
      HorizontalAlignment="Center" 
      VerticalAlignment="Center" 
      Data="M 0 0 L 4 4 L 8 0 Z"/> 
     </Grid> 
     <ControlTemplate.Triggers> 
      <Trigger Property="IsEnabled" Value="False"> 
       <Setter TargetName="Border" Property="Background" Value="LightGray" /> 
       <Setter TargetName="Border" Property="BorderBrush" Value="Gray" /> 
       <Setter Property="Foreground" Value="DarkGray"/> 
       <Setter TargetName="Arrow" Property="Fill" Value="DarkGray" /> 
      </Trigger> 
     </ControlTemplate.Triggers> 
    </ControlTemplate> 
    <ControlTemplate x:Key="ComboBoxTextBox" TargetType="TextBox"> 
     <Border x:Name="PART_ContentHost" Focusable="False" Height="30" BorderThickness="0" Background="Transparent" /> 
    </ControlTemplate> 
    <Style x:Key="CmoboboxStyle" TargetType="ComboBox"> 
     <Setter Property="SnapsToDevicePixels" Value="true"/> 
     <Setter Property="OverridesDefaultStyle" Value="true"/> 
     <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/> 
     <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/> 
     <Setter Property="ScrollViewer.CanContentScroll" Value="true"/> 
     <Setter Property="MinWidth" Value="120"/> 
     <Setter Property="MinHeight" Value="20"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="ComboBox"> 
        <Grid> 
         <ToggleButton 
        Name="ToggleButton" 
        Template="{StaticResource ComboBoxToggleButton}" 
        Grid.Column="2" 
        Focusable="false" 
        IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}" 
        ClickMode="Press"> 
         </ToggleButton> 
         <ContentPresenter 
         Name="ContentSite" 
         IsHitTestVisible="False" 
         Content="{TemplateBinding SelectionBoxItem}" 
         ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" 
         ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}" 
         Margin="8,0,0,0" 
         VerticalAlignment="Center" 
         HorizontalAlignment="Left" /> 
         <TextBox x:Name="PART_EditableTextBox" 
         Style="{x:Null}" 
         Template="{StaticResource ComboBoxTextBox}" 
         HorizontalAlignment="Left" 
         VerticalAlignment="Center" 
         Text="{TemplateBinding Text}" 
         Focusable="True" 
         Background="Transparent" 
         Visibility="Hidden" 
         Foreground="DarkBlue" 
         IsReadOnly="{TemplateBinding IsReadOnly}"/> 
         <Popup 
         Name="Popup" 
         Placement="Bottom" 
         IsOpen="{TemplateBinding IsDropDownOpen}" 
         AllowsTransparency="True" 
         Focusable="False" 
         PopupAnimation="Slide"> 
          <Grid 
          Name="DropDown" 
          SnapsToDevicePixels="True"     
          MinWidth="{TemplateBinding ActualWidth}" 
          MaxHeight="{TemplateBinding MaxDropDownHeight}"> 
           <Border 
           x:Name="DropDownBorder" 
           Background="#FF323232" 
           BorderThickness="4,0,0,0" 
           BorderBrush="#FF535353"/> 
           <ScrollViewer Margin="4,0,0,0" SnapsToDevicePixels="True"> 
            <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" /> 
           </ScrollViewer> 
          </Grid> 
         </Popup> 
        </Grid> 
        <ControlTemplate.Triggers> 
         <Trigger Property="HasItems" Value="false"> 
          <Setter TargetName="DropDownBorder" Property="MinHeight" Value="95"/> 
         </Trigger> 
         <Trigger Property="IsEnabled" Value="false"> 
          <Setter Property="Foreground" Value="LightGray"/> 
         </Trigger> 
         <Trigger Property="IsGrouping" Value="true"> 
          <Setter Property="ScrollViewer.CanContentScroll" Value="false"/> 
         </Trigger> 
         <Trigger SourceName="Popup" Property="Popup.AllowsTransparency" Value="true"> 
          <Setter TargetName="DropDownBorder" Property="CornerRadius" Value="0,0,0,0"/> 
          <Setter TargetName="DropDownBorder" Property="Margin" Value="0"/> 
         </Trigger> 
         <Trigger Property="IsEditable" 
      Value="true"> 
          <Setter Property="IsTabStop" Value="false"/> 
          <Setter TargetName="PART_EditableTextBox" Property="Visibility" Value="Visible"/> 
          <Setter TargetName="ContentSite" Property="Visibility" Value="Hidden"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
     <Style.Triggers> 
     </Style.Triggers> 
    </Style> 
</ResourceDictionary>

Source

2015-01-27 08:47:23

Un style ComboBox personnalisé

Répondre

Questions connexes