CODEWITHSUNDEEP
c#iosxamarinxamarin.forms
ScarletMerlin
ScarletMerlin

Reputation: 475

TapGesture in Xamarin From Bound property

OK, I have a ViewCell class that is bound to a viewModel. If I create a label I can do something like this:

        var taskName = new Label()
        {
            XAlign = TextAlignment.Start,
            YAlign = TextAlignment.Start,
            FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label)),
            FontAttributes = FontAttributes.Bold,
            LineBreakMode = LineBreakMode.TailTruncation
        };

        taskName.SetBinding(Label.TextProperty, "CompanyName");

What I want to do is bind the The value of the object to a tapGesture.

        var tapGesturePhone = new TapGestureRecognizer ();

        var phoneIcon = new Image {
            HorizontalOptions = LayoutOptions.Center,
            VerticalOptions = LayoutOptions.Center,
            Source = "phone.png"

        };

        phoneIcon.GestureRecognizers.Add (tapGesturePhone);

        tapGesturePhone.Tapped += (sender, e) => {
            var uri = new Uri("tel:" + );
            Device.OpenUri(uri);

        };

        //uri.setbinding("Uri.text", "PhoneNo")?

Any Ideas as to how I can do this? a work around would be fine too.

I have a model named ProjectContacts With a ProjectContactsViewModel set as its BindingContext.

My ContentView looks like this:

public ProjectContactsView ()
    {
        //bind the view model to the context
        this.BindingContext = _viewModel;

        _list.ItemTemplate = new DataTemplate(typeof(ProjectContactsListCell));
        _list.IsGroupingEnabled = true;
        _list.GroupDisplayBinding = new Binding("Key");
        _list.GroupHeaderTemplate = new DataTemplate(typeof(ProjectContactsListHeaderCell));
        _list.HasUnevenRows = true;
    }

Solution

Thanks to @Sten Petrov I managed to fix this. I ended up having to declare a new instance of my ProjectContactsViewModel inside my ViewCell

private TapGestureRecognizer tapGesturePhone = new TapGestureRecognizer ();
tapGesturePhone.BindingContext = new ProjectContactsViewModel ();

Then I bound my TapGestureRecognizer in the ViewCell this way:

tapGesturePhone.SetBinding<ProjectContactsViewModel> (TapGestureRecognizer.CommandProperty, vm => vm.DialPhoneCommand);
tapGesturePhone.SetBinding<ProjectContactsViewModel> (TapGestureRecognizer.CommandParameterProperty,vm => vm.PhoneNo);

From Here I just had to Create a Setter and Getter for the ViewModel and init the Command in the constructor:

 public Command DialPhoneCommand {get;set;}
 public string PhoneNo { get {return "http://google.com"; } set{ PhoneNo = value;}}
 public ProjectContactsViewModel ()
            {
                //Assign the dialcommand.
                DialPhoneCommand = new Command((phoneNo)=> 
                    Device.OpenUri(new Uri(phoneNo.ToString())));

            }

Upvotes: 0

Views: 1031

Answers (1)

Sten Petrov
Sten Petrov

Reputation: 11040

You can create a Command in your ProjectContactsViewModel and bind the tapGesture.Command to that.

The same way you bind 

 taskName.SetBinding(Label.TextProperty, "CompanyName");

you can bind the command of a tap gesture

    var tapGesturePhone = new TapGestureRecognizer ();
      tapGesturePhone.SetBinding(TapGestureRecognizer.CommandProperty,"DialPhoneCommand");
tapGesturePhone.SetBinding(TapGestureRecognizer.CommandParameterProperty,"PhoneNo");

      var phoneIcon = new Image {
        HorizontalOptions = LayoutOptions.Center,
        VerticalOptions = LayoutOptions.Center,
        Source = "phone.png" 
      };

  phoneIcon.GestureRecognizers.Add (tapGesturePhone);

The command could be initialized in ProjectContactsViewModel (for simplicity):

... ProjectContactsViewModel { 
  public string PhoneNo {get;set;} 
  public Command DialPhoneCommand {get;set;}
  ...
  public ProjectContactsViewModel(){
    DialPhoneCommand = new Command((phoneNo)=> 
      Device.OpenUri(new Uri("tel:" + phoneNo ));
    );
  }
}

Upvotes: 2

Related Questions