Binding DateTime to TimePicker in Xamarin Forms - datetime

Question

I tried to bind a DateTime value to a TimePicker instead of a TimeSpan.
If I change the Datatype then I have to change my complete code.
The property is called Item.Time
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" Title="New Item">
<ContentPage.ToolbarItems>
<ToolbarItem Text="Save" Clicked="Save_Clicked" />
</ContentPage.ToolbarItems>
<ContentPage.Content>
<StackLayout Spacing="20" Padding="15">
<Label Text="Text" FontSize="Medium" />
<TimePicker Time="{Binding Item.Time}"/>
<Label Text="Description" FontSize="Medium" />
<Editor Text="{Binding Item.Text}" FontSize="Small" Margin="0" />
</StackLayout>
</ContentPage.Content>
</ContentPage>
How can I convert DateTime to TimeSpan without using an other class or something like that?
Is it possible to convert it with code like this:
<TimePicker Time="{Binding **(TimeSpan)**Item.Time}"/>

Answer 1

You cannot do this without the help of any other class, so you will need to convert it in your ViewModel already and expose it as a property and use that.
This would simply mean something like:
public TimeSpan MyTimeSpan
{
get { return Item.Time; } // Assuming Item.Time is a TimeSpan
set { Item.Time = value; }
}
You could also use a value converter. To do this, create a new class which implements the IValueConverter interface. It should be something like this, note that this is pseudo-code from the top of my head and might not work out of the box:
public class DateTimeToTimeSpanConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
return ((DateTime)value).Time;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
var incomingTimeSpan = (TimeSpan)value;
return new DateTime(2018, 1, 1, incomingTimeSpan.Hours, incomingTimeSpan.Minutes, incomingTimeSpan.Seconds);
}
}
In your XAML, you can use it like this:
<ContentPage xmlns:local="clr-namespace:YourNamespaceName"...>
<ContentPage.Resources>
<ResourceDictionary>
<local:DateTimeToTimeSpanConverter x:Key="timeSpanConverter" />
</ResourceDictionary>
</ContentPage.Resources>
...
<TimePicker Time="{Binding Item.Time, Converter={StaticResource timeSpanConverter}}"/>
...
</ContentPage>
Read more on value converters in the Docs: https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/data-binding/converters

Answer 2

You can get TimeStamp value from DataTime object, like "DataTimeObject.TimeOfDay", The TimeOfDay is a TimeStamp datatype.
<TimePicker x:Name="Timepicker" HeightRequest="100" Time="{Binding
Item.TimeOfDay, Mode=TwoWay}"
PropertyChanged="TimePicker_PropertyChanged"/>

Answer 3

Either use a value converter or add a TimeSpan property to your view model

Answer 4

A straight to the point example compiled from #GeraldVersluis example. Note that I have two controls "ReturnTime" and "ReturnDate":
DateTime d = this.ReturnDate.Date;
DateTime dtCombined = new DateTime(d.Year, d.Month, d.Day, ReturnTime.Time.Hours, this.ReturnTime.Time.Minutes, this.ReturnTime.Time.Seconds);