How to Bind Static Class property to UI component in XAML / Xamarin

Question

I need the expert help. I am writing the Xamarin application. I am not able to Bind the static property of the C# user defined static Class property (Colors. BackgroundColor) to XAML. Actually I need to set the background of the color of grid by static value defined in static class. But it always give me Class not found error on line

I am getting the error as Type UserInterfaceDefinitions not found in xmlns

BackgroundColor = "{Binding Source = {x:Static Circassia.Mobile:UserInterfaceDefinitions.Colors} }" Static Class code

namespace MyNamespace.Mobile
{
    public static class UserInterfaceDefinitions
    {
        public static class Colors
        {
            public static string BackgroundColor = "#DCECE";
        }

        
    }
}

XAML Code

<?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:buttons="clr-namespace:MyNamespace.Mobile.UI.Buttons" 
              xmlns:Status="clr-namespace:MyNamespace.Mobile.UI.StatusDetails"     
             x:Class="MyNamespace.Mobile.UI.TestAndDemoSelection">
    <ContentPage.Content  Margin="0,0,0,0" BackgroundColor="White">

    
 <Grid x:Name="ChildGrid" Grid.Row="1" Grid.Column="0"  ColumnSpacing="10" BackgroundColor="White" >
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"></ColumnDefinition> 
                </Grid.ColumnDefinitions>
            
            <!-- I am getting the error as Type UserInterfaceDefinitions not found in xmlns-->

            <BoxView Grid.Column="0" BackgroundColor = "{Binding Source = {x:Static MyNamespace.Mobile:UserInterfaceDefinitions.Colors} }" /> 
         
 </Grid>     
 
    </ContentPage.Content>
</ContentPage>

Code Behind .cs

using MyNamespace.Mobile.UI.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

using Xamarin.Forms;
using Xamarin.Forms.Xaml;

namespace MyNamespace.Mobile.UI
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class TestAndDemoSelection : ContentPage
    {
        public TestAndDemoSelection()
        {
            InitializeComponent();
        }
 
    }
}

How to bind the static class property to XAML ?

Answer 1

In order to bind on a Static Property:

1) Declare the namespace to import using xmlns

2) Use the xmlns accordingly in Source

=>

<?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:buttons="clr-namespace:MyNamespace.Mobile.UI.Buttons" 
              xmlns:Status="clr-namespace:MyNamespace.Mobile.UI.StatusDetails" 
             xmnlns:local="clr-namespace:MyNamespace.Mobile" 
             x:Class="MyNamespace.Mobile.UI.TestAndDemoSelection">
    <ContentPage.Content  Margin="0,0,0,0" BackgroundColor="White">


         <Grid x:Name="ChildGrid" Grid.Row="1" Grid.Column="0"  ColumnSpacing="10" BackgroundColor="White" >
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"></ColumnDefinition> 
                </Grid.ColumnDefinitions>


            <BoxView Grid.Column="0" BackgroundColor = "{x:Static local:UserInterfaceDefinitions.Colors.BackgroundColor}" /> 

         </Grid>     

    </ContentPage.Content>
</ContentPage>

Moreover, BackgroundColor should be a property in order to be accessible:

public static string BackgroundColor {get;} = "#DCECE";

Answer 2

I have got the resolutions. It was because of Nested Static class was not accessible inside the XAML the correct code as below.

user defined static class:

namespace MyNamespace.Mobile
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public static class UserInterfaceDefinitions
    {
        public static string BackgroundColor { get; } = "#DCECEC";
    }
}

XAML file:

<?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:MyNamespace.Mobile"   
             x:Class="MyNamespace.Mobile.UI.TestAndDemoSelection">
    <ContentPage.Content  Margin="0,0,0,0" BackgroundColor="White">


 <Grid x:Name="ChildGrid" Grid.Row="1" Grid.Column="0"  ColumnSpacing="10" BackgroundColor="White" >
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"></ColumnDefinition> 
                </Grid.ColumnDefinitions>


           <BoxView Grid.Column="0" BackgroundColor = "{Binding Source = {x:Static local:UserInterfaceDefinitions.BackgroundColor}}" />

 </Grid>     

    </ContentPage.Content>
</ContentPage>

Answer 3

XAML works very poorly with nested classes. Yes, and in general, a public nested class is often a very bad technique.

Example:

namespace MyNamespace.Mobile
{
    public static class Colors
    {
        public static string BackgroundColor { get; } = "Red";
    }

}

XAML:

<StackPanel xmlns:Circassia.Mobile="clr-namespace:MyNamespace.Mobile"
    Background ="{Binding Source={x:Static Circassia.Mobile:Colors.BackgroundColor}}"/>

Second example:

namespace MyNamespace.Mobile
{
    public static class UserInterfaceDefinitions
    {
        public static ColorsClass  Colors{ get; } = new ColorsClass();

        public class ColorsClass
        {
            private static readonly string s_BackgroundColor = "Red";
            public static string BackgroundColor { get; } = s_BackgroundColor;
        }

    }
}

XAML:

<StackPanel xmlns:Circassia.Mobile="clr-namespace:MyNamespace.Mobile"
    Background ="{Binding BackgroundColor, Source={x:Static Circassia.Mobile:UserInterfaceDefinitions.Colors}}"/>