Creating a custom control in Cider

Here's the quick way to create a custom control in Cider. 

  • Right click on project in Solution Explorer
  • Choose “Add > New Item”
  • Choose “Custom Control (WPF)”
  • Two files will be generated – CustomControl1.cs and Themes\Generic.xaml

In the Themes\Generic.xaml you can edit the default template for the control.

<Style TargetType="{x:Type local:CustomControl1}">

       

        <Setter Property="Background"

               Value="Blue"></Setter>

        <Setter Property="BorderThickness"

               Value="1" />

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType="{x:Type local:CustomControl1}">

                    <Border Background="{TemplateBinding Background}"

                           BorderBrush="{TemplateBinding BorderBrush}"

                           BorderThickness="{TemplateBinding BorderThickness}">

                    </Border>

                    <ControlTemplate.Triggers>

                        <Trigger Property="IsMouseOver" Value="True">

                            <Setter Property="BorderBrush" Value="Black"/>

                        </Trigger>

                    </ControlTemplate.Triggers>

                </ControlTemplate>

            </Setter.Value>

        </Setter>

    </Style>

Note that using a UserControl may be a better experience -- and definately if you can retemplate an existing WPF control that may give you a bit better performance (as it avoids loading and parsing a separate BAML stream).