This is a migrated thread and some comments may be shown as answers.

Removing the dropdown

2 Answers 142 Views
TimePicker
This is a migrated thread and some comments may be shown as answers.
Jason D
Top achievements
Rank 1
Veteran
Jason D asked on 03 Mar 2020, 07:13 PM

I need the time interval to be 1 minute. This makes the dropdown unusable. How can I disable or just remove the dropdown completely so it works like the old WinForms time picker? I saw this:

https://www.telerik.com/forums/how-to-remove-the-drop-down-button

but it's pretty old and I don't really want to mess with Expression Blend (if it even still exists?). I would also need the cursor keys and mouse wheel to increment/decrement the current value.

Or is it better to just try make the NumericUpDown work like a TimePicker?

2 Answers, 1 is accepted

Sort by
0
Accepted
Martin Ivanov
Telerik team
answered on 06 Mar 2020, 12:08 PM

Hello Jason,

To achieve your requirement, you can create a custom RadTimePicker control and override its OnApplyTemplate, ProcessKey and MouseWheel methods. Here is an example in code:

public class CustomDatePicker : RadTimePicker
{
	public override void OnApplyTemplate()
	{
		base.OnApplyTemplate();
		var dropDownButton = (RadDropDownButton)this.GetTemplateChild("PART_DropDownButton");
		dropDownButton.Visibility = Visibility.Collapsed;
	}

	protected override void ProcessKey(KeyEventArgs e)
	{
		if (this.SelectedTime.HasValue)
		{
			if (e.Key == Key.Up)
			{
				this.SetCurrentValue(RadDatePicker.SelectedTimeProperty, this.SelectedTime.Value.Add(this.TimeInterval));
			}
			else if (e.Key == Key.Down)
			{
				this.SetCurrentValue(RadDatePicker.SelectedTimeProperty, this.SelectedTime.Value.Add(-this.TimeInterval));
			}
		}
	}

	protected override void OnMouseWheel(MouseWheelEventArgs e)
	{
		base.OnMouseWheel(e);
		if (e.Delta > 0)
		{
			this.SetCurrentValue(RadDatePicker.SelectedTimeProperty, this.SelectedTime.Value.Add(this.TimeInterval));
		}
		else
		{
			this.SetCurrentValue(RadDatePicker.SelectedTimeProperty, this.SelectedTime.Value.Add(-this.TimeInterval));
		}
	}
}

I also attached a small example showing how to do this. I hope it helps.

Regards,
Martin Ivanov
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Jason D
Top achievements
Rank 1
Veteran
answered on 11 Mar 2020, 06:43 PM
Thanks, that worked. However, I want the mouse and cursor keys to only change the time part for the current selection (hour,minute,am/pm). I ran into issues with all the possibilities, so I'm not currently using it yet. Will post solution when I have time to work on it again.
Tags
TimePicker
Asked by
Jason D
Top achievements
Rank 1
Veteran
Answers by
Martin Ivanov
Telerik team
Jason D
Top achievements
Rank 1
Veteran
Share this question
or