Magellan Quickstart

Back to: Magellan Home

This guide will walk you through getting started with Magellan. You will need a copy of Visual Studio 2008 with Service Pack 1.

Project Setup

  1. Download the Magellan library. Unzip it to a known location.
  2. Create a new WPF Application project using Visual Studio 2008.
  3. Add references to Magellan.dll and System.Windows.Interactivity.dll from the ZIP file that you downloaded.
  4. Create the following folder structure:

A new VS project, ready for Magellan

Create a model

In the Views/Home folder, add a class named AddModel. This will represent the view model of an addition action:

public class AddModel
{
    public int A { get; set; }
    public int B { get; set; }
    public int Result { get; set; }
}

Create a controller

Create a new class in the Controllers folder named HomeController. It will contain two actions - Index, which will be the input page, and Add, which will show the results:

using Magellan.Framework;

namespace MagellanHelloWorld.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            return Page();
        }

        public ActionResult Add(int a, int b)
        {
            Model = new AddModel
            {
                A = a,
                B = b,
                Result = a + b
            };
            return Page();
        }
    }
}

Now wire up the controller in App.xaml.cs:

using System.Windows;
using Magellan.Framework;
using MagellanHelloWorld.Controllers;

namespace MagellanHelloWorld
{
    public partial class App : Application
    {
        protected override void OnStartup(StartupEventArgs e)
        {
            var controllerFactory = new ControllerFactory();
            controllerFactory.Register("Home", () => new HomeController());
            ControllerBuilder.Current.SetControllerFactory(controllerFactory);

            base.OnStartup(e);
        }
    }
}

Set up the shell

In Window1.xaml, add a Frame element to the content:

<Window 
    x:Class="MagellanHelloWorld.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="300"
    >
    <Grid>
        <Frame Name="mainFrame" />
    </Grid>
</Window>

In the Window1 constructor, navigate the mainFrame to the Index action on your controller.

using System.Windows;
using Magellan;

namespace MagellanHelloWorld
{
    public partial class Window1 : Window
    {
        public Window1()
        {
            InitializeComponent();

            Navigator.For(mainFrame).Navigate("Home", "Index");
        }
    }
}

Create the views

In the Views/Home folder, create two new Page files: Index.xaml and Add.xaml.

Index.xaml will be used to capture the inputs, and send them to the Add action on the controller. Notice how the Parameters are defined as part of the Navigation behavior:

<Page 
    x:Class="MagellanHelloWorld.Views.Home.Index"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" 
    xmlns:magellan="http://xamlforge.com/magellan" 
    Title="Index"
    >
    <StackPanel>
        <TextBox Name="parameterA" />
        <TextBlock Text="+" />
        <TextBox Name="parameterB" />

        <Button Content="Calculate">
            <i:Interaction.Behaviors>
                <NavigateBehavior Controller="Home" Action="Add">
                    <NavigateBehavior.Parameters>
                        <Parameter ParameterName="a" Value="{Binding ElementName=parameterA, Path=Text}" />
                        <Parameter ParameterName="b" Value="{Binding ElementName=parameterB, Path=Text}" />
                    </NavigateBehavior.Parameters>
                </NavigateBehavior>
            </i:Interaction.Behaviors>
        </Button>
    </StackPanel>
</Page>

The Add.xaml will show the output of the calculation. Note how it assumes the use of DataContext in the bindings.

<Page 
    x:Class="MagellanHelloWorld.Views.Home.Add"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" 
    Title="Add"
    >
    <StackPanel>
        <WrapPanel>
            <TextBlock Text="{Binding Path=A}" />
            <TextBlock Text="+" />
            <TextBlock Text="{Binding Path=B}" />
            <TextBlock Text="=" />
            <TextBlock Text="{Binding Path=Result}" />
        </WrapPanel>

        <Button Content="Try Again">
            <i:Interaction.Behaviors>
                <NavigateBehavior Controller="Home" Action="Index" />
            </i:Interaction.Behaviors>
        </Button>
    </StackPanel>
</Page>

The Magellan view engine will take care of setting the Page's DataContext to the Model from the controller.

Done

That's all there is to it - just hit F5 and admire the results of your handywork! At this point you should be able to enter the values, and they will appear on the next page. Wasn't that easy?

Index.xaml Add.xaml

Magellan took care of:

  • Locating the controller
  • Invoking the actions
  • Mapping the strings from the text boxes to integer parameters on the action (using Model Binders)
  • Locating the view
  • Connecting the model with the view

Tests

Of course, it wouldn't be complete without a test. Here's what the unit test for our Add action might look like:

[Test]
public void AddTest()
{
    var controller = new HomeController();
    controller.Add(1, 4);
    var model = (AddModel)controller.Model;

    Assert.AreEqual(1, model.A);
    Assert.AreEqual(4, model.B);
    Assert.AreEqual(5, model.Result);
}

What next?

Back to: Magellan Home

A picture of me

Welcome, my name is Paul Stovell. I live in Brisbane and work on Octopus Deploy, an automated deployment tool for .NET applications.

Prior to founding Octopus Deploy, I worked for an investment bank in London building WPF applications, and before that I worked for Readify, an Australian .NET consulting firm. I also worked on a number of open source projects and was an active user group presenter. I was a Microsoft MVP for WPF from 2006 to 2013.

Gerhard
Gerhard
08 Jan 2010

Hi Paul,

I try to make the first example and I get an error, which tells me, that the 'Behaviors' isn't part of the System.Windows.Interactivity???

<Button Content="Calculate">            
  ***<i:Interaction.Behaviors>***                
     <magellan:NavigateBehavior Controller="Home" Action="Add">
     <magellan:NavigateBehavior.Parameters>                        
     <magellan:Parameter ParameterName="a" Value="{Binding ElementName=parameterA,Path=Text}" />                           
     <magellan:Parameter ParameterName="b" Value="{Binding ElementName=parameterB, Path=Text}" />                    
     </magellan:NavigateBehavior.Parameters>                
     </magellan:NavigateBehavior>            
 </i:Interaction.Behaviors>        
</Button>

I think I didn't miss any reference. Is there some change since the last version or something else?

Thanks for helping

With best regards

Gerhard

Gerhard
Gerhard
08 Jan 2010

Hi Paul,

just browse the System.Windows.Interactivity assembly with the object viewer and no 'Behaviors' member there, only 'GetBehaviors', but this didn't work out, too.

PLEASE HELP

Thanks

Gerhard

08 Jan 2010

Hi Gerhard,

Did you reference the version of System.Windows.Interactivity from the ZIP file? If so it should work. It comes as part of Expression Blend 3 (do you have that installed?) - it's possible your project references an older version that doesn't have the necessary members.

Paul

Gerhard
Gerhard
09 Jan 2010

Hi Paul,

I didn't have installed Blend 3, but I take the System.Windows.Interactivity assembly from the zip-file. After that, I found some articel talking about some problems referencing an assembly only from xaml, which doesn't work and about a work around by including some useless line of code in the code behind file, which calls some part of this assembly. Another guy talk about installing the assembly in the gac. The assembly has a strong name and so I installed it in my gac, but this doesn't help. I aslo restart VS after that action, nothing helps. The code still compiles without error, but the page doesn't came up while still in error.

So I don't know whats wrong. I also start searching MSDN, but yesterday I fell sick, we have very strange weather conditions here in Austria this days....

I use VS2008 Professional edition on Win XP Pro. Should I look out to get Blend 3?? I still think, that I can do development without using this tool, and after that my daughter can do all the nice grafics whith Blend, which is clearly her thing, not mine.

Hope you can help me out

Thanks a lot

Gerhard

PS: Including an e-Mail notification system to this discussion board were a nice gift for your 'customers'

Gerhard
Gerhard
09 Jan 2010

![alt text][1]

[1]: C:\Dokumente und Einstellungen\Gerhard\Eigene Dateien\Eigene Bilder\Magellan Error 1.jpg

Gerhard
Gerhard
09 Jan 2010

Hi Paul,

just want to send an image, but I can't. This image is on my local computer and not somewhere on the net. I try out some syntactical variants file:///C:.... and so on, nothing helps, maybe you can give us some hints.

I just want to send a screen shot of my object browesers output.

With best regards

Gerhard

Gerhard
Gerhard
10 Jan 2010

Hi Paul,

today I copy the whole Magellan project I found in the source.zip onto my machine and try to compile it. First I has to repair the references but after that, I end up with the same problem.

Maybe Expression Blend do something else we miss here.

With best regards

Gerhard

11 Jan 2010

Hi Gerhard, I've sent you an email to follow up on this - it might make it easier to share information.

Eric
Eric
22 Jan 2010

Hi Paul,

I am also experiencing the issue with Behaviors not being a part of Interaction. Has anyone determine what might be causing this?

Thanks!

-- Eric

23 Jan 2010

Hi Eric,

Can you confirm that it's an issue when you use the designer, but the code still compiles and runs?

Also, I assume VS 2008 with Service Pack 1?

Paul

Gerhard
Gerhard
24 Jan 2010

Hi Paul,

I guess, that some part of the Expression Blend Package is needed, but I don't have installed this software. So I run into this problems. Maybe Eric can tell us something about his environment and specially, is Expression Blend installed or not. Maybe this can clearify something about this issue.

THANKS.

Another question. As VS2010 will be released in April and MRF is part of this release, did you plan some integration with this famous framework?

With best regards

Gerhard

Gerhard
Gerhard
24 Jan 2010

Hi Paul,

sorry about the typo, I ask you about MEF ....

Gerhard

27 Jan 2010

Hi Gerhard and Eric,

This StackOverflow question describes a similar issue. The accepted answer points to a hotfix for Visual Studio which you may like to try. From the hotfix:

WPF Designer cannot load read-only attached properties, such as the VisualStateManager.VisualStateGroups property.

This also applies to

You can download the hotfix here. Please let me know if you have any luck.

Paul

09 Apr 2010

Thanks Paul. The hotfix resolved the issue stated.