xamarinxamarin.formsxamarin.androidtimepickernumberpicker

TimePicker with 15 minutes interval in xamarin forms


I need to set 15 minutes interval in Time Picker. I have done for iOS. But in Android it is not working.

For iOS I used following code and it is working:

public class CustomTimePickerRenderer : TimePickerRenderer
{
    protected override void OnElementChanged(ElementChangedEventArgs<TimePicker> e)
    {
            base.OnElementChanged(e);
            var view = (TimePicker)Element;

        if (view != null)
        {
                var timePicker = (UIDatePicker)Control.InputView;
            timePicker.MinuteInterval = 15;
            }
    }
}

For Andoroid I am trying with following code:

public class CustomTimePickerRenderer : TimePickerRenderer
{
    Context _context;

    public CustomTimePickerRenderer(Context context) : base(context)
    {
        _context = context;
    }

    protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.TimePicker> e)
    {
        base.OnElementChanged(e);

        TimePickerDialogIntervals timePickerDlg = new TimePickerDialogIntervals(this.Context, new EventHandler<TimePickerDialogIntervals.TimeSetEventArgs>(UpdateDuration),
            Element.Time.Hours, Element.Time.Minutes, true);

        var control = new EditText(this.Context);
        control.Focusable = false;
        control.FocusableInTouchMode = false;
        control.Clickable = false;
        control.Click += (sender, ea) => timePickerDlg.Show();
        control.Text = Element.Time.Hours.ToString("00") + ":" + Element.Time.Minutes.ToString("00");

        SetNativeControl(control);
    }

    void UpdateDuration(object sender, Android.App.TimePickerDialog.TimeSetEventArgs e)
    {
        Element.Time = new TimeSpan(e.HourOfDay, e.Minute, 0);
        Control.Text = Element.Time.Hours.ToString("00") + ":" + Element.Time.Minutes.ToString("00");
    }
}

public class TimePickerDialogIntervals : TimePickerDialog
{
    public const int TimePickerInterval = 15;
    private bool _ignoreEvent = false;

    public TimePickerDialogIntervals(Context context, EventHandler<TimePickerDialog.TimeSetEventArgs> callBack, int hourOfDay, int minute, bool is24HourView)
        : base(context, (sender, e) => {
            callBack(sender, new TimePickerDialog.TimeSetEventArgs(e.HourOfDay, e.Minute * TimePickerInterval));
        }, hourOfDay, minute / TimePickerInterval, is24HourView)
    {
    }

    protected TimePickerDialogIntervals(IntPtr javaReference, JniHandleOwnership transfer) : base(javaReference, transfer)
    {
    }

    public override void SetView(Android.Views.View view)
    {
        SetupMinutePicker(view);
        base.SetView(view);
    }

    void SetupMinutePicker(Android.Views.View view)
    {
        var numberPicker =  FindMinuteNumberPicker(view as ViewGroup);
        if (numberPicker != null)
        {
            numberPicker.MinValue = 0;
            numberPicker.MaxValue = 3;
            numberPicker.SetDisplayedValues(new String[] { "00", "15", "30", "45" });
        }
    }

    protected override void OnCreate(Android.OS.Bundle savedInstanceState)
    {
        base.OnCreate(savedInstanceState);
        GetButton((int)DialogButtonType.Negative).Visibility = Android.Views.ViewStates.Gone;
        this.SetCanceledOnTouchOutside(false);
    }

    private NumberPicker FindMinuteNumberPicker(ViewGroup viewGroup)
    {
        for (var i = 0; i < viewGroup.ChildCount; i++)
        {
            var child = viewGroup.GetChildAt(i);
            var numberPicker = child as NumberPicker;
            if (numberPicker != null)
            {
                if (numberPicker.MaxValue == 59)
                {
                    return numberPicker;
                }
            }

            var childViewGroup = child as ViewGroup;
            if (childViewGroup != null)
            {
                var childResult = FindMinuteNumberPicker(childViewGroup);
                if (childResult != null)
                    return childResult;
            }
        }

        return null;
    }
}

But Android code is not working. I think the issue is with the number picker in SetupMinutePicker method. I am getting null in number picker. Please let me know how I can fix this number picker issue or is there any alternate solution to set 15 minutes interval in time picker.


Solution

  • I have found a workaround for Android. The previous override SetView(...) method can not get the NumberPicker now, here we can change the minutes interval in override OnTimeChanged method as follow:

    public override void OnTimeChanged(Android.Widget.TimePicker view, int hourOfDay, int minute)
    {
        if (_ignoreEvent) return;
    
        if (minute % TimePickerInterval != 0)
        {
            int minuteFloor = minute - (minute % TimePickerInterval);
            minute = minuteFloor + (minute == minuteFloor + 1 ? TimePickerInterval : 0);
            if (minute == 60)
                minute = 0;
            _ignoreEvent = true;
            view.CurrentMinute = (Java.Lang.Integer)minute;
            _ignoreEvent = false;
        }
    }
    

    The full android renderer code is as follow:

    public class CustomTimePickerRenderer : TimePickerRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.TimePicker> e)
        {
            base.OnElementChanged(e);
    
            TimePickerDialogIntervals timePickerDlg = new TimePickerDialogIntervals(this.Context, new EventHandler<TimePickerDialogIntervals.TimeSetEventArgs>(UpdateDuration),
                Element.Time.Hours, Element.Time.Minutes, true);
    
            var control = new EditText(this.Context);
            control.Focusable = false;
            control.FocusableInTouchMode = false;
            control.Clickable = false;
            control.Click += (sender, ea) => timePickerDlg.Show();
            control.Text = Element.Time.Hours.ToString("00") + ":" + Element.Time.Minutes.ToString("00");
    
            SetNativeControl(control);
        }
    
        void UpdateDuration(object sender, Android.App.TimePickerDialog.TimeSetEventArgs e)
        {
            Element.Time = new TimeSpan(e.HourOfDay, e.Minute, 0);
            Control.Text = Element.Time.Hours.ToString("00") + ":" + Element.Time.Minutes.ToString("00");
        }
    }
    
    public class TimePickerDialogIntervals : TimePickerDialog
    {
        public const int TimePickerInterval = 15;
        private bool _ignoreEvent = false;
    
        public TimePickerDialogIntervals(Context context, EventHandler<TimePickerDialog.TimeSetEventArgs> callBack, int hourOfDay, int minute, bool is24HourView)
            : base(context, (sender, e) => {
                callBack(sender, new TimePickerDialog.TimeSetEventArgs(e.HourOfDay, e.Minute * TimePickerInterval));
            }, hourOfDay, minute / TimePickerInterval, is24HourView)
        {
        }
    
        public override void OnTimeChanged(Android.Widget.TimePicker view, int hourOfDay, int minute)
        {
            base.OnTimeChanged(view, hourOfDay, minute);
            
            if (_ignoreEvent) return;
    
            if (minute % TimePickerInterval != 0)
            {
                int minuteFloor = minute - (minute % TimePickerInterval);
                minute = minuteFloor + (minute == minuteFloor + 1 ? TimePickerInterval : 0);
                if (minute == 60)
                    minute = 0;
                _ignoreEvent = true;
                view.CurrentMinute = (Java.Lang.Integer)minute;
                _ignoreEvent = false;
            }
        }
    }
    

    The effect:

    enter image description here