May 25, 2017

Force Landscape or Portrait for a single page in Xamarin Form.

Device screen orientation in xamarin is usually configured from Host(Android/iOS) project as suggested here . But what if i need to change the screen orientation of one particular screen(say to landscape) in xamarin form and other screens are different (may be portrait), to do so there is no direct options available from xamarin form.
We will do the configuration in host project whatever the configured setting applicable throughout the form project to do any changes for particular screen need to touch back the host project settings because as of now there is no wrapper Form level API’s available. 

For example consider the scenario that my Form project contains the Five screens out of that, for Third screen i need give support for both Portrait and Landscape and for all other remaining screen only in portrait. This can be done in android as follows,

Use the MessageCenter class to send the message from the Form screen for which orientation need to be changed and receive the same from Android MainActivity class.

ThirdPage.xamal.cs
  public partial class ThirdPage : ContentPage
    {
        protected override void OnAppearing()
        { 
            base.OnAppearing(); 
           MessagingCenter.Send(this, "allowLandScapePortrait”);
        }
         //during page close setting back to portrait
        protected override void OnDisappearing()
        {
            base.OnDisappearing(); 
            MessagingCenter.Send(this, "preventLandScape");
        }
    }

May 22, 2017

Platform specific UI changes in Xamarin.Form


Brief: Walkthrough on the options available in xamarin form for changing UI element behaviour for specific platform.

Description: Xamarin form wrapper UI controls when it renders in each platform shows the native look and feel but still there are some quirks that has to be worked around to get the UI perfection.

For example if i add one label in my xamal page and on run in android and iOS shows the below output:
<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:CodeLog" x:Class="CodeLog.CodeLogPage">
<RelativeLayout HorizontalOptions="FillAndExpand"  >
    <Label Text="Code Log" 
          FontSize="25" 
          FontFamily="Roboto-Bold" 
          HorizontalTextAlignment="Center" 
   HorizontalOptions="FillAndExpand" />  
</RelativeLayout>
</ContentPage>
In iOS label has been overlapped with toolbar. So alone for iOS we need add To padding(Tool bar height 20px).

This kind of changes for particular platform can be achieved by using the below mentioned approaches without using the Custom renderer.

1.Using a generic class OnPlatform
2.PlatformConfiguration(https://blog.xamarin.com/bringing-platform-specific-functionality-to-xamarin-forms-apps/)
3.Bindable Native Views in Xamal page (https://blog.xamarin.com/adding-bindable-native-views-directly-to-xaml/)
4.customisation with effects(https://blog.xamarin.com/customizing-xamarin-forms-controls-with-effects/)
In this article i will be making use of the OnPlatform for different UI control properties. From Xamarin.Forms version 2.3.4, Device.OnPlatform API has been deprecated with OnPlatform and On APIs.
 <?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:CodeLog" x:Class="CodeLog.CodeLogPage">
<RelativeLayout HorizontalOptions="FillAndExpand"  >
  <RelativeLayout.Margin>
    <OnPlatform x:TypeArguments="Thickness">
      <On Platform="iOS" Value="0,20,0,0" />
      <On Platform="Android, WinPhone, Windows" Value="0,0,0,0" />
    </OnPlatform>
  </RelativeLayout.Margin>
    <Label Text="Code Log" FontSize="25" FontFamily="Roboto-Bold" HorizontalTextAlignment="Center" 
  HorizontalOptions="FillAndExpand" />  
</RelativeLayout>
</ContentPage> 
Platform specific Text color:
 <Label Text="Code Log" FontSize="18" FontAttributes="Bold"  FontFamily="Roboto-Bold" XAlign="Center"  HorizontalTextAlignment="Center" 
 HorizontalOptions="FillAndExpand"
 RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"> 
  <Label.TextColor>
    <OnPlatform x:TypeArguments="Color" iOS="Red" Android="Blue"  />
     </Label.TextColor> 
   </Label>  

February 15, 2017

ResolveLibraryProjectImport task failed unexpectedly in release mode in xamarin

This above mentioned error i got during my xamarin form project deployment in release mode. 
In my solution i have more then one project and this error indicates that linking between these project has been broken. If you are facing the same issue, then here i have listed out few scenarios that could help you to solve this issue:


1. Select the project in which error is pointing and Check the reference of other project and package. Reference with yellow triangle icon shows the broken reference. just delete it and re-add.
For any other project reference included in the current project, delete the current project reference and add the new one from release folder of that respective project.
 Or
Open "Configuration manager"



December 23, 2016

Error retrieving parent for item: No resource found that matches the given name...

This is the one of the frequent error we will get during Xamarin android/Form development. Here i have posted the resolution steps for this error in both windows and Mac machines:

November 21, 2016

Xamarin Form Frame outline color display issue in android

This is the quick glance on the issue i have faced during the use of Frame control in Xamarin form project and sharing here hoping that may helpful to somebody with the same issue.

Using Xamarin form Frame controls shows some strange behaviour in android platform where as it shows elegant look in iOS.
We can notice this difference in below screenshot.[Nexus S (KitKat) and Simulator iPhone6 iOS9.3]



     

September 5, 2016

Circular progress bar example using xamarin android

In brief: Here you can check the implementation of custom android widget called circular progress bar in steps using xamarin android.

July 20, 2016

50000 Visits and Counting...

Thanks for your visits and overwhelming response...


It is always a special occasion to cross a new landmark. Today our blog has been received 50,000+ visits all over the globe from 125+ countries. Your visits, interaction to post by comments, suggestion by email and hangout messages made this blog alive and keep running.

June 19, 2016

ExpandableListView in xamarin android

Expandable List View is basically used to display the list of data with respective categories. Which has the feature to expand and collapse the items in a category when user touches category title.


May 12, 2016

Material design tab in xamarin android

Introduction: Here I'm adding one more UI component to Android Material Design introduction series i.e. Tab control using android material design library in xamarin android. 

March 31, 2016

Xamarin android material design Snackbar customization

Another beautiful component introduced with android material design is Snackbar. Which has the features similar like a Toast message in additional with interaction capability, displays at the bottom of the screen.


January 31, 2016

Navigation Drawer using material design in Xamarin.Android.

In Brief:  Here you can see the Navigation drawer implementation in Xamarin android with simple steps and reduced code using beautiful material design.




December 23, 2015

Push notification using Google Cloud Messaging(GCM) in Xamarin.Android

In Brief:
 This Post is regarding the implementation of Remote notification or Push notification using Google cloud messaging.