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:
- Browser Service
- Camera Service
- Contact Service
- Local Notification Service
- Location Service
- Mail Service
- Map Samples
- Media Library Service
- Media Service
- Messaging Service
- Reachability Service
- Social Service
- Telephony Service
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: CrosslightMobileServices.zip. Simply open this sample with Xamarin Studio or Visual Studio and run the project.