Bind command to custom control and execute?

KeirLavelleKeirLavelle USMember
edited May 2015 in Xamarin.Forms

I've created a custom control which contains a UIButton, and I would like to be able to bind a command from my ViewModel to be executed when a gesture is executed on it.

I have added the action for the button in Xcode and then added a handler in my .cs file for the action - I'm just not sure how I execute a command from my non platform specific view model (presumably it's inside this handler?) when the action is fired?

If anyone could help shine some light on the issue it would be much appreciated, thank you.

Tagged:

Best Answer

Answers

  • NMackayNMackay GBInsider, University mod

    I borrowed this code from the forums which uses an image to act like a button and to execute a command in the viewmodel.

    `using System.Threading.Tasks;
    using System.Windows.Input;
    using Xamarin.Forms;

    namespace OrderManager.CustomRenderers
    {
    public class ImageButton : Image
    {

        public static readonly BindableProperty CommandProperty = BindableProperty.Create<ImageButton, ICommand>(p => p.Command, null);
        public ICommand Command
        {
            get { return (ICommand)GetValue(CommandProperty); }
            set { SetValue(CommandProperty, value); }
        }
    
    
        public static readonly BindableProperty CommandParameterProperty = BindableProperty.Create<ImageButton, object>(p => p.CommandParameter, null);
        public object CommandParameter
        {
            get { return (object)GetValue(CommandParameterProperty); }
            set { SetValue(CommandParameterProperty, value); }
        }
    
        private ICommand TransitionCommand
        {
            get
            {
                return new Command(async () =>
                {
                    this.AnchorX = 0.48;
                    this.AnchorY = 0.48;
                    await this.ScaleTo(0.8, 50, Easing.Linear);
                    await Task.Delay(100);
                    await this.ScaleTo(1, 50, Easing.Linear);
                    if (Command != null)
                    {
                        Command.Execute(CommandParameter);
                    }
                });
            }
        }
    
        public ImageButton()
        {
            Initialize();
        }
    
    
        public void Initialize()
        {
            GestureRecognizers.Add(new TapGestureRecognizer()
            {
                Command = TransitionCommand
            });
        }
    
    }
    

    }`

    And then in the view you just do the following to execute a command in the view's binding context (vm)

    xmlns:local="clr-namespace:OrderManager.CustomRenderers;assembly=OrderManager"

    <local:ImageButton x:Name="ButtonSearch" Grid.Column="2" HeightRequest="30" WidthRequest="34" HorizontalOptions="StartAndExpand" VerticalOptions="FillAndExpand" Command="{Binding SearchCommand}" Source="IconSearch.png" />

  • KeirLavelleKeirLavelle USMember

    Thanks for this, what about if it was a non tap gesture, such as a swipe gesture which I presumably would need to implement in the platform specific renderer for the control, is it still possible to execute a command on the view model from this platform specific renderer?

  • KeirLavelleKeirLavelle USMember

    Thanks, I have seen MrGestures around but I was hoping for my own learning there would be some way to implement it myself

Sign In or Register to comment.