4 tips to start with Xamarin

4 tips to start with Xamarin

One of the breaking news of Q1 2016 in the mobile development business was the announcement that Microsoft bought Xamarin. This is another step forward in Microsoft’s strategy to have their languages and development tools be cross-platform.

xamarin logo

Why is this relevant? Mobile apps are critical for business nowadays and without doubts, Android and iOS control the market.

Xamarin framework allows companies with their existing internal or offshore .NET Dev teams to be able to build native Android and iOS apps using their existing knowledge and tools that they are familiar with (C#, XAML, Visual Studio).

“Learn and apply new tools like Xamarin allow us to provide better solutions for our clients,” says David Wasinger, Project Manager at Hexacta, and continues: “At Hexacta we understand technology as a tool and methodology to improve business results and facilitate growth.”

Whether you are starting a new project with Xamarin or evaluating it for a new project, follow 4 tips that our Hexacta Architecture Team (HAT) recommends you for a successful project.

1. Use Prism

Xamarin provides us with XAML files, with its code-behind and the necessary mechanism to invoke native functionality of each platform, but beyond that, we are free to implement the rest of the application as we see fit.

Prism gives us an implementation of some typical patterns:

  • MVVM
  • Command
  • Events
  • IoC

All this allows us to organize our code in a neatly and maintainable way, the same way we would in a web application.

More information about Prims for Xamarin forms, here.

2. Do not use special characters in Android files

For specific platform issues, Android resource files should not contain special characters (including hyphens and spaces). If we encounter this error when packaging Android:

aapt.exe exited with code 1

We can replace them with an underscore (_).

3. Using a ViewModel for each Model in a list

If we have a list of items like the one below in PersonList.xaml:

<StackLayout VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Orientation="Vertical">
	<ListView ItemsSource="{Binding Persons}">
		<ListView.ItemTemplate>
			<DataTemplate>
				<TestCell Command="{Binding SelectCommand}" Text="{Binding Person.Name}" />
			</DataTemplate>
		</ListView.ItemTemplate>
	</ListView>
	<Button Text="{i18n:Translate AddPerson}" Command="{Binding AddCommand}"/>
</StackLayout>

The AddCommand command would be defined in our PersonListViewModel, which is the BindingContext of our view.

But inside the ListView, the BindingContext is each element that it is iterating.

Then in our PersonListViewModel, we create a ViewModel and for each person we get:

public void OnNavigatedTo(NavigationParameters parameters){
	IList<Person> persons = this.personService.GetAllPersons();
	Persons = new List<PersonViewModel> ();
	foreach (Person person in persons) {
		Persons.Add (new PersonViewModel(this.navigationService, person));
	}
}

And we create our PersonViewModel:

public class PersonViewModel : BindableBase
{
	private readonly INavigationService navigationService;
	private Person person;
	public PersonViewModel (INavigationService navigationService, Person person)
	{
		this.navigationService = navigationService;
		this.person = person;
		SelectCommand = new DelegateCommand (Select);
	}

	public DelegateCommand SelectCommand { get; set; }
	void Select(){
		// Do stuff here	
	}

	public Person Person {
		get { return this.person; }
		set { SetProperty (ref this.person, value); }
	}
}

In the ViewModel, we have our model entity (Person) and the command to select it in the list (SelectCommand).

4. Hide the application icon in the header of Android

By default, in the header of the application, the icon of the application is located. To hide it, we can create a CustomNavigationRenderer on the Android project and set it as transparent:

using System;
using Android.App;
using Android.Graphics.Drawables;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;

[assembly: ExportRenderer(typeof(NavigationPage), typeof(CustomNavigationRenderer))]
public class CustomNavigationRenderer : NavigationRenderer
{
	protected override void OnElementChanged(ElementChangedEventArgs<NavigationPage> e)
	{
		base.OnElementChanged (e);
		RemoveAppIconFromActionBar ();
	}

	void RemoveAppIconFromActionBar()
	{
		var actionBar = ((Activity)Context).ActionBar;
		actionBar.SetIcon (new ColorDrawable(Color.Transparent.ToAndroid()));
	}	
}

More information about removing icon logo from action bar on android, here.

More information on Xamarin

CHECK OUT THE HAT’S BLOG

Comments?  Contact us for more information. We’ll quickly get back to you with the information you need.

SUBSCRIBE TO OUR NEWSLETTER