2009-10-09 5 views
7

Donc le fait est que j'ai un ControlTemplate principal qui définit les choses les plus basiques pour le nouveau look de bouton que nous concevons. Mais je veux faire 3 autres modèles de contrôle pour ce bouton afin que nous puissions définir des couleurs différentes dans ceux-ci; mais je ne veux pas copier coller le ControlTemplate principal et changer la couleur là, à la place je veux "hériter" de cela (comme avec la propriété BasedOn dans Style) et changer la couleur dans le ControlTemplate hérité.Est-il possible d'étendre un ControlTemplate de la même manière que vous étendez un style dans WPF?

Est-ce possible?

Merci!

Répondre

6

Trouvé la solution. Vous ne développez pas ControlTemplates, vous définissez à la place tout le comportement de base souhaité, puis vous laissez un style ou le contrôle lui-même le modifier. Prenons l'exemple ci-dessous par exemple. Le ControlTemplate définit le OpacityMask et les coins ronds pour mon rectangle, les Styles définit la couleur de l'arrière-plan pour chaque bouton (avec l'aide d'un TemplateBinding), et il est ma solution:

<Window.Resources> 
     <ControlTemplate x:Key="BaseMainButtonTemplate" TargetType="{x:Type Button}"> 
      <Grid TextBlock.Foreground="White" TextBlock.FontFamily="Calibri"> 
       <Rectangle Stroke="#FFE8E6E6" x:Name="rectangle" RadiusX="14.5" RadiusY="14.5" Fill="{TemplateBinding Property=Background}"> <!-- This TemplateBinding takes the color set by the style and applies it to the rectangle. Doing it this way, allows the style to modify the background color --> 
        <Rectangle.OpacityMask> 
         <LinearGradientBrush EndPoint="0,1" SpreadMethod="Reflect"> 
          <GradientStop Offset="0" Color="Transparent"></GradientStop> 
          <GradientStop Offset="1" Color="Gray"></GradientStop> 
         </LinearGradientBrush> 
        </Rectangle.OpacityMask> 
       </Rectangle> 
       <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" RecognizesAccessKey="True"/> 
      </Grid> 
      <ControlTemplate.Triggers> 
       <!-- OpacityMask when it's Focused, Defaulted and Mouse is over --> 
       <Trigger Property="IsFocused" Value="True"/> 
       <Trigger Property="IsMouseOver" Value="True"> 
        <Setter Property="OpacityMask" TargetName="rectangle"> 
         <Setter.Value> 
          <LinearGradientBrush EndPoint="0,1" SpreadMethod="Repeat"> 
           <GradientStop Offset="1" Color="Transparent"></GradientStop> 
           <GradientStop Offset="0" Color="Gray"></GradientStop> 
          </LinearGradientBrush> 
         </Setter.Value> 
        </Setter> 
       </Trigger> 
       <!-- OpacityMask when it's pressed --> 
       <Trigger Property="IsPressed" Value="True"> 
        <Setter Property="Stroke" TargetName="rectangle"> 
         <Setter.Value> 
          <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
           <GradientStop Color="#FF223472" Offset="0"/> 
           <GradientStop Color="#FFF2F0F0" Offset="0.911"/> 
          </LinearGradientBrush> 
         </Setter.Value> 
        </Setter> 
        <Setter Property="StrokeThickness" TargetName="rectangle" Value="3"/> 
       </Trigger> 
      </ControlTemplate.Triggers> 
     </ControlTemplate> 
     <Style x:Key="BlueButtonStyle" TargetType="{x:Type Button}"> 
      <Setter Property="Background" Value="Blue" /> 
      <Setter Property="Template" Value="{StaticResource BaseMainButtonTemplate}"> 
      </Setter> 
     </Style> 
     <Style x:Key="RedButtonStyle" TargetType="{x:Type Button}"> 
      <Setter Property="Background" Value="Red" /> 
      <Setter Property="Template" Value="{StaticResource BaseMainButtonTemplate}"> 
      </Setter> 
     </Style> 
     <Style x:Key="GreenButtonStyle" TargetType="{x:Type Button}"> 
      <Setter Property="Background" Value="Green" /> 
      <Setter Property="Template" Value="{StaticResource BaseMainButtonTemplate}"> 
      </Setter> 
     </Style> 
    </Window.Resources> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto" /> 
     </Grid.RowDefinitions> 
     <StackPanel> 
      <Button Style="{StaticResource BlueButtonStyle}" Height="30" Content="Test"> 
      </Button> 
      <Button Style="{StaticResource RedButtonStyle}" Height="30" Content="Test"> 
      </Button> 
      <Button Style="{StaticResource GreenButtonStyle}" Height="30" Content="Test"> 
      </Button> 
     </StackPanel> 
    </Grid> 
+0

Oui, c'est la meilleure façon de le faire. Lâchement, le ControlTemplate devrait définir ce qui est là, le style modifie les propriétés sur le ControlTemplate pour définir à quoi il ressemble réellement. –

+0

Si votre modèle de contrôle contient des attributs que votre contrôle ne possède pas, cela ne fonctionne pas. –

0

Alternativement, vous pouvez définir un " DynamicResource "référence à toute propriété de dépendance dans votre modèle de contrôle et le faire aller résoudre sa valeur étant donné la présence de ressources disponibles. Par exemple, vous pouvez définir Background = "{DynamicResource SomeBrushColorVariable}" Ensuite, SomeBrushColorVariable peut changer en fonction de ResourceDictionaries différentes qui sont fusionnées dans votre fichier App.xaml ou même définies par l'utilisateur en fonction des paramètres d'affichage des préférences utilisateur ou du modèle de couleurs.

Questions connexes