プロジェクトで使用Caliburn Micro
していますが、多くのUserControlとそのビューモデルを継承しPropertyChangedBase
ています。このUserControlをShellViewのCanvasに追加したいと思います。Windowsを表示することから使用したくないので、IWindowManager
代わりにCanvasに追加してもらいたいです。
助けてください。どうやってやるの。
プロジェクトで使用Caliburn Micro
していますが、多くのUserControlとそのビューモデルを継承しPropertyChangedBase
ています。このUserControlをShellViewのCanvasに追加したいと思います。Windowsを表示することから使用したくないので、IWindowManager
代わりにCanvasに追加してもらいたいです。
助けてください。どうやってやるの。
ContentControl
内で使用する場合ShellView
は、Caliburn.MicroのView-ViewModelバインディングプロセスにフックできます。
ShellViewModel
のタイプであるプロパティが公開されていると思いますViewModel
。をに配置しContentControl
(これは、シェルのレイアウトに使用するコンテナである場合ShellView
の子として存在する可能性があります)、バインドするプロパティの名前を使用してそのコントロールに名前を付けます。その後、Caliburn'sが残りの作業を行います。Canvas
ShellViewModel
ViewModelBinder
例として、と呼ばれるVMとFizzViewModel
と呼ばれる一致するビューFizzView
(これは単なる)があり、に表示しUserControl
たい場合は、次のようなことを行うことができます...FizzView
ShellView
剥ぎ取られた背中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
この例を組み合わせると、マウスクリックの位置に基づいてシェルの色付きの正方形が作成されます。私はあなたがこれを取り、あなたのニーズにそれを拡張することができるべきだと思います。