Follow up post

Hi there!

Today a little follow up. Few things move forward. First with API – now you can get some sample reaction from http://www.reactioapi.hostingasp.pl/api/reactions. This is a huge step forward, still draft though. So API is now operational and will be developer in parallel with Reactio app.

Inside Reactio there is something new too. It has a first menu! Take a look:

menu

More is coming so stay tuned! Till the nex!

Advertisements

Activity indiactor

Today will be about showing loader during some long running tasks. Reactio will be contacting API so it would be nice to have some activity indicator. In Xamarin there is one which you can add directly in xaml. activity

And then in code:

 try
{
this.IsBusy = true;
var x = await m_reactionService.GetReactionsAsync();
if (x.Count() < 1)
{
await DisplayAlert(AppResources.NoReactionsTitle, AppResources.NoReactionsMessage, "OK");
}
}
catch (Exception ex)
{
await DisplayAlert(AppResources.ErrorTitle, ex.Message, "OK");
m_logger.Error(ex, "Error");
}
finally
{
this.IsBusy = false;
}

As you can see it has two properties IsVisible and IsRunning. Both of them are bound to IsBusy which is Page property. In Summary of it we can read that:

Marks the Page as busy. This will cause the platform specific global activity
indicator to show a busy state.

Mine ActivityIndicator is outside StackLayout and inside AbsoulteLayout which guarantee it will hide the page itself and user will not be able to click anything when loader is visible.

loader

Quite simple solution which works.

Till the next!

Checking internet connectivity

Reactio will work based on the API. That’s why active internet connection is essential. Today I will show how I’m checking connectivity. First I started with digging for information and techniques of connectivity checking in Xamarin. Most of them was some OS specific or just simple HTtpClient to google. Then I’ve found this plugin https://components.xamarin.com/view/connectivityplugin

That was it! It is easy to use and what is most important cross platform. With few lines of code you can check internet connection and show alert if there is no.

I’ve added following code to the overrided OnAppearing() method in MainPage.xaml.cs

if (!CrossConnectivity.Current.IsConnected)
{
    await DisplayAlert(AppResources.NoInternetErrorTitle, AppResources.NoInternetErrorMessage, "OK");
}
//Check if API is reachable
if (!await CrossConnectivity.Current.IsRemoteReachable(Constants.ReactioAPIIP))
{
    await DisplayAlert(AppResources.APINotReachableTitle, AppResources.APINotReachableMessage, "OK");
}

It is checking connectivit on application start. Next one is an event which will be triggered on connectivity change.

 CrossConnectivity.Current.ConnectivityTypeChanged += Current_ConnectivityTypeChanged;&amp;amp;amp;nbsp;
private async void Current_ConnectivityTypeChanged(object sender,
  Plugin.Connectivity.Abstractions.ConnectivityTypeChangedEventArgs e)
{
    if (!e.IsConnected)
    {
        await DisplayAlert(AppResources.NoInternetErrorTitle, AppResources.NoInternetErrorMessage, "OK");
    }
//display when API becomes unreachable
    if (!await CrossConnectivity.Current.IsRemoteReachable(Constants.ReactioAPIIP))
    {
        await DisplayAlert(AppResources.APINotReachableTitle, AppResources.APINotReachableMessage, "OK");
    }
}

As you can see there is also check if ReactioAPI is reachable. If there will be no connectivity user will see following message:

no_internet

If ReactioAPI won’t be reachable then following message will be displayed:

no_api

Not quite sure yet if I should close application in case of one of the alerts or just showing them is enough.

That’s all for today, till the next!

Localization

Today few words about localization. Why do I need that in my app? Well, Reactio will be universal so I don’t want to be only in Polish language. I want to have Polish version and default English version. I started to wandering how to detect mobile language in Xamarin.Forms.  After some research I decide to have a try with RESX resource files, following this guide https://developer.xamarin.com/guides/xamarin-forms/advanced/localization/

I’ve added Resources folder with AppResources.resx and AppResources.pl.resx file

resources

So far there is only one item, but this will grow with application. Default in English:

english_resx

And same in AppResources.pl.resx looks as following:

english_res

Next as this my AppResources.resx file is in different project I needed to change Custom Tool in Properties to PublicResXFileCodeGenerator:

custom_tool

After that I was able to use it in my MainPageViewModel:

solve

And in Xaml it was enough to add binding:

xaml

Ok, so it was ready and should work. Now I was wandering if I can test that somehow other way then just launching emulator and changing language. Turns out that AppResources class has a property called Culture which can be used in tests. I wrote two simple tests – one for English and second for Polish languages.

tests

Those are just a unit tests in Reactio.Tests project. Both passed which is great!

Next I added same in Reactio.TestsAndroid to see how it will be in emulator.

NUnit_runner

It also passed. So it’s time to check how it will work in Reactio. First let’s check default version:

solve_en

And same button after change language to Polish:

solve_pl

As you can see it works and managing localization through RESX resource files is a really neat way to make your app available in many languages.

Till the next!

 

Splash screen.

When logging has been implemented, I’ve added splash screen to Reactio. Splash screens are really neat way to launch application, cause user can see that something is going on and app is staring. Moreover you can show logo so it is also a way to promote application.

There is a cool guide of adding splash screen to android project, so I won’t do copy paste of that. Just follow this link.

splash.png