Question

三天后，我一直在尝试所有“可能会回答您的问题”，但仍然不高兴。

我有一个XAML页面，该页面包含产品及其详细信息的ListView，通过绑定到名为RackProducts的模型可以看到：

<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="PapillonWine.PapillonRackCatalogPage" 
             xmlns:local="clr-namespace:PapillonWine;assembly=PapillonWine" 
             xmlns:artina="clr-namespace:UXDivers.Artina.Shared;assembly=UXDivers.Artina.Shared"
             xmlns:customContentView="clr-namespace:PapillonWine.NavBars"
             Title="{ artina:Translate PageTitleProductsCatalog }"
             BackgroundColor="{ DynamicResource MainWrapperBackgroundColor }"
             x:Name="CatalogItemPage">

    <ContentPage.Content>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="70" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>

            <customContentView:CustomNavigationBar Grid.Row="0" x:Name="NavigationBarView" BackgroundColor="Transparent"/>

            <ListView
            x:Name="PapillonRackItems"    
            Grid.Row="1" 
            ItemsSource="{ Binding RackProducts }"
            HasUnevenRows="True"
            ItemSelected="OnItemSelected">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <local:PapillonCatalogItemTemplate />
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </Grid>
    </ContentPage.Content>
</ContentPage>

使用PapillonCatalogItemTemplate显示每个产品，该模板具有四个按钮（用于查看产品图像的轮播，添加到购物车，查看尺寸以及最后共享产品）。此PapillonCatalogItemTemplate如下：

<?xml version="1.0" encoding="utf-8"?>
<ContentView xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="PapillonWine.PapillonCatalogItemTemplate" 
             xmlns:local="clr-namespace:PapillonWine;assembly=PapillonWine" 
             xmlns:artina="clr-namespace:UXDivers.Artina.Shared;assembly=UXDivers.Artina.Shared"
             xmlns:customContentView="clr-namespace:PapillonWine.NavBars"
             xmlns:ffimageloading="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms" 
             xmlns:fftransformations="clr-namespace:FFImageLoading.Transformations;assembly=FFImageLoading.Transformations"
             Padding="10" BackgroundColor="{ DynamicResource MainWrapperBackgroundColor }" 
             x:Name="CatalogItemTemplate">

    <!-- FAVORITE ICON -->


    <Grid>
        <!-- COLUMN DEFS -->
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <!-- ROW DEFS -->
        <Grid.RowDefinitions>
            <RowDefinition Height="0.45*" />
            <RowDefinition><RowDefinition.Height><OnIdiom x:TypeArguments="GridLength" Phone="200" Tablet="400" /></RowDefinition.Height></RowDefinition>
        </Grid.RowDefinitions>

      <StackLayout Grid.Column="0" Grid.Row="0" Spacing="5" HorizontalOptions="FillAndExpand" WidthRequest="1000" >

      <!-- PRODUCT NAME -->
        <Label Text="{ Binding Name }" />                            

       <!-- DESCRIPTION -->
         <Label Text="{Binding Description}" />


        <!-- BUTTONS -->
      <StackLayout x:Name="buttonstack" Orientation="Horizontal" >

          <!-- SHOW IMAGES -->
          <artina:Button
            x:Name="ImageCarousel"
            Text="{ x:Static local:FontAwesomeWeb511Font.CameraRetro }"
            Style="{StaticResource FontIcon}"
            BindingContext="{Binding Source={x:Reference CatalogItemTemplate}, Path=BindingContext}" 
            Command="{Binding OnClickViewImageCarousel}" 
            CommandParameter="{Binding Source={x:Reference buttonstack}, Path=BindingContext}" >

          <!-- SHOW CART -->
          <artina:Button
            Text="{ x:Static local:FontAwesomeWeb511Font.cartplus }"
            Style="{StaticResource FontIcon}"
            Clicked="OnBuyItemSelected">
          </artina:Button>

          <!-- SHOW DIMENSIONS -->
          <artina:Button
            Text="{ x:Static local:FontAwesomeWeb511Font.RulerCombined }"
            Style="{StaticResource FontIcon}"
            Clicked="OnDimensionsSelected" >

          <!-- SHOW IMAGES -->
          <artina:Button
            Text="{ x:Static local:FontAwesomeFont.Share }"
            Style="{StaticResource FontIcon}"
            Clicked="OnShareSelected" >

        </StackLayout>                
        </StackLayout>     

                    <ffimageloading:CachedImage
                        Grid.Column="0" Grid.Row="1"
                        Source="{ Binding Image }" />       
        </Grid>
</ContentView>

如果单击模板项目底部的ffloading图像，则会触发OnItemSelected按钮，并且会出现一个新的漂亮的视图页面，其中包含我选择的产品的图片及其所有项目详细信息……恶霸！它触发的代码如下：

public async void OnItemSelected(object sender, SelectedItemChangedEventArgs e)
        {
            var selectedItem = ((ListView)sender).SelectedItem;

            var page = new PapillonRackItemViewPage(((RackProduct)selectedItem).Id);

            await Navigation.PushModalAsync(page);
        }

但是...如果我尝试触发项目模板中的一个按钮（例如“ SHOW IMAGES”正下方的按钮），则什么也没发生。我在第一个按钮中保留了Commmand，CommandParameter和Binding参数，但是我不确定它们是否正确。我尝试了ICommand路由，TapGestureRecognizer路由，并尝试了大多数类似的帖子，但我确实需要帮助。如何传递与ListView及其“ RackProducts”相同的绑定上下文”，通过列表视图中的按钮项进行绑定？有什么需要帮助的机会吗？谢谢！

Answer 1

在您的XAML中

Clicked="OnClickViewImageCarousel" CommandParameter="{Binding .}"

然后在后面的代码中

protected void OnClickViewImageCarousel(object sender, EventArgs e) 
{
  var selectedItem = (RackProduct)((Button)sender).CommandParameter; 
}

ListView项内的按钮绑定（Xamarin）

1 个答案: