WP7 Visual State Issues

UPDATE:

Download a small test application here.

I have a user control consisting of a border, a button, and a text block. When the control is pressed, I show the popup menu control. I'm having a problem using the visual state to enable and disable the control correctly.

When I turn on and off the control in normal mode using the normal and disabled visual state, it works fine:

Included:

Disabled:

If I click on the control and then turn off the control, the background will remain white:

Any ideas?

: , , . , - , , .

:

<Style
    TargetType="Controls:PickerBoxButton">

    <Setter
        Property="Background"
        Value="Transparent" />

    <Setter
        Property="BorderBrush"
        Value="{StaticResource PhoneForegroundBrush}" />

    <Setter
        Property="Foreground"
        Value="{StaticResource PhoneForegroundBrush}" />

    <Setter
        Property="BorderThickness"
        Value="{StaticResource PhoneBorderThickness}" />

    <Setter
        Property="FontFamily"
        Value="{StaticResource PhoneFontFamilyNormal}" />

    <Setter
        Property="FontSize"
        Value="{StaticResource PhoneFontSizeMediumLarge}" />

    <Setter
        Property="Padding"
        Value="8,3,8,5" />

    <Setter
        Property="Template">

        <Setter.Value>

            <ControlTemplate
                TargetType="Controls:PickerBoxButton">

                <Grid
                    Background="Transparent">

                    <VisualStateManager.VisualStateGroups>

                        <VisualStateGroup
                            x:Name="CommonStates">

                            <VisualState
                                x:Name="Normal">
                                <Storyboard>

                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetName="ButtonBackground"
                                        Storyboard.TargetProperty="BorderBrush">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource PhoneForegroundBrush}" />
                                    </ObjectAnimationUsingKeyFrames>

                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetName="PickerButton"
                                        Storyboard.TargetProperty="Background">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource PhoneTextBoxBrush}" />
                                    </ObjectAnimationUsingKeyFrames>

                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetName="PickerText"
                                        Storyboard.TargetProperty="Foreground">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource PhoneTextBoxForegroundBrush}" />
                                    </ObjectAnimationUsingKeyFrames>

                                </Storyboard>

                            </VisualState>

                            <VisualState
                                x:Name="Disabled">
                                <Storyboard>

                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetName="ButtonBackground"
                                        Storyboard.TargetProperty="BorderBrush">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource PhoneDisabledBrush}" />
                                    </ObjectAnimationUsingKeyFrames>

                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetName="PickerButton"
                                        Storyboard.TargetProperty="Background">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource PhoneChromeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>

                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetName="PickerText"
                                        Storyboard.TargetProperty="Foreground">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource PhoneDisabledBrush}" />
                                    </ObjectAnimationUsingKeyFrames>

                                </Storyboard>
                            </VisualState>

                        </VisualStateGroup>

                    </VisualStateManager.VisualStateGroups>

                    <Border
                        x:Name="ButtonBackground"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        CornerRadius="0"
                        Background="{TemplateBinding Background}"
                        Margin="6,8,8,0"
                        >

                        <Button
                            x:Name="PickerButton"
                            BorderThickness="0"
                            Height="64"
                            HorizontalAlignment="Left"
                            Margin="-12,-12,0,-12"
                            VerticalAlignment="Top"
                            Width="700">

                            <StackPanel
                                Orientation="Horizontal"
                                Width="700">
                                <TextBlock
                                    x:Name="PickerText"
                                    Margin="-2, 0, 0, 0"
                                    />
                            </StackPanel>

                        </Button>

                    </Border>

                </Grid>

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

, .

private bool _isReadOnly;
public bool IsReadOnly
{
    get { return _isReadOnly; }
    set
    {
        _isReadOnly = value;

        UpdateVisualState();
    }
}

private void UpdateVisualState()
{
    VisualStateManager.GoToState(this, IsReadOnly ? "Disabled" : "Normal", false);
}