IN.NET MAUI带有MVVM,您如何在Collection View

问题描述 投票:0回答:2
我已经呆了几天了。请告诉我我的愚蠢错误。 我什至将代码愚蠢到与本文中的示例相匹配,没有运气。 (

https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/collectionview/populate-data?view = net-maui-9.0) 文章的示例;

<CollectionView x:Name="collectionView" ItemsSource="{Binding Monkeys}"> <CollectionView.ItemTemplate> <DataTemplate> <SwipeView> <SwipeView.LeftItems> <SwipeItems> <SwipeItem Text="Favorite" IconImageSource="favorite.png" BackgroundColor="LightGreen" Command="{Binding Source={x:Reference collectionView}, Path=BindingContext.FavoriteCommand}" CommandParameter="{Binding}" /> <SwipeItem Text="Delete" IconImageSource="delete.png" BackgroundColor="LightPink" Command="{Binding Source={x:Reference collectionView}, Path=BindingContext.DeleteCommand}" CommandParameter="{Binding}" /> </SwipeItems> </SwipeView.LeftItems> <Grid BackgroundColor="White" Padding="10"> <!-- Define item appearance --> </Grid> </SwipeView> </DataTemplate> </CollectionView.ItemTemplate>
我是根据解决我尝试的问题的不同方法的多个问题。但是最终我的问题是,我无法正确实现其命令与我的ViewModel中的继电器命令,并且命令参数键结合到该类型模型。无论我尝试过什么,SwipeViews BindingContext始终是类型模型。.我将尝试提供尽可能多的相关信息。
Below是我的XAML页面,不确定所有内容是否有帮助,但我不想阻碍您的帮助。

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:vm="clr-namespace:LoanShark.ViewModels" xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit" xmlns:custom="clr-namespace:LoanShark.Behaviors" xmlns:model="clr-namespace:LoanShark.Models" xmlns:repo="clr-namespace:LoanShark.Data.Repositories" xmlns:local="clr-namespace:LoanShark.Views" x:Class="LoanShark.Views.LoanPage" x:Name="Loan_Page" x:DataType="vm:LoanViewModel" Title="Loans"> <Grid> <!-- Main Content --> <!-- Show message when Loans is empty --> <Label Text="No loans found." IsVisible="{Binding Loans.Count, Converter={StaticResource IsZeroConverter}}" HorizontalOptions="Center" VerticalOptions="Center" /> <!--Loan List--> <CollectionView x:Name="loansCollectionView" ItemsSource="{Binding Loans}" VerticalOptions="FillAndExpand"> <CollectionView.ItemTemplate> <DataTemplate x:DataType="model:Loan"> <SwipeView BindingContext="{Binding .}"> <SwipeView.LeftItems> <SwipeItems> <SwipeItem Text="Edit" BackgroundColor="LightGray"/> <SwipeItem Text="Delete" BackgroundColor="LightPink" Command="{Binding Source={x:Reference loansCollectionView}, Path=BindingContext.DeleteLoanCommand}" CommandParameter="{Binding .}" > <SwipeItem.BindingContext> <model:Loan/> </SwipeItem.BindingContext> </SwipeItem> </SwipeItems> </SwipeView.LeftItems> <Border x:Name="LoanBorder"> <Border.GestureRecognizers> <TapGestureRecognizer Tapped="OnExpandButtonClicked" NumberOfTapsRequired="1"/> </Border.GestureRecognizers> <Border.Behaviors> <toolkit:TouchBehavior BindingContext="{Binding Path=BindingContext, Source={x:Reference LoanBorder}, x:DataType=Border}" LongPressCommand="{Binding Source={x:Reference Loans}, Path=BindingContext.ShowContextMenuCommand, x:DataType=ContentPage}" LongPressCommandParameter="{Binding .}" LongPressDuration="1500"/> </Border.Behaviors> <VerticalStackLayout x:Name="LoansStackLayout" x:DataType="model:Loan"> <!--Default View--> <Label Text="{Binding Borrower.FullName}" Style="{DynamicResource SubHeaderLabelStyle}" FontSize="16" /> <!--Collapsible Details--> <toolkit:Expander x:Name="LoanExpander" IsExpanded="{Binding IsExpanded, Mode=TwoWay}" ExpandedChanged="OnExpanderToggled" > <toolkit:Expander.Header> <Grid ColumnDefinitions="*, Auto" VerticalOptions="CenterAndExpand"> <Label Text="{Binding Name}" Style="{DynamicResource RegularLabelStyle}" FontSize="14" Grid.Column="0" /> <!--Chevron Icon--> <Image x:Name="ChevronIcon" Source="up_chevron.svg" WidthRequest="24" HeightRequest="24" Grid.Column="1" RotationX="180" VerticalOptions="Center"> </Image> </Grid> </toolkit:Expander.Header> <toolkit:Expander.Content> <Grid RowDefinitions="Auto, Auto, Auto, Auto" ColumnDefinitions="*, Auto"> <!--Original Loan Amount--> <Label Text="Original:" Style="{DynamicResource SubHeaderLabelStyle}" Grid.Row="0" Grid.Column="0" /> <Label Text="{Binding OriginalLoanAmount, StringFormat='{0:C}'}" Style="{DynamicResource RegularLabelStyle}" Grid.Row="0" Grid.Column="1" HorizontalOptions="End" /> <!--Remaining Loan Amount--> <Label Text="Remaining:" Style="{DynamicResource SubHeaderLabelStyle}" Grid.Row="1" Grid.Column="0" /> <Label Text="{Binding RemainingLoanAmount, StringFormat='{0:C}'}" Style="{DynamicResource RegularLabelStyle}" Grid.Row="1" Grid.Column="1" HorizontalOptions="End" /> <!--Interest Rate--> <Label Text="Interest Rate:" Style="{DynamicResource SubHeaderLabelStyle}" Grid.Row="2" Grid.Column="0" /> <Label Text="{Binding Interest, StringFormat='{0:P}'}" Style="{DynamicResource RegularLabelStyle}" Grid.Row="2" Grid.Column="1" HorizontalOptions="End" /> <!--Loan End Date--> <Label Text="End Date:" Style="{DynamicResource SubHeaderLabelStyle}" Grid.Row="3" Grid.Column="0" /> <Label Text="{Binding LoanEndDate, StringFormat='{0:MM/dd/yyyy}'}" Style="{DynamicResource RegularLabelStyle}" Grid.Row="3" Grid.Column="1" HorizontalOptions="End" /> </Grid> </toolkit:Expander.Content> </toolkit:Expander> </VerticalStackLayout> </Border> </SwipeView> </DataTemplate> </CollectionView.ItemTemplate> </CollectionView> <!-- Floating Add Button --> <Button Text="+" Command="{Binding NavigateToNewLoanCommand}" HorizontalOptions="End" VerticalOptions="End" Style="{DynamicResource FloatingActionButtonStyle}" /> </Grid>

我已经用尽了我可能想出的所有选择。 我尝试删除x:datatype模型:从数据定位板上借入并将其放入嵌套的垂直刺激之中,这有助于命令绑定,但我永远无法获得的命令参数。使用此选项的事件,我不能简单地制作命令“ {binting deleteloancommand}”我仍然必须提供一个有点复杂的绑定 command =“ {binding source = {versiantionource ancestortype = {x:type vm:loanviewModel}},path = deleteloancommand}”

在DatateMplate上将X:Datatype返回使命令永远不会发射,无论我如何构建绑定。
the ViewModel具有一个称为DeleteloanaSync的RelayCommand,CommunityToolKit.mvvm将其转换为引擎盖下的命令,并将其重命名为DeleteloAncommand

最后一件事... 我将非常感谢您对此的任何帮助,但是所有资源或技巧n的技巧也可以更好地理解您认为会有所帮助的绑定,我会很乐意阅读,我认为我知道并理解了绑定,但是这让我第二次猜测自己。

<SwipeItem.BindingContext> <model:Loan/> </SwipeItem.BindingContext>

这意味着您将滑动视图的bindingContext设置为

Loan

模型的新实例(
c# .net mvvm data-binding maui
2个回答
0
投票
)。由于您定义了
CommandParameter="{Binding .}"

Loan

DeleteLoan
模型的新创建的实例将作为参数传递。
删除SwipeView的BindingContext,然后您收集的当前贷款项表单将以您的意图作为参数传递。

thanks显示出足够的代码来重现您的问题。您是说:

我的问题是,我无法正确实现其命令与我的ViewModel中的继电器命令,而命令参数绑定到模型类型的情况下。无论我尝试过什么,SwipeViews BindingContext始终是类型模型。

从此,我的理解是,目标是在视图模型中调用

0
投票
命令,该命令“可以”与此相似的“可能”表示:

x:Name

对我有用的东西是为XAML中的视图模型提供一个,然后使用
x:Reference
访问它。

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:LoanShark" xmlns:model="clr-namespace:LoanShark.Models" xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit" x:Class="LoanShark.MainPage"> <ContentPage.BindingContext> <local:MainPageViewModel x:Name="MainPageViewModel"/> </ContentPage.BindingContext> <ContentPage.Resources> <ResourceDictionary> <local:IsZeroConverter x:Key="IsZeroConverter"/> <DataTemplate x:Key="LoanItemTemplate"> <SwipeView> <SwipeView.LeftItems> <SwipeItems> <SwipeItem Text="Edit" BackgroundColor="LightGray"/> <SwipeItem Text="Delete" BackgroundColor="LightPink" Command="{Binding DeleteLoanCommand, Source={x:Reference MainPageViewModel}}" CommandParameter="{Binding .}" /> </SwipeItems> </SwipeView.LeftItems> . . . </SwipeView> </DataTemplate> </ResourceDictionary> </ContentPage.Resources> <Grid> <!-- Show message when Loans is empty --> <Label Text="No loans found." IsVisible="{Binding Loans.Count, Converter={StaticResource IsZeroConverter}}" HorizontalOptions="Center" VerticalOptions="Center" /> <CollectionView x:Name="loansCollectionView" ItemsSource="{Binding Loans}" ItemTemplate="{StaticResource LoanItemTemplate}" Margin="20"> </CollectionView> <!-- Floating Add Button --> <Button Text="+" Command="{Binding NavigateToNewLoanCommand}" HorizontalOptions="End" VerticalOptions="End" Style="{DynamicResource FloatingActionButtonStyle}" /> </Grid> </ContentPage>

    

最新问题
© www.soinside.com 2019 - 2025. All rights reserved.