ArgumentException when styling ContextMenu template

Question

I'm trying to override the default template for the Windows Phone Control Toolkit ContextMenu control. When I copy and paste the Style (without modification) from Generix.xaml in the Toolkit source code and run, on long press I get

ArgumentException: Value does not fall within the expected range.

If I remove it, then it works fine. Overriding the templates for the MenuItem and Separator controls also works without problem.

Here is the default Style defined in the Toolkit:

<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:controls="clr-namespace:Microsoft.Phone.Controls"
xmlns:primitives="clr-namespace:Microsoft.Phone.Controls.Primitives">

    <Style TargetType="controls:ContextMenu">
        <Setter Property="Padding" Value="0 18 0 28"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="controls:ContextMenu">
                    <StackPanel x:Name="OuterPanel">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="VisibilityStates">
                                <VisualState x:Name="Open">
                                    <Storyboard>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="ScaleX" Storyboard.TargetProperty="ScaleX">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.3" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="ScaleY" Storyboard.TargetProperty="ScaleY">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:.3" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:.42" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>

                                        <DoubleAnimation Duration="0" Storyboard.TargetName="Border1" Storyboard.TargetProperty="Opacity" To="1"/>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="Border2" Storyboard.TargetProperty="Opacity" To="1"/>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="Border1Reversed" Storyboard.TargetProperty="Opacity">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.4099" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.41" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="Border2Reversed" Storyboard.TargetProperty="Opacity">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.4099" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.41" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="OpenReversed">
                                    <Storyboard>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="ScaleX" Storyboard.TargetProperty="ScaleX">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.3" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="ScaleY" Storyboard.TargetProperty="ScaleY">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.3" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.42" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>

                                        <DoubleAnimation Duration="0" Storyboard.TargetName="Border1Reversed" Storyboard.TargetProperty="Opacity" To="1"/>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="Border2Reversed" Storyboard.TargetProperty="Opacity" To="1"/>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="Border1" Storyboard.TargetProperty="Opacity">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.4099" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.41" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="Border2" Storyboard.TargetProperty="Opacity">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.4099" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.41" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="OpenLandscape">
                                    <Storyboard>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="ScaleX" Storyboard.TargetProperty="ScaleY">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.3" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="ScaleY" Storyboard.TargetProperty="ScaleX">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.3" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.42" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>

                                        <DoubleAnimation Duration="0" Storyboard.TargetName="Border1" Storyboard.TargetProperty="Opacity" To="1"/>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="Border2" Storyboard.TargetProperty="Opacity" To="1"/>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="Border1Reversed" Storyboard.TargetProperty="Opacity">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.4099" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.41" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="Border2Reversed" Storyboard.TargetProperty="Opacity">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.4099" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.41" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="OpenLandscapeReversed">
                                    <Storyboard>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="ScaleX" Storyboard.TargetProperty="ScaleY">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.3" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="ScaleY" Storyboard.TargetProperty="ScaleX">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.3" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.42" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>

                                        <DoubleAnimation Duration="0" Storyboard.TargetName="Border1Reversed" Storyboard.TargetProperty="Opacity" To="1"/>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="Border2Reversed" Storyboard.TargetProperty="Opacity" To="1"/>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="Border1" Storyboard.TargetProperty="Opacity">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.4099" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.41" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                        <DoubleAnimationUsingKeyFrames Duration="0:0:0.42" Storyboard.TargetName="Border2" Storyboard.TargetProperty="Opacity">
                                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.4099" Value="0"/>
                                            <LinearDoubleKeyFrame KeyTime="0:0:0.41" Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Closed">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="ScaleX" Storyboard.TargetProperty="ScaleX" To="0"/>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="ScaleX" Storyboard.TargetProperty="ScaleY" To="0"/>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="ScaleY" Storyboard.TargetProperty="ScaleY" To="0"/>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="ScaleY" Storyboard.TargetProperty="ScaleX" To="0"/>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="Border1" Storyboard.TargetProperty="Opacity" To="0"/>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="Border2" Storyboard.TargetProperty="Opacity" To="0"/>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="Border1Reversed" Storyboard.TargetProperty="Opacity" To="0"/>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="Border2Reversed" Storyboard.TargetProperty="Opacity" To="0"/>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <StackPanel.RenderTransform>
                            <ScaleTransform x:Name="ScaleX"/>
                        </StackPanel.RenderTransform>

                        <Rectangle MinWidth="2" MinHeight="2" Fill="{TemplateBinding BorderBrush}" x:Name="Border1"/>
                        <Rectangle MinWidth="2" MinHeight="2" Fill="{TemplateBinding Background}" x:Name="Border2"/>
                        <Grid x:Name="InnerGrid" Background="{TemplateBinding Background}">
                            <Grid.RenderTransform>
                                <ScaleTransform x:Name="ScaleY"/>
                            </Grid.RenderTransform>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <ItemsPresenter Margin="{TemplateBinding Padding}" Grid.Row="1"/>
                        </Grid>
                        <Rectangle MinWidth="2" MinHeight="2" Fill="{TemplateBinding Background}" x:Name="Border1Reversed"/>
                        <Rectangle MinWidth="2" MinHeight="2" Fill="{TemplateBinding BorderBrush}" x:Name="Border2Reversed"/>
                    </StackPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

I've also tried removing various portions, such as the VisualStateGroups, but no luck.

Edit: The exception is a ApplicationUnhandledExceptionEventArgs object in the Application_UnhandledException event. The object provides no additional information.

Answer 1

you have to use it as exactly the way the source code has it along with the missing xaml part.

Try this with your code [Missing XAML]

<TextBlock Text="Press and Hold to Show the ContextMenu">
    <toolkit:ContextMenuService.ContextMenu>
        <toolkit:ContextMenu>
            <toolkit:ContextMenu.Template>
                <ControlTemplate TargetType="toolkit:ContextMenu">
                    <StackPanel Width="300" x:Name="OuterPanel">
                        <Grid x:Name="InnerGrid"/>
                        <Path Name="UpperLeftPath" Data="M0,1 L1,1 L1,0" Fill="Green" Stretch="Fill" Margin="12,0" Height="12" Width="18" HorizontalAlignment="Center"/>
                        <Border BorderBrush="Green" BorderThickness="2" Background="#ff20AD2A">
                        <ItemsPresenter/>
                    </Border>
                    </StackPanel>
                </ControlTemplate>
            </toolkit:ContextMenu.Template>
            <toolkit:MenuItem Header="Item1"/>
        </toolkit:ContextMenu>
    </toolkit:ContextMenuService.ContextMenu>
</TextBlock>