MAUI - How can slider reduction be prevented?

Question

In my MAUI application, I am using a slider to set a timer. The user can set the desired time by sliding the slider to the appropriate position. Once the timer is started, I want to prevent the user from reducing the set time until the timer completes its countdown. This ensures that the timer runs uninterrupted for the full duration initially set by the user. How can I do this on my MAUI application?

The user should be able to increase the timer using the slider. Restriction is only to reduce the timer.

Below is the Slider code added on the XAML page:

<Slider
    x:Name="watchme_slider"
    Grid.Column="1"
    BackgroundColor="White"
    MinimumTrackColor="#1c98d7"
    MaximumTrackColor="#9a9a9a"
    ThumbImageSource="ic_thumb_xx.png"
    ValueChanged="SliderValueChanged"
    Maximum="0.166666667"
    Minimum="0"
    HorizontalOptions="FillAndExpand"/>

Update:

I have a DragCompletedCommand also in the Slider and which will do some actions. Here when clicking the lower time on slider at that time also the DragCompletedCommand was hitting and doing those actions. How can I disable that?

I tried like below: Added a bool variable on viewmodel and check it's value before doing the actions.

public ICommand DragCompletedCommand => new Command(OnDragCompleted);

private void OnDragCompleted(object obj)
{
    if (invokeDragCompleted)
    {
        //My actions
    }
}

I am setting that bool value from homepage.xaml.cs page's ValueChanged event.

public void SliderValueChanged(object sender, ValueChangedEventArgs args)
{
    try
    {
        Slider slider = (Slider)sender;
        IsIncrease = args.NewValue > args.OldValue;
        if (!IsIncrease)
        {
            hpvm.InputTransparent = true;
            slider.Value = args.OldValue;
            value = args.OldValue;
            hpvm.invokeDragCompleted = false;
        }
        else
        {
            hpvm.InputTransparent = false;
            slider.Value = args.NewValue;
            value = args.NewValue;
            hpvm.invokeDragCompleted = true;
        }
    }
    catch (Exception ex)
    {
        Debug.WriteLine("Exception:>>" + ex);
    }
}

But this event is always firing when the timer runs and hitting if and else block alternatively. So the bool value is getting true from here and doing the actions on the Viewmodel. Is there any way to set the bool value to false when choosing a lower time?

Answer 1

Hello,

You can use the following code to prevent the slider from sliding left by detecting the change in value when dragging it.

<Slider

x:Name="watchme_slider"

Grid.Column="1"

BackgroundColor="White"

MinimumTrackColor="#1c98d7"

MaximumTrackColor="#9a9a9a"

ValueChanged="watchme_slider_ValueChanged"

Maximum="0.166666667"

Minimum="0"

HorizontalOptions="FillAndExpand"/>

private void watchme_slider_ValueChanged(object sender, ValueChangedEventArgs e)

{

    if (e.NewValue < e.OldValue)

    {

        watchme_slider.Value = e.OldValue;

    }

    else

    {

 

    }

}

Best Regards,

Alec Liu.

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.