Wpf Custom Control switch ControlTemplate on Trigger

Question

I am very new to WPF and find the best way for me to learn is through small projects. I have a simple project consisting of a ResourceDictionary with two ControlTemplate and a Style. The style utilises Style.Triggers in order to set an alternate Template based on a Property.
This functions perfectly but it requires me to set a style for the control in the main window.

<ControlTemplate x:Key="TextBoxTemplate" TargetType="{x:Type TextBox}">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" MinWidth="120"/>
            </Grid.ColumnDefinitions>
            <ToggleButton Grid.Column="0" Background="AliceBlue"/>
        </Grid>
    </ControlTemplate>

    <ControlTemplate x:Key="TextBoxEnabledTemplate" TargetType="{x:Type TextBox}">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" MinWidth="120"/>
                <ColumnDefinition Width="20" MinWidth="0"/>
            </Grid.ColumnDefinitions>
            <ToggleButton Grid.Column="0" Background="AliceBlue" Grid.ColumnSpan="2"/>
            <TextBox Grid.Column="0" Background="Wheat"/>
        </Grid>
    </ControlTemplate>

    <Style x:Key="SwitchTemp" TargetType="{x:Type TextBox}">
        <Setter Property="OverridesDefaultStyle" Value="true"/>
        <Setter Property="Template" Value="{StaticResource TextBoxTemplate}"/>
        <Style.Triggers>
            <Trigger Property="IsEnabled" Value="true">
                <Setter Property="IsTabStop" Value="false"/>
                <Setter Property="Padding" Value="2"/>
                <Setter Property="Template" Value="{StaticResource TextBoxEnabledTemplate}"/>
            </Trigger>
        </Style.Triggers>
    </Style>

I would like to convert this into a Custom Control so that all I need to do is add the control and set the property as required.
Any assistance would be appreciated.

Answer 1

You could put the code in CustomControl, here is an example. I replaced IsEnable with IsMouseOver to show the demo effect.

Add CustomControl:
Right click on the project and add CustomControl named MyTextBox.
(You can also use WPF custom control library, please pay attention to the namespace reference when using.)
Project structure：

Generic.xaml:

<ResourceDictionary  
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
    xmlns:local="clr-namespace:CustomControlDemo">  

    <ControlTemplate x:Key="TextBoxEnabledTemplate" TargetType="{x:Type local:MyTextBox}">  
        <Grid>  
            <Grid.ColumnDefinitions>  
                <ColumnDefinition Width="*" MinWidth="120"/>  
                <ColumnDefinition Width="20" MinWidth="0"/>  
            </Grid.ColumnDefinitions>  
            <ToggleButton Grid.Column="0" Background="AliceBlue" Grid.ColumnSpan="2"/>  
            <TextBox Grid.Column="0" Background="Wheat"/>  
        </Grid>  
    </ControlTemplate>  
    <Style TargetType="{x:Type local:MyTextBox}" >  
        <Setter Property="Template">  
            <Setter.Value>  
                <ControlTemplate TargetType="{x:Type local:MyTextBox}">  
                    <Grid>  
                        <Grid.ColumnDefinitions>  
                            <ColumnDefinition Width="*" MinWidth="120"/>  
                        </Grid.ColumnDefinitions>  
                        <ToggleButton Grid.Column="0" Background="AliceBlue"/>  
                    </Grid>  
                </ControlTemplate>  
            </Setter.Value>  
        </Setter>  
        <Style.Triggers>  
            <Trigger Property="IsMouseOver" Value="true">  
                <Setter Property="IsTabStop" Value="false"/>  
                <Setter Property="Padding" Value="2"/>  
                <Setter Property="Template" Value="{StaticResource TextBoxEnabledTemplate}"/>  
            </Trigger>  
        </Style.Triggers>  
    </Style>  
</ResourceDictionary>  

MyTextBox.cs:

public class MyTextBox : TextBox  
  {  
    static MyTextBox()  
    {  
      DefaultStyleKeyProperty.OverrideMetadata(typeof(MyTextBox), new FrameworkPropertyMetadata(typeof(MyTextBox)));  
    }  
  }  

MainWindow.xaml:

<StackPanel>  
        <local:MyTextBox x:Name="tb1" Width="200" Height="100" />  
        <local:MyTextBox x:Name="tb2" Width="200" Height="100" />  

    </StackPanel>  

The result:

---

If the response is helpful, please click "Accept Answer" and upvote it.
 Note: Please follow the steps in our [documentation][5] to enable e-mail notifications if you want to receive the related email notification for this thread. 

[5]: https://learn.microsoft.com/en-us/answers/articles/67444/email-notifications.html