如何将 UWP 控件的方法绑定到 MVVM 中的方法或命令



我对MVVM完全陌生,我正在创建一个UWP应用程序来跟踪我的软件开发,我仍在学习。

所以我想做的是:

包含单个页面的应用程序->

在MainPage.xaml中,我有这样的东西:

<!--MainPage Content-->
<Grid>
<!--For SearchBox-->
<AutoSuggestBox x:Name="SearchBox"/>
<!--For Adding Item-->
<AppBarButton x:Name="AddAppButton"/>
<!--Listview that contains main data-->
<ListView x:Name="AppsListView"/>
<!--This is DataTemplate of listview-->
<DataTemplate>
<Grid>
<!--Icon of App-->
<Image/>
<!--Name of App-->
<TextBlock/>
<!--For Editing Item-->
<AppBarButton/>
<!--For Deleting Item-->
<AppBarButton/>
</Grid>
</DataTemplate>
</Grid>

在模型中,我有这样的东西:

public class DevApp
{
public string name { get; set; } // For App Name
public string Iconsource { get; set; } // For App Icon
public ICommand EditCommand; // For Edit AppBarButton
public ICommand DeleteCommand; // For Delete AppBarButton
}

在ViewModel中,类似于:

public class ViewModel
{
// For ItemSource of ListView
public ObservableCollection<DevApp> DevApps = new ObservableCollection<DevApp>();
// For Add AppBarButton
public ICommand AddCommand;
}

现在这是我第一次尝试创建一个整洁的Mvvm应用程序。现在我有一个问题:

  1. 我知道如何将命令绑定到按钮或AppBarButton,但我应该如何将Xaml控件的方法(如Listview的SelectionChanged()或AutoSuggestBox的TextChanged(()方法)绑定到ViewModel
  2. 如何从保存文件加载数据?由于ViewModel中没有像CodeBehind中那样的InitializeComponent()可以从哪里开始,我应该从哪里提取将数据加载到ListView的LoadData()方法?(我的视图模型使用<MainPage.DataContext>绑定到视图,我想让后面的代码完全为空。)
  3. 我应该把可以管理加载保存和编辑数据到保存文件的Data类放在哪里
  4. 我应该如何在班级之间分配责任
    我见过有人使用mvvm,他们创建的文件包括:
    服务、助手、合同、行为等。
    我在Windows社区工具包示例应用程序中也看到过同样的情况Mvvm需要它吗。什么是服务和帮助者
  5. 我真的要用Mvvm吗
    我试着在这里使用Mvvm只是为了好奇,但就像
    我制作这个应用程序已经一个月了!但它一次又一次地被搞砸了,
    如果我使用"背后的代码",几天内就会完成。现在我意识到Mvvm擅长复杂应用程序中的数据绑定,但
    当涉及到简单的事情时,比如带有listview的简单应用程序,我认为
    背后的代码更好,它使事情变得简单

请回答这些问题,我真的很难制作这个应用程序。

我知道如何将命令绑定到按钮或AppBarButton,但我应该如何将Xaml控件的方法(如Listview的SelectionChanged()或AutoSuggestBox的TextChanged(()方法)绑定到ViewModel

您可以使用Xaml Behavior InvokeCommandAction将SelectionChanged与命令绑定,或者使用x:bind标记扩展绑定方法,有关详细信息,请参阅此链接。

如何从保存文件加载数据?由于ViewModel中没有像CodeBehind中那样的InitializeComponent()可以从哪里开始,我应该从哪里提取将数据加载到ListView的LoadData()方法?(我的视图模型使用<MainPage.DataContext>绑定到视图,我想让后面的代码完全为空。)

基于第一个问题,您可以在ViewModel中检测到Page Loaded事件和Invoke CommandAction。然后在视图模型LoadedCommand中加载该文件。

<i:Interaction.Behaviors>
<ic:EventTriggerBehavior EventName="Loaded">
<ic:InvokeCommandAction Command="{x:Bind ViewModel.LoadedCommand}" />
</ic:EventTriggerBehavior>
</i:Interaction.Behaviors>

我应该把可以管理加载保存和编辑数据到保存文件的Data类放在哪里

保存文件的最佳位置是当前应用程序的本地文件夹,并且它具有完全访问权限,请参阅使用文件文档。

我应该如何在类之间分配责任?我见过一些人使用mvvm,他们创建的文件如下:服务、助手、合同、行为等。我在Windows社区工具包示例应用程序中看到了同样的东西,Mvvm需要它吗。什么是服务和帮助者。

对于mvvm设计,model view viewmodel是必要的。没有必要制定服务、助手、合同、行为,它应该以您的设计为基础。例如,如果您想创建NavigateService,您需要创建静态服务类来管理当前应用程序的导航。我们建议您使用TempleStudio制作包含一些基本服务和行为的示例项目。

我真的要用Mvvm吗?我试着在这里使用Mvvm只是为了好奇,但喜欢我制作这个应用程序已经一个月了!但它一次又一次地变得一团糟,如果我使用"背后的代码",它会在几天内完成。现在我意识到Mvvm擅长复杂应用程序中的数据绑定,但当涉及到简单的事情时,比如一个带有listview的简单应用程序,我认为背后的代码更好,它让事情变得简单。

您的理解是正确的,但是解耦(mvvm)您的代码有很多好处,包括:

实现迭代的、探索性的编码风格。孤立的变革风险较小,也更容易尝试。简化单元测试。相互隔离的代码单元可以单独测试,也可以在生产环境之外测试。支持团队协作。遵循精心设计的接口的解耦代码可以由单独的个人或团队开发,稍后进行集成。提高可维护性。修复解耦代码中的错误不太可能导致其他代码出现倒退。与MVVM相比;代码隐藏";结构通常对仅显示的数据使用数据绑定,并通过直接处理控件公开的事件来响应用户输入。事件处理程序在代码隐藏文件(如MainPage.xaml.cs)中实现,并且通常与控件紧密耦合,通常包含直接操纵UI的代码。这使得在不更新事件处理代码的情况下替换控件变得困难或不可能。使用这种体系结构,代码隐藏文件通常会积累与UI没有直接关系的代码,例如数据库访问代码,这些代码最终会被复制和修改,以便与其他页面一起使用

相关内容

最新更新