Serving Industries Worldwide

Innovative Ways - Satisfied Clientele

How to create Xamarin.Forms Behaviors?


Listening is fun too.

Straighten your back and cherish with coffee - PLAY !

 
 

ai-Hiring-banner

Behaviors allow us to add functionalities to the UI (User Interface) controls without sub-classing them. Behaviors are written in code behind file and added to the controls. The controls are in XAML or code.

In this blog, we will discuss Xamarin.Forms Behaviors. Xamarin.Forms behaviors are created by deriving Behavior or Behavior class, where T is a type of control on which behavior will apply.

Follow this process to create Xamarin.Forms behaviors: First of all, create a class and inherit Behavior or Behavior class. After inheriting the Behavior class override the OnAttachedTo and OnDetachingFrom methods. OnAttachedTo method is used to perform any required setup and the OnDetachingFrom method is used to perform any required cleanup. Now, we can implement the functionalities of behaviors.

This code shows a structure of behavior for Entry control’s

public class EntryControlBehavior : Behavior
{
    protected override void OnAttachedTo (Entry entry)
    {
        base.OnAttachedTo (entry);
        // Perform setup
    }
    protected override void OnDetachingFrom (Entry entry)
    {
        base.OnDetachingFrom (entry);
        // Perform clean up
    }
    // Behavior implementation
}

Let’s create a simple application using behaviors for Xamarin.Forms.

Create New project >> Select Cross-Platform >> Select Mobile App (Xamarin.Forms).

Give an appropriate name to the project and then click OK.

ai-Hiring-banner

Fig: Create project
 

Now choose Template and Platform, and then click on the OK button.

ai-Hiring-banner

Fig: Choose template and platform
 

In this step, we will see how to create behavior. Create a new folder for behavior so we can identify behaviors easily. Right-click on that folder >> Click Add >> Click on Class.

   

ai-Hiring-banner

Fig: Select class
 

Select Visual C# Items >> Class >> Give Name to the class >> Click on Add

ai-Hiring-banner

Fig: Create class
 

After creating a class inherit that class with Behavior to create behaviors and override OnAttachedTo and OnDetachingFrom methods.

Here, we will create various entrssy controls and picker control and applies behaviors to these controls. We will apply behavior for Email, Date of Birth, Mobile Number, and Password.

Emailvalidationbehavior.cs
using System;
using System.Collections.Generic;
using System.Text;
using System.Text.RegularExpressions;
using Xamarin.Forms;

namespace XamarinFormsBehaviors.Behaviors
{
    public class Emailvalidationbehavior:Behavior
    {
        const string emailre= @"^(?("")("".+?(?

In this class, we will create a behavior for the Email validation. It matches the format of email with given regular expression, if a user enters an invalid format of email, then it will show entered text in Red color.

DatevalidationBehavior.cs

This class will create a behavior for Date of Birth validation. We will use Date Picker control and restrict the maximum date to be 100 years from the current date and the minimum date to be one. If the user enters 100 years ago date or upcoming dates from today it will set the background color of Picker to Red.

using System;
using Xamarin.Forms;

namespace XamarinFormsBehaviors.Behaviors
{
    class DatevalidationBehavior:Behavior
    {
        protected override void OnAttachedTo(DatePicker datePicker)
        {
            datePicker.DateSelected+=DatePickerdateSelected;
            base.OnAttachedTo(datePicker);
        }

        private void DatePickerdateSelected(object sender, DateChangedEventArgs e)
        {
            DateTime dateTime = e.NewDate;
            int year = DateTime.Now.Year;
            int selectedyear = dateTime.Year;
            int res = year - selectedyear;
            bool IsValid = false;
            if(res<=100 && res > 0)
            {
                IsValid = true;
            }
            ((DatePicker)sender).BackgroundColor = IsValid ? Color.Default : Color.Red;
        }

        protected override void OnDetachingFrom(DatePicker datePicker)
        {
            datePicker.DateSelected -= DatePickerdateSelected;
            base.OnDetachingFrom(datePicker);
        }
    }
}
MobilenovalidationBehavior.cs

This class will create a behavior for mobile numbers. The user must have to add integers otherwise it will show text in Red color.

 

Planning to Hire Xamarin App Development Company ?

Your Search ends here.

 
using Xamarin.Forms;

namespace XamarinFormsBehaviors.Behaviors
{
    public class MobilenovalidationBehavior:Behavior
    {
        protected override void OnAttachedTo(Entry mnoentry)
        {
            mnoentry.TextChanged += MobilenoChanged;
            base.OnAttachedTo(mnoentry);
        }

        private void MobilenoChanged(object sender, TextChangedEventArgs e)
        {
            int num;
            bool Isvalid = int.TryParse(e.NewTextValue, out num);
            ((Entry)sender).TextColor = Isvalid ? Color.Default : Color.Red;
        }

        protected override void OnDetachingFrom(Entry mnoentry)
        {
            mnoentry.TextChanged -= MobilenoChanged;
            base.OnDetachingFrom(mnoentry);
        }
    }
}
PasswordvalidationBehavior.cs

This class creates behavior for password validation, the length of the password must be between 8 to 15 and it must contain numeric and alphabetic values otherwise the color of entered text will be changed to Red.

using System;
using System.Text.RegularExpressions;
using Xamarin.Forms;

namespace XamarinFormsBehaviors.Behaviors
{
    public class PasswordvalidationBehavior:Behavior
    {
        const string passwordreg = @"^(?=.*[a-z])(?=.*[A-Z])(?=.*\d).{8,15}$";

        protected override void OnAttachedTo(Entry pwentry)
        {
            pwentry.TextChanged += Textchanged;
            base.OnAttachedTo(pwentry);
        }

        private void Textchanged(object sender, TextChangedEventArgs e)
        {
            bool isvalid = false;
            isvalid= (Regex.IsMatch(e.NewTextValue, passwordreg, RegexOptions.IgnoreCase, TimeSpan.FromMilliseconds(250)));
            ((Entry)sender).TextColor = isvalid ? Color.Default : Color.Red;
        }

        protected override void OnDetachingFrom(Entry pwentry)
        {
           
 pwentry.TextChanged -= Textchanged;
            base.OnDetachingFrom(pwentry);
        }
    }
}

Now, add behaviors to the XAML file, add a namespace to the XAML file and add behaviors to control as added in the below code.



    
        

            #2FA999
            #D8D8D8
        
    
    
        

ai-Hiring-banner

ai-Hiring-banner

Fig: Main Page

Conclusion

Behaviors are used to add more functionalities to our UI. Behaviors are written in code behind file and added to XAML file. In this blog we have seen how to implement behaviors in Xamarin.Forms and create applications with Xamarin.Forms behaviors. We have created behaviors for entry and picker control for that we have built class and inherit behavior to that class and then add these behaviors to our XAML file.

How to create Xamarin.Forms Behaviors?

ai-Hiring-banner

Behaviors allow us to add functionalities to the UI (User Interface) controls without sub-classing them. Behaviors are written in code behind file and added to the controls. The controls are in XAML or code.

In this blog, we will discuss Xamarin.Forms Behaviors. Xamarin.Forms behaviors are created by deriving Behavior or Behavior class, where T is a type of control on which behavior will apply.

Follow this process to create Xamarin.Forms behaviors: First of all, create a class and inherit Behavior or Behavior class. After inheriting the Behavior class override the OnAttachedTo and OnDetachingFrom methods. OnAttachedTo method is used to perform any required setup and the OnDetachingFrom method is used to perform any required cleanup. Now, we can implement the functionalities of behaviors.

This code shows a structure of behavior for Entry control’s

public class EntryControlBehavior : Behavior
{
    protected override void OnAttachedTo (Entry entry)
    {
        base.OnAttachedTo (entry);
        // Perform setup
    }
    protected override void OnDetachingFrom (Entry entry)
    {
        base.OnDetachingFrom (entry);
        // Perform clean up
    }
    // Behavior implementation
}

Let’s create a simple application using behaviors for Xamarin.Forms.

Create New project >> Select Cross-Platform >> Select Mobile App (Xamarin.Forms).

Give an appropriate name to the project and then click OK.

ai-Hiring-banner

Fig: Create project
 

Now choose Template and Platform, and then click on the OK button.

ai-Hiring-banner

Fig: Choose template and platform
 

In this step, we will see how to create behavior. Create a new folder for behavior so we can identify behaviors easily. Right-click on that folder >> Click Add >> Click on Class.

   

ai-Hiring-banner

Fig: Select class
 

Select Visual C# Items >> Class >> Give Name to the class >> Click on Add

ai-Hiring-banner

Fig: Create class
 

After creating a class inherit that class with Behavior to create behaviors and override OnAttachedTo and OnDetachingFrom methods.

Here, we will create various entrssy controls and picker control and applies behaviors to these controls. We will apply behavior for Email, Date of Birth, Mobile Number, and Password.

Emailvalidationbehavior.cs
using System;
using System.Collections.Generic;
using System.Text;
using System.Text.RegularExpressions;
using Xamarin.Forms;

namespace XamarinFormsBehaviors.Behaviors
{
    public class Emailvalidationbehavior:Behavior
    {
        const string emailre= @"^(?("")("".+?(?

In this class, we will create a behavior for the Email validation. It matches the format of email with given regular expression, if a user enters an invalid format of email, then it will show entered text in Red color.

DatevalidationBehavior.cs

This class will create a behavior for Date of Birth validation. We will use Date Picker control and restrict the maximum date to be 100 years from the current date and the minimum date to be one. If the user enters 100 years ago date or upcoming dates from today it will set the background color of Picker to Red.

using System;
using Xamarin.Forms;

namespace XamarinFormsBehaviors.Behaviors
{
    class DatevalidationBehavior:Behavior
    {
        protected override void OnAttachedTo(DatePicker datePicker)
        {
            datePicker.DateSelected+=DatePickerdateSelected;
            base.OnAttachedTo(datePicker);
        }

        private void DatePickerdateSelected(object sender, DateChangedEventArgs e)
        {
            DateTime dateTime = e.NewDate;
            int year = DateTime.Now.Year;
            int selectedyear = dateTime.Year;
            int res = year - selectedyear;
            bool IsValid = false;
            if(res<=100 && res > 0)
            {
                IsValid = true;
            }
            ((DatePicker)sender).BackgroundColor = IsValid ? Color.Default : Color.Red;
        }

        protected override void OnDetachingFrom(DatePicker datePicker)
        {
            datePicker.DateSelected -= DatePickerdateSelected;
            base.OnDetachingFrom(datePicker);
        }
    }
}
MobilenovalidationBehavior.cs

This class will create a behavior for mobile numbers. The user must have to add integers otherwise it will show text in Red color.

 

Planning to Hire Xamarin App Development Company ?

Your Search ends here.

 
using Xamarin.Forms;

namespace XamarinFormsBehaviors.Behaviors
{
    public class MobilenovalidationBehavior:Behavior
    {
        protected override void OnAttachedTo(Entry mnoentry)
        {
            mnoentry.TextChanged += MobilenoChanged;
            base.OnAttachedTo(mnoentry);
        }

        private void MobilenoChanged(object sender, TextChangedEventArgs e)
        {
            int num;
            bool Isvalid = int.TryParse(e.NewTextValue, out num);
            ((Entry)sender).TextColor = Isvalid ? Color.Default : Color.Red;
        }

        protected override void OnDetachingFrom(Entry mnoentry)
        {
            mnoentry.TextChanged -= MobilenoChanged;
            base.OnDetachingFrom(mnoentry);
        }
    }
}
PasswordvalidationBehavior.cs

This class creates behavior for password validation, the length of the password must be between 8 to 15 and it must contain numeric and alphabetic values otherwise the color of entered text will be changed to Red.

using System;
using System.Text.RegularExpressions;
using Xamarin.Forms;

namespace XamarinFormsBehaviors.Behaviors
{
    public class PasswordvalidationBehavior:Behavior
    {
        const string passwordreg = @"^(?=.*[a-z])(?=.*[A-Z])(?=.*\d).{8,15}$";

        protected override void OnAttachedTo(Entry pwentry)
        {
            pwentry.TextChanged += Textchanged;
            base.OnAttachedTo(pwentry);
        }

        private void Textchanged(object sender, TextChangedEventArgs e)
        {
            bool isvalid = false;
            isvalid= (Regex.IsMatch(e.NewTextValue, passwordreg, RegexOptions.IgnoreCase, TimeSpan.FromMilliseconds(250)));
            ((Entry)sender).TextColor = isvalid ? Color.Default : Color.Red;
        }

        protected override void OnDetachingFrom(Entry pwentry)
        {
           
 pwentry.TextChanged -= Textchanged;
            base.OnDetachingFrom(pwentry);
        }
    }
}

Now, add behaviors to the XAML file, add a namespace to the XAML file and add behaviors to control as added in the below code.



    
        

            #2FA999
            #D8D8D8
        
    
    
        

ai-Hiring-banner

ai-Hiring-banner

Fig: Main Page

Conclusion

Behaviors are used to add more functionalities to our UI. Behaviors are written in code behind file and added to XAML file. In this blog we have seen how to implement behaviors in Xamarin.Forms and create applications with Xamarin.Forms behaviors. We have created behaviors for entry and picker control for that we have built class and inherit behavior to that class and then add these behaviors to our XAML file.