Troubleshooting a Silverlight Exception on the Pivot Control (System.Windows.FrameworkElement.Style)

I'm having a somewhat maddening issue just trying to get the Silverlight Pivot Control to work out of the box.

When I wire everything together, I see this stack trace in the JavaScript errors:

Unhandled Error in Silverlight Application Set property 'System.Windows.FrameworkElement.Style' threw an exception. [Line: 9 Position: 35]   at System.Windows.Application.LoadComponent(Object component, Uri resourceLocator)
   at VehiclePivotViewer.MainPage.InitializeComponent()
   at VehiclePivotViewer.MainPage..ctor(IDictionary`2 initParams)
   at VehiclePivotViewer.App.Application_Startup(Object sender, StartupEventArgs e)
   at MS.Internal.CoreInvokeHandler.InvokeEventHandler(Int32 typeIndex, Delegate handlerDelegate, Object sender, Object args)
   at MS.Internal.JoltHelper.FireEvent(IntPtr unmanagedObj, IntPtr unmanagedObjArgs, Int32 argsTypeIndex, Int32 actualArgsTypeIndex, String eventName)

I actually downloaded a helper library to dig further into that exception, and it looks like it's having a hard time with the MainPage.xaml markup, even though it all appears to be valid.

If it's helpful, I've listed the steps I took to set it all up below.

1. Create a new MVC3 web application
2. Create a Silve开发者_JAVA技巧rlight 4 application project in the same solution, and add it to the web project
3. Add the five System.Windows.Pivot assembly references

4. Add the control to my MainPage.xaml

   <Grid x:Name="LayoutRoot" Background="White">
       <Pivot:PivotViewer x:Name="Viewer" />
   </Grid>
   

5. Wire up the collection URL: Viewer.LoadCollection(initParams["CollectionUrl"], null);

6. Set the appropriate values in the view:

`

<div id="silverlightControlHost">
    <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
        <param name="source" value="ClientBin/xxxPivotViewer.xap"/>
        <param name="onError" value="onSilverlightError" />
        <param name="background" value="white" />
        <param name="minRuntimeVersion" value="4.0.50826.0" />
        <param name="autoUpgrade" value="true" />
        <param name="enableHtmlAccess" value="true" />
          <param name="initParams" value="collectionUrl=@ViewBag.CollectionUrl %>" />
        <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50826.0" style="text-decoration:none">
            <img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight" style="border-style:none"/>
        </a>
    </object><iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe></div>

`

Anyone have any thoughts or suggestions? I'm extremely new to Silverlight, and am kinda sorta pulling my hair out.

It looks like you are missing <% in front of @ViewBag.CollectionUrl.

I noticed that I had this same problem using only one of my two Visual Studio development machines. The offending machine likely had some wrong versions of the Silverlight dependencies installed, or was missing something crucial. A clean install of VS 2010 and all the Silverlight development tools, as well as the Pivot Control solved the issue. So, for anyone who happens to run into this post, this error may be caused by an incorrect/incomplete Silverlight/Pivot development environment.

Required tools are:

Visual Studio 2010. Get a free version for academics at Dreamspark

Silverlight 4 Tools for VS 2010

Silverlight 4 Toolkit

Silverlight Developer Runtime