Xamarin.Forms: using the PanGestureRecognizer

Recently I’ve blogged about Xamarin.Forms and how to create a XAML Behavior for enabling Multi-Touch gestures to generic elements and implementing a scale / pinch functionality.

Fortunately the framework provides three types of recognizer that greatly simplify the implementation:

  • PinchGestureRecognizer allows user interactions for zoom / scale functionalities;
  • PanGestureRecognizer enables pan / translate transformations;
  • TapGestureRecognizer detects tap events.

Yesterday I decided to try the PanGestureRecognizer for extending the capabilities of the Behavior described in the previous post.

First of all, I added two Bindable properties in order to permit activation / deactivation of individual gestures (Bindable properties are equivalent to Dependency ones in UWP XAML)

In this way we can specify in our XAML what gestures are enabled:

Then I initialised the GestureRecognizers adding a new PanGestureRecognizer to the recognizers list:

And subscribed to the PanUpdated event in order to apply the translate transform:

The implementation of this event handler permits to update the X and Y coordinates of the element when a Pan gesture is detected:

Here we go: the sample app can now be deployed to the emulators and iOS / Android / Windows devices.

Just a couple of notes:

  • deployment to iOS required this workaround to work properly since the new sample app uses different assemblies;
  • Tap gestures on Android requires Xamarin.Forms – minimum version v2.1.0.6501-pre1 as pointed by the official documentation.

As usual, the latest source code is available for download on GitHub.

Multi-Touch Behaviors project moved to GitHub

I’ve just pushed to GitHub a first version of the Multi-Touch Behaviors containing a new sample targeting Windows 10 UWP (work in progress…) and some refactoring using shared projects in order to simplify the code and reusing it across different platforms.

For new contributions just send pull requests here!

Multi-Touch Behaviors sample: Main Page

TypedMVVM and WinJS: Binding event handlers in a ListView ItemTemplate

I have recently received a request in the TypedMVVM forums about binding event handlers to a specific WinJS ListView item template.

I’ve then decided to improve the current samples available in the repository by adding some basic commands, using the RelayCommand<T> class, that can be fired by pressing a button associated to each item of the ListView:

The key here is to add the “win-interactive” class to the specific button element contained in the template (otherwise the click event will not be triggered) and then use WinJS.Utilities.markSupportedForProcessing() in the model to allow the declarative binding to be correctly applied:

Specific instances of the ListView model can be created by the sample service responsible for initialising the ViewModel data:

As usual, the sample code is available for download here.

TypedMVVM: Samples updated for Apache Cordova

I’ve recently installed the Multi-Device Hybrid Apps template on Visual Studio in order to try out the development of native mobile applications (targeting Android, iOS, Windows Store and Windows Phone) using HTML, CSS and JavaScript using the Apache Cordova framework.

As a first example, I decided to reuse all the TypeScript code available in my library TypedMVVM available on CodePlex.

The process was very simple and didn’t take long: I was able to quickly create a basic “Hello World” application successfully deployed on the Ripple – Nexus 7 Android emulator

TypedMVVM_Cordova

As usual, the updated code is available for download on Codeplex.

WinJS and TypeScript: binding a ListView itemDataSource to a ViewModel property

I’ve recently been asked on the TypedMVVM forums how to properly bind a ListView data source to a list of items available as a property in the ViewModel.

Just create new getters and setters in the ViewModel and initialise the property by creating a new instance of WinJS.Binding.List:

Then reference from HTML the new itemsSource property in the ListView control using data-win-bind:

As usual, the sample code is available for download on Codeplex.

TypedMVVM: Adding a new IoC.Container class for generating instances using generics

In the previous days I was extending my TypedMVVM library with additional classes for separating the logic and being able to use different services for handling operations like showing message dialogs.

I’ve then started the implementation of a simple IoC.Container class that will manage in a centralized way the creation of new objects (ViewModels, Services, etc.) used by the application.

The first step was the creation of a simple Resolve<T> method for creating instances using the concept of Generics available in TypeScript.

When working with factories and generics, it’s necessary to refer to class types using their constructor function:

In this way, a new instance of type T will be returned each time the function IoC.Container.resolve will be used.

For example, it’s now possible to inject a service on a ViewModel in this way:

I’m planning for the future more functionalities for this IoC.Container class, like the possibility to register specific services with interfaces and use them as singletons.

The updated code is available for download from the repository here.

WinJS – Adding a reference to an existing Universal shared project from your Windows Store / Windows Phone app

In the past days I was trying to reference an existing “Universal Shared” project from a Windows Store app, but it seems like that the “Add Reference” functionality is still not available on Visual Studio for shared projects when using WinJS or generic JavaScript Universal apps.

I’ve then verified the default Universal apps template and found that every project is referencing the “Shared” one using this Import block in the .jsproj file:

To enable it for your project, just open the “Solution Explorer” in Visual Studio and:

  • right-click the project and select “Unload Project“;
  • select “Edit <Your-Project-Name>.jsproj“;
  • add the “Import Project” block using the code editor and save it;
  • right-click and select “Reload Project“.

The shared project code should now be correctly referenced and available in your original app.

Same technique can obviously be used by Windows Phone 8.1 solutions (or other targets / platforms).

Universal Windows Apps, WinJS and TypedMVVM: samples updated to target Windows Phone and Windows Store apps

I’ve just returned from the Build 2014 conference in San Francisco where I had the opportunity to attend several interesting sessions about new developments in the Microsoft space.

One of the “big news” has been the introduction of the concept of “Universal Windows Apps“, a great way to share code between different platforms including (but not limited to) Windows Phone, Windows Store and Xbox One apps.

I decided to test this new feature on TypedMVVM, one of my “pet projects” which I made available on CodePlex some time ago. The project was originally using a simple MVVM infrastructure targeting Windows Store apps using WinJS and TypeScript so it was an ideal candidate for adding a Windows Phone 8.1 target reusing all the existing code.

The migration to Universal Apps was really straightforward: I was able to have the samples up and running in my emulator and devices while waiting at the airport in San Francisco.

TypedMVVMWindowsPhoneSample

TypedMVVMWindows81Sample

I’ve uploaded all the source code on Codeplex here, feel free to grab and give it a try.

Happy universal coding everyone! 🙂

NDepend v5.0 available

I’ve just received my copy of NDepend v5.0: this new version adds several great features to the product including

  • Support for Visual Studio 2013 (yeah!)
  • New Dashboard Panel
  • Focusing on Recent Rules violation
  • UI Enhancements
  • Trend Monitoring
  • Churning Rules and Queries
  • Report Enhancements

Click here to read a detailed description of the new capabilities and access the download links (14 days trial available).

Happy coding!

NDepend v4.1 adds CQLinq killer feature and support for Windows Store apps

I already blogged about NDepend basic features here: I was positively impressed by the capabilities of this tool by fellow MVP Patrick Smacchia.

NDepend permits you to examine .NET projects and highlight different metrics in the code in order to better analyse what areas of your solution needs refactoring for improving performance, code maintainability, application stability and applying best coding practices (just to name a few).

Some features, already available in the previous versions of NDepend, include tools for visually representing dependencies between classes, defining custom rules on code, explore code diffs and analyse code coverage. These ones are particularly helpful when the size of the project grows: a visual representation helps the developer to better identify areas that needs more work (and then save development time).

Recently Patrick contacted me for highlighting the new features available in NDepend v4.1. I was very pleased to find support for Windows Store apps but another capability got immediately my attention: CQLinq.

This is a killer feature: CQLinq (acronym for Code Query LINQ) enables the developer “to query the code” for retrieving information about it. Some simple examples of queries could be:

  • find me the methods too big / too complex;
  • find the methods added but poorly covered by tests;
  • get information about naming conventions;
  • any other query you like: the possibilities are not limited at all!

Technically these queries can be constructed using the traditional LINQ syntax and the types defined in the NDepend.CoreModel of the NDepend API.

The best place to start using CQLinq is here by exploring the dedicated section on the site which contains a ton of different examples to start: I recommend to try and run the available samples which are an excellent starting point and then modifying them for custom queries.

I’ve been really impressed by CQLinq and I can’t wait to use it on real projects to enhance the quality of the code and then reduce the time needed for new implementations.

Happy coding everyone!