Skip to end of metadata
Go to start of metadata

In this tutorial, you're going to learn how to access Crosslight's built-in mobile services that you can access via the ViewModel. These mobile services allows you to access various functions of the devices with shared code without having you to do any additional effort, and works seamlessly across iOS and Android. At the end of this tutorial, you should have the following result:


Follow these steps:


Before starting the walkthrough, it is recommended that you have followed these walkthroughs in order:

It is also recommended that you have read through these conceptual topics in order to get a better understanding:

To use this walkthrough, you will need to use at least Crosslight version xxx in order to achieve the desired result.

Let's get started. 

Preparing the Project

Create a new Blank project using the Crosslight Project Wizard and give it a name of CrosslightMobileServices.

Preparing the Core Project

As with all Crosslight apps, you'll need to prepare the ViewModel first that will be the heart of your app. First, open up the SimpleViewModel.cs file located inside CrosslightMobileServices.Core/ViewModels folder. Replace the contents with the following code.

The code above is the heart of this sample, which shows you how to use the mobile services from the ViewModel. In order for this sample to work perfectly, you'll need to do several additional efforts. Create a new folder called Assets inside CrosslightMobileServices.Core project and copy over this file inside the folder.

Don't forget to set the Build Action of the file to EmbeddedResource. This will be needed to invoke two services used in this sample, notably Social Services and Mail Services. Next, copy over this mp3 file and copy it inside CrosslightMobileServices.iOS/Resources folder as well as CrosslightMobileServices.Android/Resources/raw folder (you may need to create the raw folder).

Next, open up SimpleBindingProvider.cs located inside CrosslightMobileServices.Core/BindingProviders folder and use the following code.

Nothing fancy here, we simply bind the buttons onto the respective commands.

Preparing the iOS Project

Next, copy over the storyboard file and replace it with your MainStoryboard.storyboard file inside CrosslightMobileServices.iOS/Views folder. 

There's nothing too fancy here, just a StackView and a number of buttons that will be used for invoking the mobile services. Run the project and you should get the following result.

Feel free to play around with the services. Some services would not work without the use of device though.

Preparing the Android Project

Now that you've prepared the iOS project, let's move on to the Android project. Open up the main.axml file located inside CrosslightMobileServices.Android/Resources/layout folder and use the following code.

Similar to the iOS app, this layout contains a stack of buttons that will be used to trigger the mobile services.


Congratulations! You've just learned how to use the built-in mobile services available through Crosslight ViewModels. The list of mobile services will continue to grow as Crosslight progresses. Should you require additional services that are not readily available in the built-in services, you can do so by registering your own custom services by following the tutorial here: Walkthrough: Extending Crosslight Services, or simply chat with us and request a feature.


You can also find the resulting sample here: Simply open this sample with Xamarin Studio or Visual Studio and run the project.