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). 

Comments (0)