I know that many of you are looking for how to improve your mobile development application skills, that’s why I have decided to bring you this article with Examples and Tips for Xamarin Forms. This one is a very special content because it is a compilation that includes a lot of resources with examples and good practices for creating good applications in Xamarin Forms.
The three pillars to develop better applications
I have always said that the key to developing the best applications is based on three simple pillars: your app (design and development), the objective of your app, and the developer (or people involved in).
General tips with Xamarin Forms
Learning curve
Learning how to use Xamarin and its components to develop native applications is like learning to ride a bike: it may seem difficult or complicated at first, but it becomes simple with practice. Fortunately, there are tons of resources available to help.
I think one of the key resources is the community. The most popular ones you can find on Facebook with a simple search. I will leave Xamarin Universe on Facebook and Telegram in case you are interested, we have quite a few active people out there and an automated news channel.
For people looking for a guide to learning Xamarin Forms, I’ve written an article where I reveal the“Xamarin Forms Guide”. It is very very complete and has had very good acceptance.
On the other hand, David Ortinau has written an article with“Tips for beating the learning curve”. In this you can find:
- Installation prerequisites
- Common questions about Navigation, Layouts, Visual Design and Controls
- Something more advanced like customizing controls and fonts, handling images, etc.
Structure your project
I recently wrote an e-book highlighting the“7 tactics to structure your projects with Xamarin Forms” that will help you to build more scalable apps. If you don’t already have it, you can download it here.
The tactics I share with you in the e-book are:
- Measure before you start
- Understand the structure of your project
- Consider some extra layers
- Change the structure of your folders conveniently
- Add an MVVM Framework
- Add Reusable Code
- Use the tools you have available
Images
Here I introduce a native solution for Xamarin Forms in image handling to improve performance. And best of all, all you have to do is add a line of code.
For this we will use these two libraries:
Perhaps many of you already know GlideX, but Nuke is relatively new and was developed thanks to the Xamarin team launching“Xamarin Binding Tools For Swift”
.The nice thing about all this is that just by adding the library you get a +90% memory reduction when you manipulate Image views on both platforms.
Resources
Xamarin provides a wealth of resources through its GitHub repository for Xamarin.Forms. Many open license projects are available on GitHub and can be used immediately in your next app. If the base for a module is available on GitHub, you don’t need to create it from scratch.
Xamarin GitHub has dozens of repositories with samples, components, workbooks, and more.
Report a bug
Xamarin handles issues through its repositories. If you encounter an issue in Xamarin Forms then you must provide the following information in the issue report:
- The steps to reproduce the error
- Expected behavior or result
- Actual behavior or result
- Any available backup information, such as log files, images, or videos
- The development or test environment in which the error occurs
- A GitHub repository with an example
Xamarin.Android
Do not use a hyphen in an image or resource name. If you name an image «nice-icon.png» instead of «nice_icon.png» and drop it into your drawable folders, and then try to compile or deploy, you will get all kinds of strange errors. None of these errors will actually say, “Do not use a hyphen in the image name.” So avoid them at all costs.
Tips to increase your application’s performance
Performance
Your app’s performance can be measured in different ways, whether it’s user-perceived performance, interface response time, or battery management. There are some Xamarin techniques you can use to increase the overall performance of your mobile app, including the following:
In the same way, I leave you some resources that are worth gold so you can boost the performance of your applications:
- Xamarin.Forms Performance from Microsoft, including Optimizing App Performance with Xamarin.Forms – Jason Smith from Evolve 2016.
- 5 Ways to Boost Xamarin.Forms App Startup Time by David Ortinau
- Xamarin.Forms Performance on Android by Jonathan Peppers
RelativeLayout and AbsoluteLayout
Just because Xamarin Forms has a RelativeLayout and an AbsoluteLayout doesn’t mean you should use it. There are other better ways to do what you want to do. Really.
I don’t even know why RelativeLayout still exists if they recommend not using it themselves.
With AbsoluteLayout it is not advisable to use AbsoluteLayout.AutoSize but the truth is that it is difficult to be sure that it will look correct in all the form factors and whether it will play well with all the other layout settings of all the other controls.
ListView
Performance
When a list contains a large amount of data, it can suffer slow-moving performance or a delay in setting up or entering data. You can improve ListView performance across all platforms by using a caching strategy.
HasUnevenRows and SeparatorVisibility
If you’re new to Xamarin Forms ListView (which is great, by the way), you may have difficulty getting the vertical layout to “grow” dynamically the way you expect, and you may notice (especially in some versions of iOS) that have horizontal lines that magically appear as dividers between elements.
For this, you have two properties that you may not know: HasUnevenRows and SeparatorVisibility.
Tips to get the most out of Visual Studio
Extensions
I’ve written an article titled“Design Tools” in Xamarin Forms that has had a brutal acceptance. Within this article, I introduce you to some tools to work with Visual Studio among other very interesting things, if you have not seen it I leave it here.
Code Snippets
A code snippet is a piece of text saved as a template, reusable, and that can have value-replaceable arguments when to use. These help in certain situations to write repetitive code and increase our productivity.
Over time, having a working framework and a repository of code snippets can be a real blessing.
Well, here’s the official guide to creating Code Snippets in Visual Studio which is quite complete.
EN: What do you think if we do a Xamarin Month of Code Snippets?
——–
ES: ¿Qué les parece si hacemos un Mes Xamarin de Code Snippets?— Luis Matos (@luismatosluna) April 24, 2020
Tips to get the most out of your MVVM structure
If at this point you are still wondering if you should use MVVM, I will clarify your doubts… Yes, you must if your app exceeds 5 screens and will continue to scale. You don’t need to know anything else. It’s good to be clear that the Model-View-ViewModel (MVVM) pattern helps cleanly separate the business logic of an application from its user interface (UI).
Framework MVVM
When it comes to MVVM frameworks, there are many options available. Which one should you choose then? The general rule of thumb seems to be to use the simplest solution, but it’s good to be clear about the scope of your app.
Light applications
To keep a framework as light as possible, you can use MVVMLight or if you want something simple and small to support your own structure, you can use James Montemagno’s MVVMHelpers.
If you need a base ViewModel (such as an implementation of INotifyPropertyChanged) on which to build, without additional bells and whistles, you will really like the new Shell navigation.
Popular options
These are some of the most common and are used for most applications.
- MVVMCross is a popular and scalable cross-platform framework that allows you to share your code better and allows the developer to decide how he wants to use the framework.
- FreshMvvm is a super lightweight Mvvm Framework designed specifically for Xamarin.Forms. It is designed to be easy, simple, and flexible.
- ReactiveUI is an advanced, composable, and functional Model-View-ViewModel framework for all .NET platforms! I’m testing this with Prism and I love it.
Big apps
Another option (which I can recommend) would be the Prism library. While these can be used for any application, it stands out particularly in larger applications, where forced structure and isolation are most important.
It does much more than just provide a standard template for common development workflows (for example, it supports different DI/IoC libraries and implements its own navigation) and can be modular, so you can choose what you want to use. It is also quite popular among the Xamarin community.
Tips to get the most out of your projects with XAML
When using Xamarin forms, sometimes there is a code we do in the code-behind because maybe we don’t know what can be done using XAML.
Well, XamGirl wrote a post with 10 things you maybe didn’t know you could do in XAML. In the post «XAML Tips and Tricks» you will find:
- Pass constructor arguments
- Line break
- Create color in XAML
- The power of x: reference
- Emoticons
- Converters
- Data triggers
- Text string format
- General styles to your controls
- Attached properties
DON’T create your UI in your Code-Behind
Most Xamarin Forms development is XAML-based with the MVVM pattern. With MVVM, you will often see code-behind classes that are almost completely empty, with only one constructor present. The logic in these cases is passed to a “ViewModel” class that provides a binding between the View and the Model to link objects in the ViewModel and use it as the data context for its View.
In general, it’s a good idea to use c# when you need to create dynamic controls, but have the general layout (graphic scripts, styles, data templates, and so on) in the XAML file.
If you want to know more about the code-behind, I’ve written an article called “What code-behind means in Xamarin Forms“. You can take a look if you want more details.
Tips to get the most out of your C# projects
That’s right, just as you just read“projects with C#.” Overtime is seeing the developers focus on designing interfaces declaratively and Xamarin Forms developers know it. This is the recent addition of “CSharpForMarkup” into Xamarin Forms to define your UIs declaratively.
With the appearance of new Frameworks we have noticed how the developers have accepted and adapted the concept of creating User Interfaces (UIs) declaratively because the advantages it offers.
CSharp code has always been used to create views in Xamarin Forms, but the truth is that with all the features XAML has in favor it can be a little difficult for new developers to make the decision to use CSharp and especially now that we have XAML HotReaload.
Using C# instead of XAML has its advantage and disadvantages. For me, the biggest advantage in favor of XAML is that there is support for HotReload. Once we have support for C# HotReload, I think the number of users using C# will increase dramatically.Similarly, there are some third-party tools that support C# HotReload, and if you don’t mind paying some money for a license, you’re going to enjoy creating your UIs in C#.
Tips to improve the design of your apps
If we want our applications to attract attention we need to use the right tools for it. As I mentioned earlier, I’ve written a post talking about“Design Tools in Xamarin Forms”.
In this article you can see:
- NuGet packages
- Custom controls
- HotReload Tools
- VS Extensions
- Etc.
UI Inspiration
Where designers go when they want to find inspiration, catch up on the latest trends, or just relax and explore other people’s designs? It is no secret that almost 90% of them will go to Behance & Dribbble.
But there are many other places with great content worth exploring. Many of whom, unfortunately, do not receive as much attention from the designer community as they would deserve. I’ll list just a few of the best examples you can find online today.
Tips for finding the best apps examples in Xamarin Forms
GitHub
f you want the best examples of mobile apps, GitHub is your choice. On GitHub, you can find many examples of apps with Xamarin Forms, but I’m going to give you some accounts or repositories to make your search less painful.
Official documentation
The official documentation is your best friend. And guess what? You also have examples!! That’s right, here’s the page with some apps made by the Xamarin team and the repository with the examples used in the documentation.
Others
If you want the code of some templates you can take a look at this page, it has“Xamarin.Forms UI Snippets” totally free.
Extra tip
Something I’ve always liked is to take what I do everywhere, I have wallpapers for my phones, t-shirts, stickers, etc. I’ve even made friends for this. So, if you want some variety in your wallpapers, I’ll leave you some here.
Thank you so much for reading this post!
