Set TextColor for Disabled RadButton

 

In order to set a different from the default text color when RadButton's IsEnabled property is set to false, you can create custom renderers for the different platforms and set the color directly on the native elements. This article will guide you on how to achieve the behavior on the different platforms.

1. As a first step, in order to use a custom renderer for the RadButton, you should create a custom class that inherits from RadButton. Eventually, you can target your custom element within the custom renderer.

Here is the custom class:

public class MyRadButton : RadButton
{
}

And how it is declared within your page:

<myButton:MyRadButton x:Name="btn" 
                      BackgroundColor="DarkOrange" 
                      HorizontalOptions="FillAndExpand"
                      FontSize="Medium"
                      IsEnabled="False" 
                      BorderRadius="15" 
                      Text="Button is disabled!"/>

2. Once you have added the 'custom' control to your application, you can create the following custom renderers for the different platforms in order to alter the TextColor when the button is disabled:

iOS Renderer

[assembly: Xamarin.Forms.ExportRenderer(typeof(MyRadButton), typeof(CustomButtonRenderer))]
namespace SDKBrowser.iOS.Examples.ButtonControl.HowToCategory.ButtonDisabledTextColorExample
{
    public class CustomButtonRenderer : Telerik.XamarinForms.InputRenderer.iOS.ButtonRenderer
    {
        public CustomButtonRenderer() : base()
        {
        }

        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.Button> e)
        {
            base.OnElementChanged(e);
            if (Control != null)
            {
                Control.SetTitleColor(UIColor.Gray, UIControlState.Disabled);
                Control.SetTitleColor(UIColor.Red, UIControlState.Normal);
            }
        }
    }
}

Android Renderer

[assembly: Xamarin.Forms.ExportRenderer(typeof(MyRadButton), typeof(CustomButtonRenderer))]
namespace SDKBrowser.Droid.Examples.ButtonControl.HowToCategory.ButtonDisabledTextColorExample
{
    public class CustomButtonRenderer : Telerik.XamarinForms.InputRenderer.Android.ButtonRenderer
    {
        public CustomButtonRenderer() : base()
        {
        }

        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.Button> e)
        {
            base.OnElementChanged(e);
            this.ModifyTextColor();
        }

        protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            base.OnElementPropertyChanged(sender, e);
            if (e.PropertyName == Xamarin.Forms.Button.IsEnabledProperty.PropertyName)
            {
                this.ModifyTextColor();
            }
        }

        private void ModifyTextColor()
        {
            if (this.Element.IsEnabled == true)
            {
                this.Control.SetTextColor(Android.Graphics.Color.Red);
            }
            else
            {
                this.Control.SetTextColor(Android.Graphics.Color.Gray);
            }
        }
    }
}

UWP Renderer

[assembly: ExportRenderer(typeof(MyRadButton), typeof(CustomButtonRenderer))]
namespace SDKBrowser.UWP.Examples.ButtonControl.HowToCategory.ButtonDisabledTextColorExample
{
    public class CustomButtonRenderer : Telerik.XamarinForms.InputRenderer.UWP.ButtonRenderer
    {
        public CustomButtonRenderer() : base()
        {
        }

        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.Button> e)
        {
            base.OnElementChanged(e);
            this.ModifyTextColor();
        }

        protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            base.OnElementPropertyChanged(sender, e);
            if (e.PropertyName == Xamarin.Forms.Button.IsEnabledProperty.PropertyName)
            {
                ModifyTextColor();
            }
        }

        private void ModifyTextColor()
        {
            if (this.Element.IsEnabled == true)
            {
                this.Control.Foreground = new SolidColorBrush(Windows.UI.Color.FromArgb(255, 255, 0, 0));
            }
            else
            {
                this.Control.Foreground = new SolidColorBrush(Windows.UI.Color.FromArgb(255, 165, 0, 0));
            }
        }

    }
}

Figure 1 shows the appearance of the disabled RadButton once the custom renderers have been added to your application.

Figure 1: Text Color of disabled RadButton

See Also

Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy