Search code examples
silverlightsilverlight-toolkit

SpinnerStyle not working on Silverlight NumericUpDownControl


I have a NumericUpDown control in Silverlight that I want to not have a spinner.

<Style x:Key="NoSpinner" TargetType="toolkit:Spinner">
    <Setter Property="Visibility" Value="Collapsed" />
</Style>

the control:

<toolkit:NumericUpDown SpinnerStyle="{StaticResource NoSpinner}" />

But the spinner still shows! I am doing this the way the author of this control suggests (link).

I know that the resource is being found. No errors are given, and I am able to apply other styles defined in the same area.


Solution

  • I didn't have Blend, which makes it really difficult to edit the templates of these controls if you don't have access to what the standard template is. The solution to this was getting a preview copy of blend and using it to re-template the control.

    <Style TargetType="toolkit:NumericUpDown" x:Key="InputNumericUpDown">
        <Setter Property="Width" Value="111" />
        <Setter Property="Height" Value="23" />
        <Setter Property="IsTabStop" Value="False" />
        <Setter Property="HorizontalAlignment" Value="Left" />
        <Setter Property="Margin" Value="5,0,0,5"/>    
        <Setter Property="Template"><!-- This template was generated in Blend -->
            <Setter.Value>
                <ControlTemplate TargetType="toolkit:NumericUpDown">
                    <Grid>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition GeneratedDuration="0"/>
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="DisabledVisualElement"/>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="FocusStates">
                                <VisualState x:Name="Focused">
                                    <Storyboard>
                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualElement">
                                            <SplineDoubleKeyFrame KeyTime="0" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Unfocused"/>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <toolkit:ButtonSpinner x:Name="Spinner" HorizontalContentAlignment="Stretch" MinWidth="35" VerticalContentAlignment="Stretch" IsTabStop="False">
                            <TextBox x:Name="Text" AcceptsReturn="False" BorderThickness="0" Foreground="{TemplateBinding Foreground}" FontWeight="{TemplateBinding FontWeight}" FontStyle="{TemplateBinding FontStyle}" FontStretch="{TemplateBinding FontStretch}" FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}" MinWidth="20" TextAlignment="Right" TextWrapping="NoWrap" Text="{TemplateBinding Value}" IsTabStop="True">
                                <TextBox.Style>
                                    <Style TargetType="TextBox">
                                        <Setter Property="Template">
                                            <Setter.Value>
                                                <ControlTemplate TargetType="TextBox">
                                                    <ScrollViewer x:Name="ContentElement" BorderThickness="0" Padding="0"/>
                                                </ControlTemplate>
                                            </Setter.Value>
                                        </Setter>
                                    </Style>
                                </TextBox.Style>
                            </TextBox>
                        </toolkit:ButtonSpinner>
                        <Border x:Name="DisabledVisualElement" Background="#A5FFFFFF" CornerRadius="2.5,2.5,2.5,2.5" IsHitTestVisible="false" Opacity="0"/>
                        <Border x:Name="FocusVisualElement" BorderBrush="#FF45D6FA" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="1,1,1,1" IsHitTestVisible="False" Opacity="0"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    

    The Template part is the only part that came from blend, but that style is what I am using for NumericUpDowns to make it to where you tab once to get to the control and once to get out.