A Look At New Xamarin Forms Features

new xamarin forms features

Hello, everyone. Xamarin Forms has been evolving quickly and a few weeks after Xamarin Forms 3.0 was announced, the version 3.1 (3.2 will soon be released as stable version) was already released. As developers we have to stay up to date with the changes made to the frameworks we use. I was looking at xamarin forms new features, implemented in Xamarin Forms 3.1 and Xamarin Forms 3.2… which is not yet at a stable version as I’m writing this. Basically, I went through the features added to version 3.1 and 3.2 which will be released as stable version this August if I’m not wrong. And I decided to test the features I found to be the most interesting Though (some may not yet be stable).

What made me go through these new features is not only curiosity or necessity as a developer. But it is because I made a blog post last week about implementing two additional features on the Entry. One of these features had already been implemented in Xamarin Forms 3.1. In this blog post, I’ll not talk about every feature, but I’ll talk only about a few, those which I found more interesting. Many of these features are very interesting, and prove Xamarin.Forms is becoming more and more robust.

By the way, I started a series of posts and titled it Xamarin Forms Tips . In this series I talk about small tips and tricks to build good mobile apps with Xamarin Forms. The case study will be an App I built with Xamarin Forms and ReactiveUI as MVVM framework. The app’s name is “My Expenditures”. It is available on Android devices and UWP. It is a simple application to manage your expenses and income (more description is available in the stores). You can download and install it on Playstore and Microsoft Store Or Open Directly on the store app available on your windows 10 device.

Let’s dive in. Here is the source code to the small demo I made.

A Look At New Xamarin Forms Features

As I said earlier, there are several features which were added to version 3.1. And more have been added and are still being implemented in version 3.2. So I’ll just mention those I find more interesting. You can find the list of more features here or on github.

Title view to customize your app’s navigation bar

You can find it on github.

This new xamarin forms feature was made available in version 3.2.0-pre1 “which is not a stable release”. It permits you to customize how your navigation bar looks like. You can now add custom views. Personalize it with an entry, a button, label… This is available on Navigation Pages. Here is a sample. Though on UWP it didnt show up, on Android and iOS everything should be fine.

<ContentPage
    x:Class="NewXFormsFeatures.Views.TextsModifications"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:viewModels="clr-namespace:NewXFormsFeatures.ViewModels"
    BindingContext="{viewModels:MainViewModel}">

    <NavigationPage.TitleView>
        <StackLayout Orientation="Horizontal">
            <Label FontSize="Large" Text="Big Title" />
            <Entry WidthRequest="200" />
        </StackLayout>
    </NavigationPage.TitleView>

    <ContentPage.Content>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
            </Grid.RowDefinitions>

... 
...

<ContentPage

x:Class="NewXFormsFeatures.Views.TextsModifications"

xmlns="http://xamarin.com/schemas/2014/forms"

xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"

xmlns:viewModels="clr-namespace:NewXFormsFeatures.ViewModels"

BindingContext="{viewModels:MainViewModel}">

<NavigationPage.TitleView>

</StackLayout>

</NavigationPage.TitleView>

<ContentPage.Content>

<Grid>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

...

Bottom Tabs with Tab Page “Android”

This is the hottest feature, at least the one I’m sure you have heard about most often. Now you can precise in Xamarin Forms code that you want the tabs to be at the bottom of your page. This is easy as you can see here:

<TabbedPage
    x:Class="NewXFormsFeatures.Views.MainPage"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
    xmlns:views="clr-namespace:NewXFormsFeatures.Views"

    android:TabbedPage.ToolbarPlacement="Bottom">

<TabbedPage

x:Class="NewXFormsFeatures.Views.MainPage"

xmlns="http://xamarin.com/schemas/2014/forms"

xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"

xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"

xmlns:views="clr-namespace:NewXFormsFeatures.Views"

android:TabbedPage.ToolbarPlacement="Bottom">

Selection Mode on List View

Check this here. Now you can precise whether or not you want items to your list view to be selected. Only two options are available now (none and single). You can easily add it as shown below.

SelectionMode="None"

1	SelectionMode="None"

Bindable Span

This feature was available several months ago and is present in version 3.1. It allows you to bind text from your view model to a span in a label with Formatted Text. Look at it in action.

<Label
     Grid.Row="1"
     Margin="20"
     HorizontalOptions="Center"
     VerticalOptions="Center">
     <Label.FormattedText>
         <FormattedString>
             <Span
                 FontAttributes="Bold"
                 FontSize="Large"
                 Text="{Binding SpanText}"
                 TextColor="Blue" />

<Label

Grid.Row="1"

Margin="20"

HorizontalOptions="Center"

VerticalOptions="Center">

<Label.FormattedText>

<Span

FontAttributes="Bold"

FontSize="Large"

Text="{Binding SpanText}"

TextColor="Blue" />

Adding Padding to a button

Now you can add padding to a button. See this. This is available in version 3.2. In case you wanted the text in your button to be far from the borders, now you can easily do it with button padding.

<Button Padding="30" Text="I'm a button" />

1	<Button Padding="30" Text="I'm a button" />

Amelioration to Entry

The entry had several enhancements in version 3.1. Here are a few of them

You can set the maximum length of the entry with a property named (MaxLength)
You can decide if text prediction should be enabled for that entry or not using this property (IsTextPredictionEnabled)
You can chose which key should be present at the place of return key on the device’s keyboard. Using the property (ReturnType). It could be “Search”, “Done”, “Next” …

Conclusion

Several features are available and are coming in future Xamarin Forms releases. Not only features, but also bug fixes and several other enhancements. Xamarin Forms which was described as a framework to build prototype applications, is becoming more and more robust as time does forward. And keeping track of every new xamarin forms feature is important as a developer.