CardTappedCommand not found

[Mohammad Hossein Karami]

I use card view 17.1.0.47 and I want to add tapped command with command parameter, but it's show error and not found

[Rachel A]

Hi Mohammad, 

 

Greetings from Syncfusion. 

 

We have provided support for CardTapped command from 17.20.28 beta version as mentioned in the below release notes.  

 

https://help.syncfusion.com/xamarin/release-notes/v17.2.0.28?type=all#sfcardlayout-features 

 

Please upgrade to the latest version and confirm us whether the reported problem is resolved at your end. 

 

Thanks, 

Rachel. 

[Mohammad Hossein Karami]

Thanks, I update it and now it works

Now I have new problem, How can I get patameter in viewmodel?
I do like this:

     CardTappedCommand="{Binding BindingContext.DataContext.CardTappedCommand, Source={x:Reference MainPageContent}}"

     CardTappedCommandParameter="{Binding Id}"

viewmodel:

        private IMvxAsyncCommand<string> _cardTappedCommand;

        public IMvxAsyncCommand<string> CardTappedCommand

        {

            get

            {

                _cardTappedCommand = _cardTappedCommand ?? new MvxAsyncCommand<string>(CardTapped);

                return _cardTappedCommand;

            }

        }

        private async Task CardTapped(string Id)

        {

            await MaterialDialog.Instance.SnackbarAsync(Id);

        }

Id is number as long. but this code not get correct value(it's just get message)

I use mvvmcross in project

[Rachel A]

Hi Mohammad, 

Greetings from Syncfusion. 

We have prepared sample to get the particular card details using the CardTappedCommand and CardTappedCommandParameter property in the SfCardLayout.  

CardTappedCommandParameter behavior: 

• By default, you can get the tapped card view details in the CardTappedCommand event when without setting the value to the CardTappedCommandParameter property. Also, you can pass any object to the CardTappedCommandParameter property as like in below code snippet.

[XAML] 

  

<Grid VerticalOptions="Center">
                <card:SfCardLayout BindableLayout.ItemsSource="{Binding Data}" 
                                   CardTappedCommand="{Binding CardTappedCommand}" 
                                   CardTappedCommandParameter="{x:Reference cardLayout}"
                                   x:Name="cardLayout" BackgroundColor="#F0F0F0"
                                   SwipeDirection="Left" HeightRequest="500">
                    
                    <BindableLayout.ItemTemplate>
                        <DataTemplate>
                            <card:SfCardView>  

                                      …………. 

                                      …………. 

                            </card:SfCardView>
                        </DataTemplate>
                    </BindableLayout.ItemTemplate>
                </card:SfCardLayout>
</Grid>  

[C#] 

public class ViewModel: INotifyPropertyChanged  

{
        public ObservableCollection<Model> Data { get; set; }

        public event PropertyChangedEventHandler PropertyChanged;

        public ICommand CardTappedCommand { get; set; }

        private object cardDescription;

        public object CardDescription
        {
            get { return cardDescription; }
            set 
            {
                cardDescription = value;
                RaisePropertyChanged("CardDescription");
            }
        }
        void RaisePropertyChanged(string name)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(name));
            }
        }  

       public ViewModel()
       {   

            CardTappedCommand = new Command<object>(CardTappedEvent);  

        } 

        private void CardTappedEvent(object args)
        {
            SfCardLayout cardLayout = args as SfCardLayout;
            CardDescription = (cardLayout.BindingContext as ViewModel).Data[cardLayout.VisibleCardIndex].Price;
        }  

} 

Please download the sample from the following location. 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/CardTappedSample-1767793424 

Please let us know if you need further assistance on this. 

Regards, 

Rachel. 

[Mohammad Hossein Karami]

I check sample code but, it's not work in my project

it's show Object reference not set to an instance of an object error when I add x:name

my codes:

when I remove x:name and command parameter it's work and send cardview options like background color or if I add {Binding BlogPost} to parameter it's return all cards but I want just tapped card.

Also without parameter when I want cast object to SfCardLayout or SfCardView like last image it's null but args has value.

[Lakshmi Radha Krishnan]

Hi Mohammed,

 

Query 1: Can we pass the parameters using x:name.

 

Yes, you can pass any object as a parameter of CardTappedCommandParameter property using x:Name attribute.

 

Query 2: Can you check using the code given, whether the card tapped command parameters pass the card layout.

 

Yes, we have checked the argument in the CardTappedCommand event using the provided code snippet and it is working fine in our sample.

 

Query 3: Provide solution for getting tapped in card tapped command.

 

We have achieved your requirement in another way. Please refer the below code snippet.

 

Solution: Get the tapped card view details as a parameter without setting CardTappedCommandParameter

 

As we have mentioned earlier, you no need to set CardTappedCommandParameter property explicitly, because we have passed the particular tapped card view as a parameter by default. Please refer the below code snippet for your reference.

 

Code Snippet:

 

Xaml:  

 <card:SfCardLayout BindableLayout.ItemsSource="{Binding Data}" 
                                   CardTappedCommand="{Binding CardTappedCommand}" 
                                   BackgroundColor="#F0F0F0"
                                   SwipeDirection="Left" HeightRequest="500" Margin="1"
                                   Padding="1">
                    
       <BindableLayout.ItemTemplate>

                         ………

       </BindableLayout.ItemTemplate>
</card:SfCardLayout>

 

C#:

 private void CardTappedEvent(object args)
 {
             SfCardView cardView = (args as TappedEventArgs).Parameter as SfCardView;
            SfCardLayout cardLayout = cardView.Parent as SfCardLayout; 
 }

 

Could you please confirm us whether you may fulfil your requirement using the above provided solution?

 

Regards,

Lakshmi R.

 

 

Attachment: CardTappedSample_(1)_e1d570c.zip