Question

I’m writing a control that inherits from a RadioButton and doesn’t do anything more spectacular than display an image and hide the default circle.

One thing I haven’t been able to find out about is if I have to re-implement all the VisualStates again in my ControlTemplate, or can I simply put them as an empty element and they’re inherited?

My XAML is below, the original RadioButton is on MSDN.

<Style TargetType="local:ImageRadioButton">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="local:ImageRadioButton">
                <Grid>
                    <vsm:VisualStateManager.VisualStateGroups>
                        <vsm:VisualStateGroup x:Name="CommonStates">
                            <vsm:VisualState x:Name="Normal"/>
                            <vsm:VisualState x:Name="MouseOver">
                                <Storyboard/> <!-- mouseover -->
                            </vsm:VisualState>
                            <vsm:VisualState x:Name="Pressed" />
                            <vsm:VisualState x:Name="Disabled"/>
                            <!-- TODO -->
                        </vsm:VisualStateGroup>
                        <vsm:VisualStateGroup x:Name="CheckStates">
                            <vsm:VisualState x:Name="Checked">
                                <Storyboard/>
                                <!-- checked -->
                            </vsm:VisualState>
                            <vsm:VisualState x:Name="Unchecked"/>
                        </vsm:VisualStateGroup>

                        <vsm:VisualStateGroup x:Name="FocusStates">
                            <vsm:VisualState x:Name="Focused" />
                            <vsm:VisualState x:Name="Unfocused" />
                        </vsm:VisualStateGroup>
                        <vsm:VisualStateGroup x:Name="ValidationStates">
                            <vsm:VisualState x:Name="Valid"/>
                            <vsm:VisualState x:Name="InvalidUnfocused" />
                            <vsm:VisualState x:Name="InvalidFocused" />
                        </vsm:VisualStateGroup>
                    </vsm:VisualStateManager.VisualStateGroups>

                    <ContentPresenter/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 1

You don’t have to reimplement the visual states but they won’t be “inherited” either. If you specify a new DefaultStyleKey for your new control you get nothing from the original style.

If you want your new control to modify its appearance to represent its current state such as whether it has the focus or whether its selected you will need to include a the appropriate set of VisualStateGroups. Then include in the VisualState elements the appropriate animations to change your new version of the button’s UI.