Source Analysis

I have been spoiled for years with ReSharper on Visual Studio, however Xamarin Studio actually ships with Source Code Analysis right out of the box. With the launch of Xamarin 3 this feature has been enabled by default, but I have been using it for some time and it makes daily development so much better. Simply look on the side of your code file for an overview of all the enhancements and optimizations you can make to your code.

TestFlight Integration

Distributing beta builds of my apps to my testers is always tricky. On Google Play you can have a beta/alpha channel and upload your APK and on Windows there is a beta option, but you have to leave the IDE. With TestFlight integration into Xamarin Studio you can easily upload your iOS applications with 1 click!

Workspaces

I am often working on multiple apps at the same time and Workspaces make it extremely easy to work on everything all at once. With this feature you don’t need multiple instances of Xamarin Studio open to work on multiple libraries or apps. Simply create a workspace and add as many solutions or projects as you would like.

So Much More

These are just 3 features I chose to highlight, but there is so much more include all of the unit test features, app archiving, universal search, version control, and about a thousand other awesome features. I would love to see what features of Xamarin Studio you love the most.

If you have read my blog then you know that I love pull to refresh functionality in all of my apps. Your users are expecting this functionality in all of their apps and I believe that it should be drop dead simple to bing pull to refresh to an MVVM style of development.

Xamarin.Forms shines in a lot of areas and the team has made it really easy to extend the built in controls or add brand new controls while allowing you to create custom bindable properties. So naturally we should add a bindable pull to refresh for iOS since it is built right into the framework of UITableView.

Custom ListView

So first thing first, let’s create a brand new PullToRefreshListView that will derive from Xamarin.Forms.ListView. We will add 3 new bindable properties to it, which are IsRefreshing to tell the spinner to show, RefreshCommand for what to execute when your users pulls down, and finally Message which is an optional string to display under the spinner. This code will go into our shared code:

Custom UIRefreshControl

Now let’s setup our custom implementation down in our iOS project. I am first going to create my own custom UIRefreshControl with bindable properties on it. You will notice this is nearly the same code as my MvvmCross implementation, because we are basically doing the same thing. I create the same 3 custom properties, but implement them to actually trigger the command or being/end refreshing of the control:

Customer ListView Renderer

Xamarin.Forms is pretty brilliant as you can create your very own custom “Renderers”. This allows you to extend a current control or build your own. There is a wonderful video by Mark Smith on the Xamarin Forums on how to do it yourself in detail. The concept is that every built in control in Xamarin.Forms has a shim renderer on top of it which you can get property change notifications and have access to the Xamarin.Forms “control” such as our new PullToRefreshListView and also the native control, in this case the UITableView. This is awesome, so now we can create a brand new FormsUIRefreshControl when our ListView is created, and then we will subscribe to property change notifications and update the control:

Finally let’s put this thing onto the screen! So I am going to first create a small little ViewModel that has some bindable properties on it, and a Command that I want to be triggered when my user pulls to refresh. Nothing crazy here if you have done MVVM style programming and implementing INotifyPropertyChanged, which is how Xamarin.Forms knows how to trigger updates:

Put it on the page

Finally let’s bind up a new page with our custom properties that will display. I am just updating the default App.cs file here to add our new PullToRefreshListView to a new page and setting the BindingContext of the page to our TestViewModel:

If that wasn’t enough, here is a full video walkthrough and all of the source code is on GitHub:

When I created the app though I decided that I would start with a PCL as I knew I wanted to bring it over to iOS and Android with Xamarin. The PCL is really simple and just uses HTTPClient to grab a random image. In the future I am going to implement MVVMCross across platform just for fun. Each client displays the image in an ImageView in their own way and on Windows Phone there was a great library on NuGet already, but on iOS there wasn’t anything like this. What I did find was an Objective-C version on Github. So I decided to port it over to Xamarin.iOS:

As you can see the usage is pretty simple. I allow a URL to be passed in or NSData if you have it already. Additionally I changed the API to actually allow you to pass in the UIImageView and it will update the layers automatically. What the code is mostly doing here is grabbing each frame, getting timestamps, and then updating the imageview with an animation. It was actually pretty easy and only took me about 2 hours. Hopefully Puppy Kitty Overflow will pass certification soon on iOS :)

1. A simple IRemove.cs interface that has one ICommand to remove an item.
2. Implement this interface in ANY ViewModel
3. A custom MvxStandardTableViewSource that will handle the delete overrides and takes an IRemove class.

That is is really!

Here is the interface:

public interface IRemove
{
  ICommand RemoveCommand { get; }
}

The “MvxDeleteStandardTableViewSource” Impelemtnation

public class MvxDeleteStandardTableViewSource : MvxStandardTableViewSource
{

  private IRemove m_ViewModel;

#region Constructors
  public MvxDeleteStandardTableViewSource(IRemove viewModel, UITableView tableView, UITableViewCellStyle style, NSString cellIdentifier, IEnumerable<MvxBindingDescription> descriptions, UITableViewCellAccessory tableViewCellAccessory = 0)
			: base(tableView, style, cellIdentifier, descriptions, tableViewCellAccessory)
  {
    m_ViewModel = viewModel;
  }

  public MvxDeleteStandardTableViewSource(IRemove viewModel, UITableView tableView, string bindingText) : base(tableView, bindingText)
  {
    m_ViewModel = viewModel;
  }

  public MvxDeleteStandardTableViewSource(IRemove viewModel, UITableView tableView, NSString cellIdentifier) : base(tableView, cellIdentifier)
  {
    m_ViewModel = viewModel;
  }

  public MvxDeleteStandardTableViewSource(IRemove viewModel, UITableView tableView) : base(tableView)
  {
    m_ViewModel = viewModel;
  }

  public MvxDeleteStandardTableViewSource(IRemove viewModel, UITableView tableView, UITableViewCellStyle style, NSString cellId, string binding, UITableViewCellAccessory accessory)
			: base(tableView, style, cellId, binding, accessory)
  {
    m_ViewModel = viewModel;
  }
#endregion

  public override bool CanEditRow(UITableView tableView, NSIndexPath indexPath)
  {
    return true;
  }

  public override void CommitEditingStyle(UITableView tableView, UITableViewCellEditingStyle editingStyle, NSIndexPath indexPath)
  {
    switch (editingStyle)
    {
      case UITableViewCellEditingStyle.Delete:
        m_ViewModel.RemoveCommand.Execute(indexPath.Row);
        break;
      case UITableViewCellEditingStyle.None:
        break;
      }
  }

  public override UITableViewCellEditingStyle EditingStyleForRow(UITableView tableView, NSIndexPath indexPath)
  {
    return UITableViewCellEditingStyle.Delete;
  }

  public override bool CanMoveRow(UITableView tableView, NSIndexPath indexPath)
  {
    return false;
  }
}

Here is my implementation in my view model:

private MvxCommand<int> m_RemoveCommand;
public ICommand RemoveCommand
{
get => m_RemoveCommand ?? (m_RemoveCommand = new MvxCommand<int>(i => this.m_List.RemoveAt(i)));
}

Then in your View you will just need to setup this:

m_TableView = new UITableView();
Add(m_TableView);

var source = new MvxDeleteStandardTableViewSource (ViewModel, m_TableView, UITableViewCellStyle.Subtitle, new NSString("my_id"), "TitleText Title;DetailText Subtitle;ImageUrl Image", UITableViewCellAccessory.None);
m_TableView.Source = source;

Boom now you are getting sweet swipe to delete with ease!

I also have a full Gist on GitHub!

The possibilities are endless here as well. Your IRemove interface could also have something like a string for what to say (instead of delete) or a method that returns it based on the index. You could also apply this for the drag/drop as well, which would be pretty simple.

In iOS6+ land adding pull to refresh is EXTREMELY simple. You can read all about it, but basically you need to just implement 1 method and you can even set a custom string and style it. It is beautiful, however there was no way to bind anything in MvvmCross. So I wanted to create a simple binding to accomplish a few goals:

1.) Execute an ICommand when someone pulls down to refresh

2.) Bind a bool to begin and end the refreshing spinner

3.) Bind a string to set the AttributedTitle (what is displayed to the user) when they pull or when it refreshes.

So I created a very very simple UIRefreshControl, which you can find on Gist RIGHT HERE

The code is as simple to implement as:

var refreshControl = new MvxUIRefreshControl();
this.RefreshControl = refreshControl;

var set = this.CreateBindingSet<MyView, MyViewModel>();
set.Bind(refreshControl).For(r => r.IsRefreshing).To(vm => vm.IsBusy);
set.Bind(refreshControl).For(r => r.RefreshCommand).To(vm => vm.ReloadCommand);
set.Bind(refreshControl).For(r => r.Message).To(vm => vm.BusyMessage);
set.Apply();

I hope this helps