Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
225 views
in Technique[技术] by (71.8m points)

c# - Caliburn Micro and ModernUI Examples/Tutorials

does anyone have an example or tutorial on how to use Caliburn Micro together with ModernUi (https://mui.codeplex.com)?

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Ok so I had a quick mess about with it and a look on the Mui forums and this seems to be the best approach:

Since the window loads content from URLs you need to take a view-first approach, and then locate the appropriate VM and bind the two.

The best way to do this appears to be via the ContentLoader class which is used to load the content into the ModernWindow when it is requested. You can just subclass DefaultContentLoader and provide the necessary CM magic to bind up loaded items:

public class ModernContentLoader : DefaultContentLoader
{
    protected override object LoadContent(Uri uri)
    {
        var content = base.LoadContent(uri);

        if (content == null)
            return null;

        // Locate the right viewmodel for this view
        var vm = Caliburn.Micro.ViewModelLocator.LocateForView(content);

        if (vm == null)
            return content;

        // Bind it up with CM magic
        if (content is DependencyObject)
        {
            Caliburn.Micro.ViewModelBinder.Bind(vm, content as DependencyObject, null);
        }

        return content;
    }
}

Your CM bootstrapper should just bootstrap a ModernWindow viewmodel which is backed by a ModernWindow based view (CM tries to use EnsureWindow which creates a new basic WPF Window class, unless of course your control already inherits from Window which ModernWindow does. If you need all dialogs and popups to be MUI you might need to reimplement WindowManager):

public class Bootstrapper : Bootstrapper<ModernWindowViewModel>
{
}

Which can be a conductor (OneActive) and looks like this:

public class ModernWindowViewModel : Conductor<IScreen>.Collection.OneActive
{
}

And XAML for the view is

ModernWindowView.xaml

<mui:ModernWindow x:Class="WpfApplication4.ViewModels.ModernWindowView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mui="http://firstfloorsoftware.com/ModernUI"
                                     Title="ModernWindowView" Height="300" Width="300" ContentLoader="{StaticResource ModernContentLoader}">   
    <mui:ModernWindow.MenuLinkGroups>
        <mui:LinkGroupCollection>
            <mui:LinkGroup GroupName="Hello" DisplayName="Hello">
                <mui:LinkGroup.Links>
                    <mui:Link Source="/ViewModels/ChildView.xaml" DisplayName="Click me"></mui:Link>
                </mui:LinkGroup.Links>
            </mui:LinkGroup>
        </mui:LinkGroupCollection>
    </mui:ModernWindow.MenuLinkGroups>
</mui:ModernWindow>

Obviously you need to make the loader a resource too:

<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="/FirstFloor.ModernUI;component/Assets/ModernUI.xaml" />
            <ResourceDictionary Source="/FirstFloor.ModernUI;component/Assets/ModernUI.Dark.xaml"/>
            <ResourceDictionary>
                <framework:ModernContentLoader x:Key="ModernContentLoader"></framework:ModernContentLoader>
                <wpfApplication4:Bootstrapper x:Key="Bootstrapper"></wpfApplication4:Bootstrapper>
            </ResourceDictionary>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>

Here's the ChildViewModel I'm using as a test:

public class ChildViewModel : Conductor<IScreen>
{
    public void ClickMe()
    {
        MessageBox.Show("Hello");
    }
}

And the XAML for that (just a button)

<UserControl x:Class="WpfApplication4.ViewModels.ChildView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                                     Height="350" Width="525">
    <Grid>
        <StackPanel>
        <TextBlock >Hello World</TextBlock>
        <Button x:Name="ClickMe" Width="140" Height="50">Hello World</Button>
        </StackPanel>
    </Grid>
</UserControl>

And the proof of concept:

MUI Example


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...