Xamarin Forms timepicker 24 hours

Question

I am new to Xamarin.Forms and I cannot find how to show a 24 hour dialog instead of AM / PM

Can someone help me?

thank

Answer 1

The only solution I found is here: 24h timepicker

In principle, a separate visualization tool will be required in each platform project.

Xamarin.iOS:

using MonoTouch.Foundation;
using MonoTouch.UIKit;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;
using PersonalTrainer.iOS.View.Controls;

[assembly: ExportRenderer (typeof (TimePicker), typeof     (TimePicker24HRenderer))]

namespace YourNamespace.iOS.View.Controls {
    public class TimePicker24HRenderer : TimePickerRenderer {
        protected override void OnElementChanged(ElementChangedEventArgs<TimePicker> e) {
            base.OnElementChanged(e);
            var timePicker = (UIDatePicker)Control.InputView;
            timePicker.Locale = new NSLocale("no_nb");
        }
    }
}

For Android:

[assembly: ExportRenderer(typeof(TimePicker), typeof(TimePicker24HRenderer))]

namespace YourNamespace.Droid.View.Controls {

    public class TimePicker24HRenderer : ViewRenderer<Xamarin.Forms.TimePicker, Android.Widget.EditText>, TimePickerDialog.IOnTimeSetListener, IJavaObject, IDisposable {

        private TimePickerDialog dialog = null;

        protected override void OnElementChanged(ElementChangedEventArgs<TimePicker> e) {
            base.OnElementChanged(e);
            this.SetNativeControl(new Android.Widget.EditText(Forms.Context));
            this.Control.Click += Control_Click;
            this.Control.Text = DateTime.Now.ToString("HH:mm");
            this.Control.KeyListener = null;
            this.Control.FocusChange += Control_FocusChange;
        }

        void Control_FocusChange(object sender, Android.Views.View.FocusChangeEventArgs e) {
            if (e.HasFocus) { ShowTimePicker(); }
        }

        void Control_Click(object sender, EventArgs e) {
            ShowTimePicker();
        }

        private void ShowTimePicker() {
            if (dialog == null) {
                dialog = new TimePickerDialog(Forms.Context, this, DateTime.Now.Hour, DateTime.Now.Minute, true);
            }

            dialog.Show();
        }

        public void OnTimeSet(Android.Widget.TimePicker view, int hourOfDay, int minute) {
            var time = new TimeSpan(hourOfDay, minute, 0);
            this.Element.SetValue(TimePicker.TimeProperty, time);

            this.Control.Text = time.ToString(@"hh\:mm");
        }
    }
}

For Windows Phone:

[assembly: ExportRenderer (typeof (MyTimePicker), typeof (TimePicker24HRenderer))]

namespace YourNamespace.WindowsPhone.View.Controls {

    public class TimePicker24HRenderer : TimePickerRenderer {

        // Override the OnElementChanged method so we can tweak this renderer post-initial setup

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

            if (Control != null) {
                var nativeControl = (Windows.UI.Xaml.Controls.TimePicker)Control;
                nativeControl.Foreground = new SolidColorBrush(Colors.Gray);

                Control.ClockIdentifier = "24HourClock";
            }
        }
    }
}

Answer 2

This page is very useful to learn how to format dates in C #:

https://msdn.microsoft.com/en-us/library/8kb3ddd4%28v=vs.110%29.aspx

And with this code, I was able to show a 24-hour format:

TimePicker timePicker = new TimePicker
{
   Format = "HH:mm"
};

Answer 3

Ok. . - .

public interface TimePickerInterface
    {
        void showTimePicker (ButtonOrLabel lbl);
    }

Android timepicker

[assembly:Dependency(typeof(yournamespace.MyTimePicker))]
namespace yournamespace
{

    public class MyTimePicker:Java.Lang.Object,TimePickerInterface,Android.App.TimePickerDialog.IOnTimeSetListener
    {
        String originalText="";
        LabelOrButton lbl=new LabelOrButton();

        public void showTimePicker(LabelOrButton lbl)
        {
            var c = Forms.Context;
            originalText = lbl.Text;
            this.lbl = lbl;
            var time = DateTime.Now.TimeOfDay;
            TimePickerDialog dialog = new TimePickerDialog(c,this,time.Hours,time.Minutes,true);
            dialog.SetCanceledOnTouchOutside (true);
            dialog.Show ();
        }
        public void OnTimeSet (Android.Widget.TimePicker view, int hourOfDay, int minute)
        {
            if(view.IsShown)
                lbl.Text = (hourOfDay<=9 ? ("0"+hourOfDay+""):hourOfDay+"")+":"+(minute<=9 ? ("0"+minute+""):minute+"");
        }
    }
}

And in your xamarin formats, you call this in the actionlistener of your button or gesturerecognizer of your label:

DependencyService.Get<TimePickerInterface> ().showTimePicker(myButtonOrLabel);

You can do the same for DatePicker .. Hope this helps.