SegmentedControl IsEnabled not works.

[ward]

I have try to set IsEnabled property for SegmentedControl,but not works.

And I want to disabled SegmentedControl without SetSegmentEnabled. 

Can I work this?

Thanks.

 

            <VerticalStackLayout>
                <!--  >> segmentcontrol-gettingstarted-xaml  -->
                <telerikInput:RadSegmentedControl x:Name="segmentControlText" 
                                              BackgroundColor="AliceBlue"
                                              IsEnabled="False"
                                              VerticalOptions="Start"/>
                <!--  << segmentcontrol-gettingstarted-xaml  -->
            </VerticalStackLayout>

 

[Lance | Manager Technical Support]

Hello Ward,

The top level "IsEnabled" property disables the entire control, not any individual segments. That is why you must use SetSegmentEnabled to toggle the enabled/disabled state of any given segment, see the Disabled Segments documentation.

Bug Report

That being said, the entire SegmentedControl should be disabled when IsEnabled is false and that is not happening. I have opened a Bug Report for this => IsEnabled Does Not Work (telerik.com).

Alternative Options

Option 1 - Behavior

You could use a Behavior to access the SetSegmentEnabled method.

Important: If you are not familiar with writing behaviors, please visit this documentation first so that you know how to set the BehaviorBase class => Behaviors - .NET MAUI | Microsoft Docs

public class EnabledSegmentsBehavior : BehaviorBase<View>
{
    public static readonly BindableProperty DisabledSegmentsProperty =
        BindableProperty.Create("DisabledSegments", typeof(IList<int>), typeof(EnabledSegmentsBehavior), null, propertyChanged: OnDisabledSegmentsChanged);

    public IList<int> DisabledSegments
    {
        get => (IList<int>)GetValue(DisabledSegmentsProperty);
        set => SetValue(DisabledSegmentsProperty, value);
    }

    public static readonly BindableProperty EnabledSegmentsProperty =
        BindableProperty.Create("EnabledSegments", typeof(IList<int>), typeof(EnabledSegmentsBehavior), null, propertyChanged: OnEnabledSegmentsChanged);

    public IList<int> EnabledSegments
    {
        get => (IList<int>)GetValue(EnabledSegmentsProperty);
        set => SetValue(EnabledSegmentsProperty, value);
    }

    private static void OnDisabledSegmentsChanged(BindableObject bindable, object oldvalue, object newvalue)
    {
        if (bindable is EnabledSegmentsBehavior self && newvalue is IReadOnlyList<int> disabledSegments)
        {
            foreach (var index in disabledSegments)
            {
                ((RadSegmentedControl)self.AssociatedObject).SetSegmentEnabled(index, false);
            }
        }
    }

    private static void OnEnabledSegmentsChanged(BindableObject bindable, object oldvalue, object newvalue)
    {
        if (bindable is EnabledSegmentsBehavior self && newvalue is IReadOnlyList<int> disabledSegments)
        {
            foreach (var index in disabledSegments)
            {
                ((RadSegmentedControl)self.AssociatedObject).SetSegmentEnabled(index, true);
            }
        }
    }
}

Then, you can explicitly set which segment to enable or disable by using its index:

<telerikInput:RadSegmentedControl x:Name="segmentControl"
                                  DisabledSegmentTextColor="#CA5100"
                                  HeightRequest="60"
                                  VerticalOptions="Start">
    <telerikInput:RadSegmentedControl.ItemsSource>
        <s:List x:TypeArguments="x:String">
            <x:String>One</x:String>
            <x:String>Two</x:String>
            <x:String>Three</x:String>
            <x:String>Four</x:String>
        </s:List>
    </telerikInput:RadSegmentedControl.ItemsSource>
    <telerikInput:RadSegmentedControl.Behaviors>
        <behaviors:EnabledSegmentsBehavior>
            <behaviors:EnabledSegmentsBehavior.EnabledSegments>
                <s:List x:TypeArguments="x:Int32">
                    <x:Int32>0</x:Int32>
                    <x:Int32>1</x:Int32>
                </s:List>
            </behaviors:EnabledSegmentsBehavior.EnabledSegments>
            <behaviors:EnabledSegmentsBehavior.DisabledSegments>
                <s:List x:TypeArguments="x:Int32">
                    <x:Int32>2</x:Int32>
                    <x:Int32>3</x:Int32>
                </s:List>
            </behaviors:EnabledSegmentsBehavior.DisabledSegments>
        </behaviors:EnabledSegmentsBehavior>
    </telerikInput:RadSegmentedControl.Behaviors>
</telerikInput:RadSegmentedControl>

Option 2 - Custom Control

If you would like more control over the individual segments, you can create a custom control with RadButton and RadBorder that lets you access each segment individually.

This isn't something we can provide officially, but I can give you a head start with a control I have previously developed for a similar circumstance => CustomSegmentedControlDemo. 

I have adapted it for MAUI and added an extra property to set which segments to disable using a DisabledSegments property:

<customControls:ButtonSegments x:Name="ButtonSegments1"
                               CornerRadius="4"
                               HeightRequest="40"
                               Margin="5"
                               Grid.Row="0">
    <customControls:ButtonSegments.ItemsSource>
        <s:List x:TypeArguments="x:String">
            <x:String>One</x:String>
            <x:String>Two</x:String>
            <x:String>Three</x:String>
            <x:String>Four</x:String>
        </s:List>
    </customControls:ButtonSegments.ItemsSource>
    <!-- Disables the middle two buttons -->
    <customControls:ButtonSegments.DisabledSegments>
        <s:List x:TypeArguments="x:Int32">
            <x:Int32>2</x:Int32>
            <x:Int32>1</x:Int32>
        </s:List>
    </customControls:ButtonSegments.DisabledSegments>
</customControls:ButtonSegments>

If you run the demo, you'll see that segments "Two" and "Three" are disabled and cannot be clicked.

If you click the "Change IsEnabled" button, the following logic is executed and only the last segment is now disabled:

public void Button_Clicked(object sender, EventArgs e)
{
    // Disables only the last button
    ButtonSegments1.DisabledSegments = new List<int> { 3 };
}

Any future development efforts on that custom control are your responsibility as it isn't an official UI for MAUI component, but I hope this is a good head start and helps you achieve what you're looking for.

Regards,
Lance | Manager Technical Support
Progress Telerik

[ward]

Hello Lance，

I'm pleasure to receive your answer,and I tend to try  behavior.

Thank u so much.