請 - 我不想在此時使用/ MVVMlite(etc)之類的外部框架。我需要手動執行此操作,以便我可以看到完整的過程。如何使用ICommand Mvvm模式在MainWindow.xaml中切換Usercontrol(s)?
我已經看到了我所問的問題的各種表達,但我沒有看到任何版本的問題,它將一個命令綁定到一個用戶控件以更改MainWindow.xaml中的一個用戶控件。在下面的代碼中,我演示了我試圖製作一個Wpf/Mvvm應用程序來切換MainWindow.xaml中的用戶控件的努力/嘗試。問題/要求是我需要採取哪些步驟來跟進此項目?在我的項目中,我有標準Models/ViewModels/Views文件夾,我想在MainWindow.xaml中切換的3個用戶控件視圖(MainWindow.xaml駐留在項目的根文件夾中) - BlueView,OrangeView, RedView。這些views/usercontrols的唯一內容是Blueview有一個藍色背景網格,OrangeView有一個橙色背景網格,RedView有一個紅色背景網格。我在MainWindow.xaml左邊的一個堆棧面板中有3個按鈕,還有一個內容控件,我想在MainWindow.xaml右邊加載/切換usercontrols。我有3個相應的ViewModel,BlueViewModel,OrangeViewModel,RedViewModel。我還有一個MainViewModel用於在Models文件夾中綁定這3個viewModels和RelayCommand.cs。但我不知道該從哪裏出發。
這是我的代碼 - 注意:我只打算添加MainWindow.xaml,RelayCommand.cs,MainViewModel和BlueViewModle/BlueView,因爲除了背景網格顏色外其他視圖/ ViewModel是相同的。我需要做些什麼/添加,以便我可以在MainWindow.xaml的內容控件中加載/切換usercontrols?我無法顯示一個usercontrol - 所以我沒有在MainViewModel.cs中顯示/顯示方法如何加載usercontrols?我需要ViewModels中的方法嗎?
--MainWindow.xaml - 駐留在項目的根文件夾
<Window x:Class="ViewChangerFromICommand.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:ViewChangerFromICommand"
xmlns:viewmodels="clr-namespace:ViewChangerFromICommand.ViewModels"
xmlns:views="clr-namespace:ViewChangerFromICommand.Views"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<DataTemplate x:Name="redViewTemplate" DataType="{x:Type viewmodels:RedViewModel}">
<views:RedView DataContext="{Binding}"/>
</DataTemplate>
<DataTemplate x:Name="BlueViewTemplate" DataType="{x:Type viewmodels:BlueViewModel}">
<views:BlueView DataContext="{Binding}"/>
</DataTemplate>
<DataTemplate x:Name="OrangeViewTemplate" DataType="{x:Type viewmodels:OrangeViewModel}">
<views:OrangeView DataContext="{Binding}"/>
</DataTemplate>
</Window.Resources>
<Window.DataContext>
<viewmodels:MainViewModel />
</Window.DataContext>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<DockPanel Background="Gray" Grid.Row="0" Grid.Column="0" Grid.RowSpan="5">
<StackPanel>
<Button Content="Red View"/>
<Button Content="Blue View"/>
<Button Content="Orange View"/>
</StackPanel>
</DockPanel>
<ContentControl Grid.Row="0" Grid.Column="1" Grid.ColumnSpan="4" Grid.RowSpan="5" Content="{Binding}"/>
</Grid>
</Window>
--RelayCommand.cs - 駐留在Models文件夾
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Input;
namespace ViewChangerFromICommand.Models
{
public class RelayCommand : ICommand
{
readonly Action _execute;
readonly Func<bool> _canExecute;
public RelayCommand(Action execute, Func<bool> canExecute)
{
if (execute == null)
throw new NullReferenceException("execute");
_execute = execute;
_canExecute = canExecute;
}
public RelayCommand(Action execute) : this(execute, null)
{
}
public event EventHandler CanExecuteChanged
{
add { CommandManager.RequerySuggested += value; }
remove { CommandManager.RequerySuggested -= value; }
}
public bool CanExecute(object parameter)
{
return _canExecute == null ? true : _canExecute();
}
public void Execute(object parameter)
{
_execute.Invoke();
}
}
}
--MainViewModel.cs - 駐留在文件夾中的ViewModels
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using ViewChangerFromICommand.Models;
using ViewChangerFromICommand.Views;
namespace ViewChangerFromICommand.ViewModels
{
public class MainViewModel
{
public BlueViewModel blueVM { get; set; }
public OrangeViewModel orangeVM { get; set; }
public RedViewModel redVM { get; set; }
public MainViewModel()
{
blueVM = new BlueViewModel();
orangeVM = new OrangeViewModel();
redVM = new RedViewModel();
}
}
}
--BlueViewModel.cs - 駐留在的ViewModels文件夾
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Input;
using ViewChangerFromICommand.Models;
using ViewChangerFromICommand.Views;
namespace ViewChangerFromICommand.ViewModels
{
public class BlueViewModel
{
public BlueViewModel()
{
}
}
}
--BlueView.xaml - 駐留在瀏覽文件夾
<UserControlx:Class="ViewChangerFromICommand.Views.BlueView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:ViewChangerFromICommand.Views"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<Grid Background="Blue">
</Grid>
</UserControl>
我只是想澄清我回答之前 - 在您的最終設計(假設這是簡化的)會有任何RedViewModel,BlueViewModel和OrangeViewModel類之間的區別?或者他們都擁有相同的屬性,命令等? –
所有viewmodesl(MainViewModel除外)都是相同的(除了一個是藍色背景,一個是紅色背景,一個是橙色背景)。這個練習只是使用Mvvm模式(如果這是前進的道路)用於在MainWindow.xaml中加載/切換這些用戶控件。 –