Forum Xamarin Xamarin.Forms

Command on PancakeView Tap Gesture Recognizer Not Working

I'm creating a chat app and I've created a view model that has a command to allow a user to send their message and add it to a ListView. The send command, however, doesn't work when I use a PancakeView Tap Gesture Recognizer. I tried it with a normal Button and it worked perfectly, so my guess is there's something wrong with how I've implemented it in the Tap Gesture Recognizer. Any help?

ChatPage.xaml

 <!--Chat Messages Area-->
        <ListView Grid.Row="1" 
                 ItemTemplate="{StaticResource MessageTemplateSelector}" 
                 ItemsSource="{Binding Messages}" 
                 Margin="0" 
                 HasUnevenRows="True" 
                 VerticalOptions="FillAndExpand" 
                 SeparatorColor="Transparent" >
        </ListView>

        <!--A simple separater-->
        <BoxView BackgroundColor="LightGray"
                 HorizontalOptions="FillAndExpand"
                 Grid.Row="2"/>

        <!--Chat Entry and Send Button-->
        <StackLayout Orientation="Horizontal" 
                     Margin="0" 
                     Grid.Row="3" 
                     Padding="5,10,10,10">

            <!--Chat Entry-->
            <renderers:RoundedEntry Text="{Binding TextToSend}" 
                                    x:Name="ChatEntry"
                                    Placeholder="Type your message"
                                    CornerRadius="30"
                                    BackColor="White"
                                    BackgroundColor="Transparent"
                                    BorderColor="#999999"
                                    BorderWidth="5"
                                    FontSize="16"
                                    PlaceholderColor="#b3b3b3"
                                    WidthRequest="280"/>

            <!--Send Button-->
            <pancake:PancakeView BackgroundColor="#0f8df4"
                                 CornerRadius="100"
                                 HeightRequest="47"
                                 WidthRequest="47"
                                 HorizontalOptions="EndAndExpand"
                                 xamEffects:TouchEffect.Color="White">

                <pancake:PancakeView.GestureRecognizers>
                    <TapGestureRecognizer Command="{Binding SendCommand}"/>
                </pancake:PancakeView.GestureRecognizers>

                <Image Source="sendarrow1.png"
                       HeightRequest="30"
                       WidthRequest="30"
                       Margin="5,0,0,0"
                       HorizontalOptions="Center"
                       VerticalOptions="Center"/>
            </pancake:PancakeView>
        </StackLayout>

ChatPageViewModel.cs

public class ChatbotPageViewModel : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        /// <summary>
        /// A collection.list of chat message items
        /// </summary>
        public ObservableCollection<ChatMessageModel> Messages { get; set; } = new ObservableCollection<ChatMessageModel>();

        /// <summary>
        /// The text that the user inputs
        /// </summary>
        public string TextToSend { get; set; }

        /// <summary>
        /// A command for sending the users messages
        /// </summary>
        public ICommand SendCommand { get; set; }


        /// <summary>
        /// ChatPageViewModel Constructor
        /// </summary>
        public ChatbotPageViewModel()
        {
            Messages.Add(new ChatMessageModel() { Text = "Hi" });
            Messages.Add(new ChatMessageModel() { Text = "How are you?" });
            Messages.Add(new ChatMessageModel() { Text = "Im good", User = App.User });

            SendCommand = new RelayCommand(Send);
        }

        /// <summary>
        /// This function sends a message
        /// </summary>
        private void Send()
        {
            if (!string.IsNullOrEmpty(TextToSend))
            {
                //This adds the following to the messages collection
                Messages.Add(new ChatMessageModel() { Text = TextToSend, User = App.User});
                TextToSend = string.Empty;
            }
        }

Best Answer

Answers

  • jojo1234jojo1234 Member ✭✭

    Yes, I removed the xamEffects:TouchEffects and it was working, I then realized that package has a xamEffects:Command.Tap property that allows you to use a command without needing Tap Gestures, that's why it wasn't working. Thank you for the help

Sign In or Register to comment.