Xamarin Forms timepicker 24hour - xamarin

Question

I'm new to Xamarin.Forms and i can't seems to find how to show the dialog in a 24hour format instead of a AM/PM
can someone help me ?
Thank you

Answer 1

This page is really usefull 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 2

The only solution i found is here:
24h timepicker
Basically a custom renderer within each platform project will be needed.
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 3

In XAML you can set the the 24 hours format string to TimePicker by using the Format property:
<TimePicker Format="HH:mm"/>

Answer 4

Ok. You have to do it plateform specific.. I did something like that.
So create an interface
public interface TimePickerInterface
{
void showTimePicker (ButtonOrLabel lbl);
}
In Android you create your timepicker class
[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 forms you call it in actionlistener of your button or gesturerecognizer of your label:
DependencyService.Get<TimePickerInterface> ().showTimePicker(myButtonOrLabel);
You can do the same thing for DatePicker..
Hope it helps..