2017-06-07 4 views
2

Ich habe das Steuerelement ToggleButton mit einem Control wie so angepasst:Teil der Steuerungstemplate in gestylten Steuerelementen ändern?

<StackPanel> 
    <StackPanel.Resources> 
     <Style x:Key="OptionBarButton" TargetType="{x:Type ToggleButton}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="ToggleButton"> 
         <Border Padding="18,12,18,12" Background="{TemplateBinding Background}"> 
          <ContentPresenter /> 
         </Border> 
         <ControlTemplate.Triggers> 
          <MultiTrigger> 
           <MultiTrigger.Conditions> 
            <Condition Property="IsChecked" Value="True" /> 
            <Condition Property="IsMouseOver" Value="True" /> 
           </MultiTrigger.Conditions> 
           <MultiTrigger.Setters> 
            <Setter Property="Background" Value="DarkBlue" /> 
           </MultiTrigger.Setters> 
          </MultiTrigger> 
          <MultiTrigger> 
           <MultiTrigger.Conditions> 
            <Condition Property="IsChecked" Value="True" /> 
            <Condition Property="IsMouseOver" Value="False" /> 
           </MultiTrigger.Conditions> 
           <MultiTrigger.Setters> 
            <Setter Property="Background" Value="SkyBlue" /> 
           </MultiTrigger.Setters> 
          </MultiTrigger> 
          <MultiTrigger> 
           <MultiTrigger.Conditions> 
            <Condition Property="IsChecked" Value="False" /> 
            <Condition Property="IsMouseOver" Value="False" /> 
           </MultiTrigger.Conditions> 
           <MultiTrigger.Setters> 
            <Setter Property="Background" Value="#88000000" /> 
           </MultiTrigger.Setters> 
          </MultiTrigger> 
          <MultiTrigger> 
           <MultiTrigger.Conditions> 
            <Condition Property="IsChecked" Value="False" /> 
            <Condition Property="IsMouseOver" Value="True" /> 
           </MultiTrigger.Conditions> 
           <MultiTrigger.Setters> 
            <Setter Property="Background" Value="#F0000000" /> 
           </MultiTrigger.Setters> 
          </MultiTrigger> 
         </ControlTemplate.Triggers> 

        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </StackPanel.Resources> 

    <ToggleButton Style="{StaticResource OptionBarButton}"> 
     <Image Source="../Assets/icons/action.png" Height="26" RenderOptions.BitmapScalingMode="Fant" /> 
    </ToggleButton> 

    <ToggleButton Style="{StaticResource OptionBarButton}"> 
     <Image Source="../Assets/icons/action2.png" Height="26" RenderOptions.BitmapScalingMode="Fant" /> 
    </ToggleButton> 

</StackPanel> 

Das funktioniert gut, aber ich würde jetzt einige Teile der Vorlage in einigen der Stil Kontrollen ändern möchten, nämlich die IsChecked Farbzustände (SkyBlue/DarkBlue).

Ist es möglich, diese Farben in der Vorlage zu ändern/zu übergeben, wenn Sie sie verwenden? Ich weiß, dass ich angefügte Eigenschaften verwenden kann und/oder die ToggleButton-Klasse untergliedern kann (indem ich ihr Abhängigkeitseigenschaften hinzufüge), aber ich frage mich, ob es nicht einen idiomatischen Weg gibt, dies zu lösen, vielleicht nur mit xaml. Das Schreiben von benutzerdefiniertem Code in C# scheint für einen so einfachen Anwendungsfall etwas übertrieben zu sein.

Antwort

3

Es gibt keinen einfachen Weg, dies ohne Code zu tun, soweit ich weiß, aber wenn Sie wirklich wollen - können Sie dynamische Ressourcen in gewisser Weise nutzen. Normalerweise werden dynamische Ressourcen verwendet, um das Erscheinen ALLER Instanzen der Kontrolle zur Laufzeit zu ändern. Sie verweisen auf die dynamische Ressource aus der Vorlage und ändern dann diese Ressource, und alle Steuerelemente spiegeln diese Änderung wider. Dies ist wahrscheinlich nicht das, was Sie in diesem Fall benötigen, da Sie "einige Teile der Vorlage in einigen der gestylten Steuerelemente" ändern möchten. Sie können es immer noch so machen:

<!-- default checked and over color --> 
<SolidColorBrush x:Key="TgCheckedAndOver" Color="DarkBlue" /> 
<!-- default checked color --> 
<SolidColorBrush x:Key="TgChecked" Color="SkyBlue" /> 
<Style 
     TargetType="{x:Type ToggleButton}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="ToggleButton"> 
       <Border Padding="18,12,18,12" 
         Background="{TemplateBinding Background}"> 
        <ContentPresenter /> 
       </Border> 
       <ControlTemplate.Triggers> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition Property="IsChecked" 
             Value="True" /> 
          <Condition Property="IsMouseOver" 
             Value="True" /> 
         </MultiTrigger.Conditions> 
         <MultiTrigger.Setters> 
          <Setter Property="Background" 
            Value="{DynamicResource TgCheckedAndOver}" /> 
         </MultiTrigger.Setters> 
        </MultiTrigger> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition Property="IsChecked" 
             Value="True" /> 
          <Condition Property="IsMouseOver" 
             Value="False" /> 
         </MultiTrigger.Conditions> 
         <MultiTrigger.Setters> 
          <Setter Property="Background" 
            Value="{DynamicResource TgChecked}" /> 
         </MultiTrigger.Setters> 
        </MultiTrigger> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition Property="IsChecked" 
             Value="False" /> 
          <Condition Property="IsMouseOver" 
             Value="False" /> 
         </MultiTrigger.Conditions> 
         <MultiTrigger.Setters> 
          <Setter Property="Background" 
            Value="#88000000" /> 
         </MultiTrigger.Setters> 
        </MultiTrigger> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition Property="IsChecked" 
             Value="False" /> 
          <Condition Property="IsMouseOver" 
             Value="True" /> 
         </MultiTrigger.Conditions> 
         <MultiTrigger.Setters> 
          <Setter Property="Background" 
            Value="#F0000000" /> 
         </MultiTrigger.Setters> 
        </MultiTrigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Dies ist die regelmäßige Verwendung von dynamischen Ressourcen. Nun, wenn Sie appearence wollen nur für bestimmte Steuerung ändern, können Sie dies tun:

<ToggleButton> 
    <ToggleButton.Resources> 
     <!-- override default resources --> 
     <SolidColorBrush x:Key="TgChecked" Color="Yellow" /> 
     <SolidColorBrush x:Key="TgCheckedAndOver" 
         Color="Green" /> 
    </ToggleButton.Resources> 
    <Image Source="../Assets/icons/action.png" Height="26" RenderOptions.BitmapScalingMode="Fant" /> 
</ToggleButton> 

Weil Sie neue Ressourcen stellen mit den gleichen Tasten „näher“ an die Steuerung - Vorlage wird sie anstelle von standardmässigen, und nur Diese besondere Kontrolle wird das tun, nicht alle.

+0

Ah, das ist großartig. Ich kann definitiv sehen, dass dies auch in anderen Szenarien nützlich ist. Vielen Dank! – monoceres

0

Leider sind ControlTemplates ein Alles-oder-Nichts-Ding. Wenn Sie die Farben, auf die Sie verweisen, ändern möchten, müssen Sie die Vorlagen wechseln. Ich nehme an, dass Verweise auf Ressourcen in der Vorlage keine Option für Sie ist.

Ich würde Abhängigkeitseigenschaften für jede der variablen Farben in OptionBarButton erstellen.

+0

Ok, ich verstehe. Gibt es eine andere Technik als ControlTemplates, die für diese Situation besser geeignet wäre? – monoceres

+0

Ich habe gerade die DynamicResource-Lösung gesehen. Ich mag es wirklich. Gehen Sie diesen Weg! – SuperJMN

Verwandte Themen