Versioning of Android app (Dev, Stage, and Prod) using same code base – Xamarin Forms

We will be continuing our journey into App versioning, this time for Android. Similar to iOS, in Android, we have to create Compiler symbols too. For those who have missed iOS versioning blog, click on below is the link.
Versioning of iOS app (Dev, Stage, and Prod) using same code base – Xamarin Forms

Set different configurations

Similar to iOS, setup all the required configurations as shown below,

Dev

Screen Shot 2018-04-28 at 12.42.35 am.png

Staging

Screen Shot 2018-04-28 at 12.43.26 am.png

Prod

Screen Shot 2018-04-28 at 12.54.45 am.png

Compiler symbols options

Double-clicking on Android project should prompt with Project Options, go to compiler tab under Build section. Here similar to iOS add symbols Dev, Stage, and Prod.

Dev

Screen Shot 2018-04-28 at 12.55.44 am.png

Staging

Screen Shot 2018-04-28 at 12.55.54 am.png

Prod

Screen Shot 2018-04-28 at 12.56.01 am.png

Android Manifest file

In case of Android, we need to create new Manifest files to support creating different apps. Two things to change in this file are package and android: label, as shown below for Dev.

Screen Shot 2018-04-27 at 3.53.10 pm.png

Staging

Screen Shot 2018-04-27 at 3.54.08 pm.png

Prod

Screen Shot 2018-04-28 at 12.39.06 am

Edit Android Proj file

Now we have to assign in proj file to set each environment with the correct android manifest file, as shown below.
Open proj file using the path
Screen Shot 2018-04-28 at 12.58.34 am.png
Now change each configuration setting as shown below with the correct Android settings with appropriate Android Manifest file.
Screen Shot 2018-04-28 at 1.00.22 am.png

Finally

Remove Label from the main activity, so the app picks up the name from required Android Manifest file.
Screen Shot 2018-04-28 at 10.08.58 am.png

Output

When we run with above configurations, it will create different apps for the same code base
Screen Shot 2018-04-28 at 12.37.45 am

Dev

Screen Shot 2018-04-28 at 1.03.41 am.png
 

Staging

Screen Shot 2018-04-28 at 1.03.56 am.png

Prod

Screen Shot 2018-04-28 at 1.04.13 am.png
Github link
https://github.com/divikiran/AppVersioning

Versioning of iOS app (Dev, Stage, and Prod) using same code base – Xamarin Forms

App versioning based on same code base is the favorite feature of most of the clients I worked for various reasons. Usually, this feature is requested to cater App to the different set of departments or support multi-tenancy that client want to support. When creating a complex app, there are n-number of teams working together to build it, which includes dev testers,  beta testers, or even a client who wants to demo a product before actually purchasing it. Having single app does not support the purpose, as a client may want to cherry-pick different features to be available in the different version of the app.
In this blog, I will be sharing about how to create the different version of the app in iOS, I will do a different blog of Android. For this purpose, initially, we need to setup configurations for each required App version we want to support.

Set different configurations

In Mac, double-clicking on the solution level will prompt us with Solution Options dialog, and go to Configurations in the Build section. Go to Configurations tab as shown in the screen below.
Screen Shot 2018-04-27 at 1.34.45 pm
As you can notice for a new project, there are two configuration settings available as Debug and Release for various platforms. if you go to General tab, you can find all the available configurations broken down. Also, you can find options to add new, copy, remove and rename configurations. As per our requirements, we will Dev, Staging and Production configurations. Usually, we need the only version for iPhone, therefore create Configurations for iPhone only.

Dev Configuration setup

Screen Shot 2018-04-27 at 1.47.10 pm

Staging configuration setup

Screen Shot 2018-04-27 at 1.46.27 pm

Prod configuration setup

Screen Shot 2018-04-27 at 1.46.49 pm
Final configuration setup should be as below. Now close solution and open it again, so the Visual Studio can do all the binding properly.
Screen Shot 2018-04-27 at 1.47.19 pm

Complier symbols options:

Symbols are used along with the directives to compile code as per the given conditions, just like if-else condition. If you can double click on the iOS project, a dialog box called project options will be opened. If you go to Compiler tab under Build section, you can notice different compiler symbol options are available. We need to set new complier names for our newly created configurations. This can be done by selecting the required configuration and adding relevant Symbol to it, as shown in below screenshot.

For Dev, I have Dev as compiler symbol.

Screen Shot 2018-04-27 at 2.01.25 pm

For Staging, I Stage Dev as compiler symbol.

Screen Shot 2018-04-27 at 2.02.57 pm

For Production, I have Prod as compiler symbol.

Screen Shot 2018-04-27 at 2.03.53 pm.png

Purpose

Now, that we have setup configurations, we can write code as shown below and whenever different configuration builds are made, it will automatically pick right setting for the right environment.
Screen Shot 2018-04-27 at 3.08.08 pm.png

Info.plist

Info.plist is the file that dictates what configurations are to be applied to the concerned app. Original info.plist can be found setup as below
Screen Shot 2018-04-27 at 2.06.30 pm.png
We will be creating three different info.plist for our three versions of the app as shown below.
Screen Shot 2018-04-27 at 2.09.24 pm.png
To keep thing simple, just change the CFBundleIdentifier to relevant names, in this case, I will be appending with Dev, Stage, and Prod to current Identifier. Also, dont forget to remove display name from it

Dev

Screen Shot 2018-04-27 at 2.58.32 pm.png

Screen Shot 2018-04-27 at 2.48.57 pm

Stage

Screen Shot 2018-04-27 at 2.59.03 pm.png

Screen Shot 2018-04-27 at 2.50.12 pm.png

Prod:

Screen Shot 2018-04-27 at 2.59.21 pm.png
Screen Shot 2018-04-27 at 2.50.55 pm.png

Edit iOS Proj file

Now go and edit iOS proj file, to edit do as shown in the below screenshot
Screen Shot 2018-04-27 at 2.37.24 pm.png
After opening the proj file, look for info.plist file
Screen Shot 2018-04-27 at 2.39.07 pm.png
Now add the conditions to them according to each platform and move the newly created info.plist’s above the original info.plist or else it will take first available plist as shown below
Screen Shot 2018-04-27 at 2.42.52 pm.png

Output

When we run with above configurations, it will create different apps for same code base
IMG_0038IMG_0039IMG_0040IMG_0041
 
Github link
https://github.com/divikiran/AppVersioning

Xamarin Forms – Platform Specifics (iOS) : Blur Effect

As a Xamarin mobile developer ever wonder, why we need write some much of code in PCL and iOS projects to do simple Native feature, some of which are usually one-liners code natively.
Xamarin has now introduced a nice nifty feature that helps us to write code in Xamarin Forms in the form of Platform Specifics.
In short, Platform Specifics helps us to consume the features or functionalities that are only available on iOS, without needing to implement custom renderers or effects in the required platform project.
One of the best example to understand this features is Blur effect. Platform specifics are baked into the Xamarin and it is ready to use.
Below are the steps to test this feature
Create a Xamarin Forms projectScreen Shot 2018-04-12 at 22.28.54
Namespaces: It is important to understand Xaml namespaces to get to know about Xamarin specifics. Below is the required namespace on each page.
xmlns:ios=clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core 
Blur Effect
Below the way we can define Blur effect on a boxview, this effect can be implemented on any visual elements in Xamarin Forms.
<BoxView x:Name=boxView ios:VisualElement.BlurEffect=Dark HeightRequest=50 WidthRequest=50 />
Blur effect have enumeration options to be set to it.

  1. Dark – applies a Dark blur effect
  2. Light – applies the light blur effect
  3. ExtraLight – applies an extra light blur effect
  4. None – applies no blur effect

Below is sample code for various blur effects we can  notice
<StackLayout>
    <Image Source=Aus.png HeightRequest=50 WidthRequest=50 />
    <BoxView x:Name=boxView ios:VisualElement.BlurEffect=Dark HeightRequest=50 WidthRequest=50 />
</StackLayout>
<StackLayout>
    <Image Source=Aus.png HeightRequest=50 WidthRequest=50 />
    <BoxView x:Name=boxView1 ios:VisualElement.BlurEffect=Light HeightRequest=50 WidthRequest=50 />
</StackLayout>
<StackLayout>
    <Image Source=Aus.png HeightRequest=50 WidthRequest=50 />
    <BoxView x:Name=boxView2 ios:VisualElement.BlurEffect=ExtraLight HeightRequest=50 WidthRequest=50 />
</StackLayout>

Below is the sample output on iOS
Screen Shot 2018-04-12 at 22.50.55
Here is the sample available in Github
https://github.com/divikiran/PlatformSpecficBlurEffect.git
 
 
 
 

Xamarin Forms – App Center: Show BuildID on iOS App

Introduction

App center helps us to connect support git repositories (i.e GitHub, Bitbucket or VSTS)  and build the app for us either on every code commit or manually. It also sends notifications to users that are registered to it. It will also help us to run tests on the actual device and runs any unit tests in the project.

iOS and Android

App Center can be set up to build individual platforms projects.

Scenario:

Required to show BuildID on iOS APP during the development phase, as shown below. This was required to keep track of bug reports or any other reason.
Screen Shot 2018-01-03 at 19.57.00

Show App Center Build ID in iOS app

Info.plist

Below is the BuildID that is read when traditional approach as below
Screen Shot 2018-01-03 at 20.18.13

Traditional Approach:

This can be achieved by implementation natively on each platform and used via interfaces in PCL or .Net standard projects, as shown below.
Screen Shot 2018-01-03 at 20.21.56

Native Implementation:

Screen Shot 2018-01-03 at 20.25.39
The above code will return the App Version and App build number that are set in the info.plist.

Get BuildID from App Center

This can be achieved using post clone and pre-build – Build scripts, which can be set in the App center’s build configurations as shown below
Screen Shot 2018-01-03 at 20.34.21
Screen Shot 2018-01-03 at 20.36.42

Post Clone

Below is the post clone code to load App Center’s CLI, which is required to be named as appcenter-post-clone.sh.
#!/usr/bin/env bash
npm install -g appcenter-cli

Pre-Build

Below is the pre-build code that set’s the info.plist’s Build number with App Centers BuildID
plutil -replace CFBundleVersion -string $APPCENTER_BUILD_ID $APPCENTER_SOURCE_DIRECTORY/path to ios project/Info.plist
APPCENTER_BUILD_ID is the App Center variable that contain’s BuildID, below is the BuildID that is set to  CFBundleVersion
The most recent Build number as shown below is replaced and set to CFBundleVersion.
Screen Shot 2018-01-03 at 21.20.35
After downloading from App center, iOS should show the latest build number as shown in below screenshot.
build id
I hope you like the post.
 

Xamarin Forms: Mircosoft.EntityFrameworkCore.Sqlite issue with Physical devices

Introduction

Building Xamarin Forms apps using .Net Standard 2.0 is still pretty much new to industry, we are just started to learn how differently we have to configure Xamarin setting to get it working when compared to PCL based projects.
I was building a Xamarin Forms based App using Microsoft’s Entityframeworks SQlite to store app’s data. Entity framework using sqlite is an obvious choice when it comes to building App using .Net Standard 2.0

Simulator

Works well on pretty much on all simulators without any issue, all read/write operations works well.

Issue  – Physical Device

App crashes on physical device, when tried to read or write data from the SQlite database

Error

System.TypeInitializationException: The type initializer for ‘Microsoft.EntityFrameworkCore.EntityFrameworkQueryableExtensions’ threw an exception. —> System.InvalidOperationException: Sequence contains
no matching element

Resolution

Change linker behavior to “Don’t Link”

Xamarin forms using .Net Standard 2.0

Introduction

All Xamarin developers, please welcome Net standard 2.0. This is the kind of class library we were waiting for all these years. The .Net standard 2.0 specification is now complete and it is included with Net core 2.0, Net framework 4.6.1 and up to latest versions. It can be used using Visual Studio versions 15.3 and up. Net Standard 2.0 obviously supports C# and also F# and Visual Basic.

More APIs

Net Standard 2.0 is for sharing code via various platforms. It is included with all the common APIs that all .Net implementations, it unified all .net frameworks to avoid any fragmentations in future. There are more than 32000 APIs in .Net Standard 2.0 most of them that are already available in .Net Framework APIs. Microsoft has made it easy to port existing code to .Net Standard 2.0. It is now easy to extend any .Net Standard to .Net core 2.0 or any versions that come in future.

NuGet Support

Most NuGet packages currently work well with .Net framework, but not all projects are compatible to move to .Net Standard 2.0, therefore a compatibility mode is added to support them.  Even after compatibility mode, only upt0 70% of packages are supported.

Frameworks and Libraries

Below is the table,list all the support frameworks and libraries. Click here for more details

.NET Standard
1.0 1.1 1.2 1.3 1.4 1.5 1.6 2.0
.NET Core 1.0 1.0 1.0 1.0 1.0 1.0 1.0 2.0
.NET Framework 4.5 4.5 4.5.1 4.6 4.6.1 4.6.1 4.6.2 4.6.1 vNext 4.6.1
Mono 4.6 4.6 4.6 4.6 4.6 4.6 4.6 5.4
Xamarin.iOS 10.0 10.0 10.0 10.0 10.0 10.0 10.0 10.14
Xamarin.Mac 3.0 3.0 3.0 3.0 3.0 3.0 3.0 3.8
Xamarin.Android 7.0 7.0 7.0 7.0 7.0 7.0 7.0 8.0
Universal Windows Platform 10.0 10.0 10.0 10.0 10.0 10.0.16299 10.0.16299 10.0.16299
Windows 8.0 8.0 8.1
Windows Phone 8.1 8.1 8.1
Windows Phone Silverlight 8.0

Sample to convert PCL or Shared to .Net Standard 2.0

  1. Create a default PCL or Shared based Xamarin Forms applications and name it appropreately and wait for solution to loadScreen Shot 2017-12-09 at 09.18.05
  2. Add .Net Standard class library by selecting .Net Standard 2.0Screen Shot 2017-12-09 at 09.24.38Screen Shot 2017-12-09 at 09.25.41Now project should look something like belowScreen Shot 2017-12-09 at 09.26.38.png
  3. Now remove PCL or Shared based project (VERY Important only after moving all the required project files to Netstandard20Test library) and compileScreen Shot 2017-12-09 at 09.28.38.png
  4. now rename the NetStandard20Test to NetStandardTest (Same as deleted library), make sure to rename DefaultNameSpace and Assembly to NetStandarTestScreen Shot 2017-12-09 at 09.30.07Screen Shot 2017-12-09 at 09.30.14Screen Shot 2017-12-09 at 09.30.24Screen Shot 2017-12-09 at 09.30.44Screen Shot 2017-12-09 at 09.34.23.png
  5. Now build the project and see if build is successfully.
  6. Your build should fail with errors as shown below, it is because of the deleted project, now we have to reference back the newly created .Net Standard 2.0 to both Android and iOSScreen Shot 2017-12-09 at 09.35.53.png
  7. Now edit references on each platform project to add newly created project as shown below onceScreen Shot 2017-12-09 at 09.37.58Screen Shot 2017-12-09 at 09.38.05
  8. references are applied correctly, you should get below errorsScreen Shot 2017-12-09 at 09.52.14
  9. Now add Xamarin.Forms NuGet package for all projectsScreen Shot 2017-12-09 at 09.54.04.png
  10. Now build the project and you should see any errorsScreen Shot 2017-12-09 at 10.58.06
  11. Microsoft has also released a compatibility NuGet package that makes sure’s all the existing packages are compatible to .Net Standard 2.0
  12. Add NuGet package, Mirosoft.NETCore.Portable.Compatibility to .Net Standard 2.0 project.Screen Shot 2017-12-09 at 11.03.01

Hope this blog is useful to you.
 

Azure Logic App – Evaluating IF condition with the help of JSON expression by passing null

Introduction

Yes, you read the title right, this blog is about evaluating IF condition. You might be wondering what about IF, even novice developer with no experience knows about it.
Allow me to explain a specific scenario that helps us understand it’s behavior in Logic Apps, it might blow your mind.
Some of us come from years of development experience, and at times we like to skill up ourselves to various other technologies, which leaves us with a mindset based on our past development experience and programming habits, which we gained over the years. When clients requirements are approached based on these backgrounds, we expect the code to work with the certain flow and these are where rules are broken while using IF condition in Azure Logic Apps.

Understanding JSON expression

JSON expression evaluates string to JSON object using syntax as shown below
json({"Person":{"Name": "Simpson"}})  evaluates to var name = Person.Name as Simpson
But, the same json(null), throws an error (important), avoid where possible.

Understanding IF condition

IF don’t need any special introduction, we know how it works. As we know, it has two code blocks that are evaluated based on the condition and falls to one of the blocks. As applies to Logic Apps and below is the syntax for it.
@if("condition","true","false")
To understand IF better, let’s also look into @equals(), it is a simple expression that returns true or false based on the given input and provided comparing value.

Example 1

Below is just an example, please ignore simple equality condition.
@if(equals(1,1),"true1","false1")
Result: true1

Example 2

@if(equals(1,2),"true1","false1")
Result: false1

Now, let us take our person JSON and understand it.
@if(equals(1,1),"Merge",json({"Person":{"Name": "Homer"}}) ['Name'])
Result: Merge

and similarly when the comparison is not equal
@if(equals(1,2),"Merge",json({"Person":{"Name": "Homer"}}) ['Name'])
Result: Homer

Now, recall that IF falls to one of the code blocks and returns. But in case of Azure Logic Apps, it evaluates both the code blocks and returns one code block result, that it falls into.
Here is the proof
For Example, if I do something like below, it should result as “Merge”, but it actually throws an error. According to current Logic Apps, this is the current behavior.
@if(equals(1,1),"Merge",json(null) ['Name'])
Result: error

And similarly when not equal
@if(equals(1,2),"Merge",json(null) ['Name'])
Result: error

The above examples imply that Logic App evaluates both the code blocks and returns one.
Actual error thrown is as below from real logic app
InvalidTemplate. Unable to process template language expressions in action ‘Compose’ inputs at line ‘1’ and column ‘1525’: ‘The template language function ‘json’ expects its parameter to be a string or an XML. The provided value is of type ‘Null’. Please see https://aka.ms/logicexpressions#json for usage details.’.

React – code on-demand using Code Splitting

React is a declarative, efficient, and flexible JavaScript library for building user interfaces. Code Splitting helps apps to perform well where performance is key.
Code Splitting is the concept in React that helps to load the content only when it is actually required. Instead of loading the whole app even before a user can use it, we can write code effectively that it loads only when required.
A function can import the whole module using an import statement function and returns a promise as shown below.
import('./CodeSplitting/student')
### student.js
const Name = 'Divikiran Ravela';
export { Name };

Since import returns promise data will load when it is ready as shown below.
import('./CodeSplitting/student')
.then(({ Name }) => {
// Use moduleA
console.log("I am "+Name);
})

For example, if you wanted to load data when user clicks on button we can achieve as below
handleClick = (props) => {
import('./CodeSplitting/student')
.then(({ Name }) => {
// Use Student
console.log("I am " + Name);
})
.catch(err => {
// Handle failure
});
};

Here is full code if you are interested
Screen Shot 2017-09-28 at 11.18.31.png
Screen Shot 2017-09-28 at 11.16.08.png
Output:
Screen Shot 2017-09-28 at 11.18.56.png

Follow ...+

Kloud Blog - Follow