1

プロジェクトで使用Caliburn Microしていますが、多くのUserControlとそのビューモデルを継承しPropertyChangedBaseています。このUserControlをShellViewのCanvasに追加したいと思います。Windowsを表示することから使用したくないので、IWindowManager代わりにCanvasに追加してもらいたいです。

助けてください。どうやってやるの。

4

1 に答える 1

5

ContentControl内で使用する場合ShellViewは、Caliburn.MicroのView-ViewModelバインディングプロセスにフックできます。

ShellViewModelのタイプであるプロパティが公開されていると思いますViewModel。をに配置しContentControl(これは、シェルのレイアウトに使用するコンテナである場合ShellViewの子として存在する可能性があります)、バインドするプロパティの名前を使用してそのコントロールに名前を付けます。その後、Caliburn'sが残りの作業を行います。CanvasShellViewModelViewModelBinder

例として、と呼ばれるVMとFizzViewModelと呼ばれる一致するビューFizzView(これは単なる)があり、に表示しUserControlたい場合は、次のようなことを行うことができます...FizzViewShellView

剥ぎ取られた背中ShellViewModel

public class ShellViewModel : Screen, IShell
{
    public ShellViewModel(FizzViewModel theFizz)
    {
        TheFizz = theFizz;
    }

    public FizzViewModel TheFizz { get; set; }
}

そしてそのマッチングShellView

<UserControl x:Class="ANamespace.ShellView">
    <Canvas> 
        <ContentControl x:Name="TheFizz"></ContentControl>
    </Canvas> 
</UserControl>

ここで、ContentControlはTheFizzという名前であるため、Caliburnによって、VM上のその名前のプロパティ(タイプの1つFizzViewModel)にバインドされます。

これを行うとUserControl、実際の型を使用してをShellView配置する必要がなくなり、Caliburnに規則を介して作業を任せることができます(つまり、もう少し追加するだけで、TheFizz型を簡単に交換できます。インターフェイス間接参照)。

アップデート

コメントで提供した追加情報から、ItemsControlを必要とする問題を実際に確認していることがわかります。

Caliburnが使用するデフォルトDataTemplateは次のようになります

<DataTemplate xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
              xmlns:cal="clr-namespace:Caliburn.Micro;assembly=Caliburn.Micro">  
    <ContentControl cal:View.Model="{Binding}"   
                    VerticalContentAlignment="Stretch"  
                    HorizontalContentAlignment="Stretch" />  
</DataTemplate>

を使用していることに気付くでしょうContentControl。これには、上記で説明したようにいくつかの利点があります。基本的に、これにより、CaliburnがDataTemplateSelectorのアイテムに同様の動作を提供できるようになりますItemsControl。したがって、ItemsControlバインドされているコレクションにさまざまなタイプのVMを追加できます。このデフォルトDataTemplateでは、ビューの表示に使用するビューのタイプが解決されます。次のデモは、必要なことを実現する方法の非常に簡単な例です。

まず、ShellViewModelで、BindableCollection名前の付いたアイテムに注意してください

[Export(typeof(IShell))]
public class ShellViewModel : IShell 
{
    public ShellViewModel()
    {
        Items = new BindableCollection<Screen>();
        _rand = new Random();
    }

    public BindableCollection<Screen> Items { get; set; }

    private Random _rand;

    public void AddItem()
    {
        var next = _rand.Next(3);
        var mPosition = System.Windows.Input.Mouse.GetPosition(App.Current.MainWindow);
        switch (next)
        {
            case 0:
                {
                    Items.Add(new BlueViewModel
                        {
                            X = mPosition.X,
                            Y = mPosition.Y,
                        });
                    break;
                }

            case 1:
                {
                    Items.Add(new RedViewModel
                    {
                        X = mPosition.X,
                        Y = mPosition.Y,
                    });
                    break;
                }
            case 2:
                {
                    Items.Add(new GreenViewModel
                    {
                        X = mPosition.X,
                        Y = mPosition.Y,
                    });
                    break;
                }
            default:
                break;
        }
    }
}

次に、シェルに表示するいくつかのダミーVMタイプ。これらはあなたが好きなことをする/することができます:

public abstract class SquareViewModel : Screen
{
    public double X { get; set; }
    public double Y { get; set; }
}

public class BlueViewModel : SquareViewModel
{

}

public class RedViewModel : SquareViewModel
{

}

public class GreenViewModel : SquareViewModel
{

}

ここでShellViewです。ShellViewModelのItemsプロパティにバインドするItemsControlに注意してください。

<Window x:Class="WpfApplication2.ShellView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:cal="clr-namespace:Caliburn.Micro;assembly=Caliburn.Micro">

<Grid >
        <Grid.RowDefinitions>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>

        <ItemsControl x:Name="Items"
                      HorizontalAlignment="Stretch"
                      VerticalAlignment="Stretch">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Canvas cal:Message.Attach="[Event MouseLeftButtonUp] = [Action AddItem()]"
                            Background="Transparent"></Canvas>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemContainerStyle>
                <Style TargetType="ContentPresenter">
                    <Setter Property="Canvas.Left" Value="{Binding Path=X}" />
                    <Setter Property="Canvas.Top" Value="{Binding Path=Y}" />
                </Style>
            </ItemsControl.ItemContainerStyle>
        </ItemsControl>
</Grid>
</Window>

そして、UserControlを表示するために使用される例GreenViewModel、これらをさらに2つ作成し、名前をRedViewとに変更しBlueView、背景を適切に設定してデモを機能させます。

<UserControl x:Class="WpfApplication2.GreenView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             Width="30"
             Height="30">
    <Grid Background="Green"></Grid>
</UserControl>

Canvasこの例を組み合わせると、マウスクリックの位置に基づいてシェルの色付きの正方形が作成されます。私はあなたがこれを取り、あなたのニーズにそれを拡張することができるべきだと思います。

于 2012-05-09T03:03:00.327 に答える