Xamarin表单按钮命令绑定在ListView中 [英] Xamarin Forms Button Command binding inside a ListView

问题描述

我有以下问题，在我看来，我有一个Listview.在此列表视图中，我想有两个按钮.一种用于编辑项目，一种用于删除项目.

I have the following problem, in my view I have a Listview. In this listview I would like to have two buttons. One for editing the item, one to delete it.

这是我在XAML中的列表视图

<ListView Grid.Row="1" x:Name="ArbeitsEinträgeList" ItemsSource="{Binding EintragList}" SelectedItem="{Binding SelectedItem}">
      <ListView.ItemTemplate>
        <DataTemplate>
          <ViewCell>
            <ViewCell.View>
              <Grid>
                <Grid.ColumnDefinitions>
                  <ColumnDefinition/>
                  <ColumnDefinition/>
                  <ColumnDefinition/>
                  <ColumnDefinition Width="Auto"/>
                  <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>
                <Label Text="{Binding Titel}" TextColor="{Binding Fehlerhaft, Converter={StaticResource EintragartConverter}}"></Label>
                <Label Grid.Column="1" Text="{Binding Beginn}" TextColor="{Binding BeginnManuell, Converter={StaticResource EintragartConverter}}"></Label>
                <Label Grid.Column="2" Text="{Binding Ende}" TextColor="{Binding EndeManuell, Converter={StaticResource EintragartConverter}}"></Label>
                <Button Grid.Column="3" Command="{Binding EditEintragCommand}" Text="&#xf040;" FontFamily="../Ressources/fontawesome.ttf#FontAwesome"></Button>
                <Button Grid.Column="4" Command="{Binding DeleteEintragCommand}" Text="&#xF00D;" FontFamily="../Ressources/fontawesome.ttf#FontAwesome"></Button>
              </Grid>
            </ViewCell.View>
          </ViewCell>
        </DataTemplate>
      </ListView.ItemTemplate>
    </ListView>

我的ViewModel就是我所需要的一切，我已经用不在列表视图中的按钮测试了命令，并且效果很好.

In my ViewModel is everything I need, I have tested the commands with a button not in the listview and it works perfect.

如果我将鼠标悬停在绑定上，则会出现消息无法解析符号'...'"

If I hover over the binding, the message "Cannot resolve symbol '...'" appears

推荐答案

1月

由于使用了列表视图，并且命令位于DataTemplate内部，因此绑定将附加到ItemSource中每个单独模型的绑定上下文.

Since you've used a list view and your commands are inside the DataTemplate, the binding is attached to the binding context of the each individual model in the ItemSource.

一种解决方法是执行以下操作:

A way around this is do do the following:

<ListView Grid.Row="1" x:Name="ArbeitsEinträgeList" ItemsSource="{Binding EintragList}" SelectedItem="{Binding SelectedItem}">
      <ListView.ItemTemplate>
        <DataTemplate>
          <ViewCell>
            <ViewCell.View>
              <Grid x:Name="Item">
                <Grid.ColumnDefinitions>
                  <ColumnDefinition/>
                  <ColumnDefinition/>
                  <ColumnDefinition/>
                  <ColumnDefinition Width="Auto"/>
                  <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>
                <Label Text="{Binding Titel}" TextColor="{Binding Fehlerhaft, Converter={StaticResource EintragartConverter}}"></Label>
                <Label Grid.Column="1" Text="{Binding Beginn}" TextColor="{Binding BeginnManuell, Converter={StaticResource EintragartConverter}}"></Label>
                <Label Grid.Column="2" Text="{Binding Ende}" TextColor="{Binding EndeManuell, Converter={StaticResource EintragartConverter}}"></Label>
                <Button Grid.Column="3" BindingContext="{Binding Source={x:Reference ArbeitsEinträgeList}, Path=BindingContext}"   Command="{Binding EditEintragCommand}"   CommandParameter="{Binding Source={x:Reference Item}, Path=BindingContext}" Text="&#xf040;" FontFamily="../Ressources/fontawesome.ttf#FontAwesome"></Button>
                <Button Grid.Column="4" BindingContext="{Binding Source={x:Reference ArbeitsEinträgeList}, Path=BindingContext}" Command="{Binding DeleteEintragCommand}"  CommandParameter="{Binding Source={x:Reference Item}, Path=BindingContext}" Text="&#xF00D;" FontFamily="../Ressources/fontawesome.ttf#FontAwesome"></Button>
              </Grid>
            </ViewCell.View>
          </ViewCell>
        </DataTemplate>
      </ListView.ItemTemplate>
    </ListView>

因此，您将绑定源设置为引用列表视图的绑定上下文(即，您的视图模型或ArbeitsEinträgeList".您还可以将command参数设置为每个单独项目的绑定上下文.如您所见，网格上有x:Name ="Item"，CommandParameter ="{Binding Source = {x:Reference Item}，Path = BindingContext}".

So you set the binding source to reference the binding context of the list view (i.e your view model or "ArbeitsEinträgeList". You can also set the command parameter to be the binding context of each individual item. As you can see I have x:Name="Item" on the grid and CommandParameter="{Binding Source={x:Reference Item}, Path=BindingContext}".

简单地，通过声明这样的命令，您就可以在视图模型中以及在以命令参数作为单个项目的绑定上下文执行命令时定义通用命令.

Simply, declaring commands like this allows you do define a generic command in your view model and when the command is executed with the command parameter being the binding context of the individual item.

 public ICommand DeleteEintragCommand
        {
            get
            {
                return new Command((e) =>
                    {
                        var item = (e as MyModelObject);
                        // delete logic on item
                    });
            }
        }

这篇关于Xamarin表单按钮命令绑定在ListView中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！