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

1yjd4xko  于 2022-12-07  发布在  其他
关注(0)|答案(1)|浏览(130)

I am completely new to MVVM and I am creating an UWP app for keeping track of my software development, I am still learning.
So what I want to make is:
An app that contains single page ->
In MainPage.xaml I have something like this:

<!--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>

In Model I have something like this:

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
}

In ViewModel, something like :

public class ViewModel
{
    // For ItemSource of ListView
    public ObservableCollection<DevApp> DevApps = new ObservableCollection<DevApp>();

    // For Add AppBarButton
    public ICommand AddCommand;
}

Now this is me first time trying to create a neat and clean Mvvm app. Now I have this question:

  1. I know how to bind command to button or AppBarButton but how am I supposed to bind a Methods of a Xaml Control such as Listview's SelectionChanged() or AutoSuggestBox's TextChanged() Methods to ViewModel ?
  2. How can I Load Data from save file ? As there is no InitializeComponent() in ViewModel like in CodeBehind to start from, where shall I pull LoadData() method which loads data to ListView ? ( my viewmodel is bind to view using <MainPage.DataContext> and I wanna keep code behind completely empty. )
  3. Where shall I put Data class that can manage load save and edit data to savefile.
  4. How shall I distribute responsibilities among classes ?
    I have seen people using mvvm and they create files like:
    services, helpers, contracts, behaviours, etc.
    and I have seen same thing in Windows Community Toolkit Sample App Is it required for Mvvm. And what are services and helpers.
  5. Shall I really use Mvvm for this ?
    I tried using Mvvm in this just for curiosity but like
    ITS BEEN 1 MONTH I AM MAKKING THIS APP! but it gets messed up again and again,
    If I used Code Behind it would have been done in few days. BY time now I realize that Mvvm is good at data bind in complex apps but
    When it comes to simple things like a simple app with listview, I think code-behind
    is better and it keeps things simple.
    Please answer these questions I am really struggling in making this app.
qmb5sa22

qmb5sa221#

我知道如何将command绑定到button或AppBarButton,但我应该如何将Xaml控件的方法(如Listview的SelectionChanged()或AutoSuggestBox的TextChanged()方法)绑定到ViewModel
您可以使用Xaml Behavior InvokeCommandAction将SelectionChanged与命令绑定,或者使用x:bind标记扩展绑定方法,有关更多信息,请参阅此link
如何从保存文件中加载数据?由于ViewModel中没有像CodeBehind中那样的InitializeComponent()可供启动,我应该从哪里提取LoadData()方法来将数据加载到ListView?(我的视图模型是使用绑定到视图的<MainPage.DataContext>,我希望保持代码完全为空。
根据第一个问题,你可以检测页面加载事件和Invoke CommandAction在视图模型中的位置,然后在视图模型LoadedCommand中加载文件。

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

我应该把可以管理加载保存和编辑数据Data类放在哪里以保存文件
保存文件的最佳位置是当前应用程序的本地文件夹,并且它具有完全访问权限,请参阅Work with files文档。
我应该如何在类之间分配责任呢?我见过一些人使用mvvm,他们创建了如下文件:服务,助手,合同,行为等,我在Windows社区工具包示例应用程序中也看到了同样的东西。Mvvm需要它吗?什么是服务和助手。
对于mvvm设计,model view viewmodel是必要的。并且不需要制作服务、助手、合约、行为,它应该基于您的设计。例如,如果您想要制作NavigateService,您需要制作静态服务类来管理当前应用的导航。我们建议您使用TempleStudio制作包含一些基本服务和行为的示例项目。
我真的应该使用Mvvm吗?我试着使用Mvvm只是出于好奇,但就像它已经1个月了,我正在制作这个应用程序!但它一次又一次地搞砸了,如果我使用代码背后,它会在几天内完成。现在我意识到,Mvvm擅长于复杂应用程序中的数据绑定,但当涉及到简单的事情,如一个简单的应用程序与listview,我认为代码隐藏更好,它使事情变得简单。
您的理解是正确的,但是Decoupling(mvvm)您的代码有很多好处,包括:

  • 支持迭代的、探索性的编码风格。独立的更改风险更小,更易于试验。简化单元测试。彼此独立的代码单元可以在生产环境之外单独测试。支持团队协作。遵循良好设计的接口的分离代码可以由单独的个人或团队开发。与MVVM相比,具有更传统的“代码隐藏”结构的应用程序通常对只显示数据使用数据绑定,并通过直接处理控件公开的事件来响应用户输入。事件处理程序在代码隐藏文件中实现(如MainPage.xaml.cs),并且通常与控件紧密耦合,通常包含直接操作UI的代码。这使得在不更新事件处理代码的情况下替换控件变得困难或不可能。使用这种体系结构,代码隐藏文件通常会积累与UI不直接相关的代码(如数据库访问代码),这些代码最终会被复制和修改以用于其他页面。*

相关问题