Using the binding Provider to call a custom method on view controller

1 reply. Last post: June 16, 2014 8:02 AM by Yudi
Tags :

I have a List binding provider and instead of navigating to another page I want tt pop up an image view.

I have a list with thumbnails and I want to add a custom navigation to enlarge the image and catch a click event to hide the image.

How can I using the BindingProvider add a custom binding to call a method that is part of an interface, this was I can customize the method on each platform. Starting with iOS.


I assume I use a DelegateCommand that the view model provides to the controller. How does the ViewController grab this command?

All Replies

Yudi Member

For such scenario, we can use the Modal Navigation instead of using pop up. This approach conforms with the standard navigation that is commonly found in modern mobile apps. For more detail, please check the Standard Navigation article.

My Inventory sample is a good place to start.

this.AddBinding("TableView", BindableProperties.DetailNavigationTargetProperty,  new NavigationTarget(typeof(ItemEditorViewModel), new NavigationParameter(){Animated = false, NavigationMode = NavigationMode.Modal, EnsureNavigationContext = true}), true);

The above code can be used as the custom navigation to show Modal Navigation with no animation. The code should be implemented in ItemListBindingProvider.cs. Next, we should do the following:

  1. Add the view model for the view controller that will host the image view;
  2. Create the view for the view controller using XIB definition;
  3. Set the outlet for the ImageView using Xcode;
  4. Define a binding provider for the view controller that sets the ImageSourceProperty to the ImageView;
    this.AddBinding("MyImageView", BindableProperties.ImageSourceProperty, "Item.Image", BindingMode.TwoWay);
    Don't forget to set the Item property in the view model in the navigated event of the view model.
    this.Item = parameter.Data as YourItem;
  5. Bind the command property to the image view, so that the command in the view model is triggered.
    this.AddBinding("ImageView", BindableProperties.CommandProperty, "CloseImageCommand", BindingMode.TwoWay);
    The CloseImageCommand may contain this definition:
    //define in view model
    this.NavigationService.Close();
    This is to close the modal navigation.

Hope this helps.

All times are GMT -5. The time now is 11:02 AM.
Previous Next