wpf - 如何重用 wpf 视图？

Question

有没有办法通过 Caliburn.Micro 重用 WPF 视图？

在示例中，我有一个带有 SaveAndClose 和 Cancel 按钮的 DetailViewBase.xaml。现在我想在 PersonView(Model) 中使用 DetailViewModelBase 和 XAML。

我希望这个问题很清楚。

Answer 1

如果我的假设是正确的，我认为您的意思是您想从几个更简单的视图模型中“组合”一个更复杂的视图。您可以从视图模型继承，但显然视图模型一次只能有一个活动视图。

但是，使用绑定，您可以组合多个视图模型，并让它们一起呈现各自的视图，以制作更复杂的 UI

例如

带有保存/取消按钮的虚拟机

public class ActionsViewModel
{
    public void Save()
    {
    }

    public void Cancel()
    {
    }
}

对应视图：

<UserControl>
   <StackPanel Orientation="Horizontal">
       <Button x:Name="Save">Save</Button>
       <Button x:Name="Cancel">Cancel</Button>
   </StackPanel>
</UserControl>

组成自己的另一种观点和ActionsViewModel

public class ComposedViewModel
{
    public ActionsViewModel ActionsView
    {
        get; set;
    }

    public ComposedViewModel()
    {
        ActionsView = new ActionsViewModel();
    }      

    public void DoSomething()
    {
    }
}

风景：

<UserControl>
   <StackPanel Orientation="Horizontal">
       <TextBlock>Hello World</TextBlock>
       <Button x:Name="DoSomething">Do Something</Button>
       <ContentControl x:Name="ActionsView" />
   </StackPanel>
</UserControl>

当您使用约定绑定（或使用附加属性）来绑定ContentControlCM 时，会自动将 VM 绑定到DataContext并连接视图。通过这种方式，您可以将多个 VM 组合成一个更复杂的功能。

此外，由于动作消息冒泡 - 如果您要删除 'Ok' 和 'Cancel' 实现ActionsViewModel并将它们放入ComposedViewModel实现中，则动作消息将冒泡到ComposedViewModel实例并在那里触发方法

例如

public class ActionsViewModel
{
    // Remove the command handlers
}


public class ComposedViewModel
{
    public ActionsViewModel ActionsView
    {
        get; set;
    }

    public ComposedViewModel()
    {
        ActionsView = new ActionsViewModel();
    }      

    public void DoSomething()
    {
    }

    // CM will bubble the messages up so that these methods handle them when the user clicks on the buttons in the ActionsView
    public void Save()
    {
    }

    public void Cancel()
    {
    }
}

编辑：

抱歉，我忘记了这一点 - 基于约定的绑定不允许消息冒泡，但您可以使用Message.Attach附加的属性使其工作：

// Make sure you include the caliburn namespace:
<UserControl xmlns:cal="http://www.caliburnproject.org">
   <StackPanel Orientation="Horizontal">
       <Button x:Name="Save" cal:Message.Attach="Save">Save</Button>
       <Button x:Name="Cancel" cal:Message.Attach="Cancel">Cancel</Button>
   </StackPanel>
</UserControl>

Answer 2

您可以使用如下代码将 ViewModel 显式绑定到 View：

cal:Bind.Model={Binding DetailViewModelBase}