TimePicker - Clear Button

6 posts, 0 answers
  1. AdrianG
    AdrianG avatar
    17 posts
    Member since:
    Jun 2013

    Posted 07 Jun 2014 Link to this post

    Hi

    For the TimePicker editor is there a 'Clear' button or can one be added (similar to that available with the DateTimePicker)?

    Thanks

    Adrian
  2. Dimitar
    Admin
    Dimitar avatar
    1408 posts

    Posted 10 Jun 2014 Link to this post

    Hello Adrian,

    Thank you for writing back.

    There is no such button out of the box for the time picker, but such can be easily added to it. You just nee to create a button and add it to a footer panel of the popup:
    public Form1()
    {
        InitializeComponent();
         
        RadButtonElement clearButton = new RadButtonElement("Clear");
        clearButton.StretchHorizontally = false;
        clearButton.Alignment = ContentAlignment.MiddleRight;
        clearButton.Margin = new System.Windows.Forms.Padding(0, 0, 20, 0);
        clearButton.Click += clearButton_Click;
     
        radTimePicker1.TimePickerElement.PopupContentElement.FooterPanel.Children.Add(clearButton);
    }
     
    void clearButton_Click(object sender, EventArgs e)
    {
        radTimePicker1.Value = null;
    }

    Please let me know if there is something else I can help you with. 
     
    Regards,
    Dimitar
    Telerik
     
    Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
     
  3. UI for WinForms is Visual Studio 2017 Ready
  4. AdrianG
    AdrianG avatar
    17 posts
    Member since:
    Jun 2013

    Posted 11 Jun 2014 in reply to Dimitar Link to this post

    Thanks very much Dimitar.

    What would be the best way to incorporate this in a GridView cell (CustomFormat of HH:mm with TimePicker as editor type).

    The reason I'm asking is that when a time has been selected/entered in a cell, users are then finding it very difficult to clear/blank the value. Do you have any tips or recommendations for being able to remove values from cells that have datetime editors (for example using the editor clear button or pressing the delete key)?

    Regards

    Adrian
  5. Dimitar
    Admin
    Dimitar avatar
    1408 posts

    Posted 13 Jun 2014 Link to this post

    Hello Adrian,

    Thank you for writing back.

    You can create a custom editor and use it instead of the default one:
    public class MyGridTimePickerEditor : GridTimePickerEditor
    {
        public override void OnValueChanged()
        {
            base.OnValueChanged();
        }
        protected override RadElement CreateEditorElement()
        {
            return new MyRadTimePickerElement();
     
        }
    }
     
    public class MyRadTimePickerElement : RadTimePickerElement
    {
        protected override Type ThemeEffectiveType
        {
            get
            {
                return typeof(RadTimePickerElement);
            }
        }
     
        protected override void CreateChildElements()
        {
            base.CreateChildElements();
            RadButton b = new RadButton();
            b.Text = "Clear";
            b.AutoSize = true;
            RadHostItem clearButton = new RadHostItem(b);
     
            b.Click += clearButton_Click;
            clearButton.PositionOffset = new Size(4, 4);
            this.PopupContentElement.FooterPanel.Children.Add(clearButton);
        }
     
        void clearButton_Click(object sender, EventArgs e)
        {
            this.Value = null;
     
        }
    }

    The editor can be changed in the EditorRequired event:
    void radGridView1_EditorRequired(object sender, EditorRequiredEventArgs e)
    {
        if (e.EditorType == typeof(GridTimePickerEditor))
        {
            e.EditorType = typeof(MyGridTimePickerEditor);
        }
    }

    if you want to clear the value with the delete key you can override the KeyDown event in the custom RadTimePickerElement class:
    protected override void MaskEditBox_KeyDown(object sender, KeyEventArgs e)
    {
        if (e.KeyCode == Keys.Delete)
        {
            this.Value = null;
            e.Handled = true;
            e.SuppressKeyPress = true;
        }
        else
        {
            base.MaskEditBox_KeyDown(sender, e);
        }
    }

    Please let me know if there is something else I can help you with. 
     
    Regards,
    Dimitar
    Telerik
     
    Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
     
  6. hans
    hans avatar
    6 posts
    Member since:
    Aug 2006

    Posted 12 Aug 2015 in reply to Dimitar Link to this post

    I can see the size of the footer change when I change the size of the clearbutton-margin, but I don't see the clearbutton itself.

    Do you have a working visualstudio-solution with a custom inherited timepicker?

    I tried the following, but it is not working:
    public class QTimePicker : RadTimePicker
    {
    public QTimePicker()
    {
    var clearButton = new RadButtonElement("Clear");
    clearButton.Size = new Size(210, 20);
    clearButton.StretchHorizontally = false;
    clearButton.Alignment = ContentAlignment.TopRight;
    clearButton.Margin = new Padding(50, 50, 50, 50);
    clearButton.BackColor = Color.Chartreuse;
    clearButton.Click += ClearButton_Click;
    TimePickerElement.PopupContentElement.FooterPanel.BackColor = Color.Red;
    TimePickerElement.PopupContentElement.FooterPanel.Children.Add(clearButton);
    }

    public override string ThemeClassName
    {
    get { return typeof(RadTimePicker).FullName; }
    }

    private void ClearButton_Click(object sender, EventArgs e)
    {
    Value = null;
    }
    }

     

     

  7. Dimitar
    Admin
    Dimitar avatar
    1408 posts

    Posted 14 Aug 2015 Link to this post

    Hi Hans,

    Thank you for writing.

    You can use the same custom RadTimePickerElement and add it to the control:
    public class MyRadTimePicker : RadTimePicker
    {
        protected override RadTimePickerElement CreateTimePickerElement()
        {
            return new MyRadTimePickerElement();
        }
    }
     
    public class MyRadTimePickerElement : RadTimePickerElement
    {
        protected override Type ThemeEffectiveType
        {
            get
            {
                return typeof(RadTimePickerElement);
            }
        }
     
        protected override void CreateChildElements()
        {
            base.CreateChildElements();
            RadButton b = new RadButton();
            b.Text = "Clear";
            b.AutoSize = true;
            RadHostItem clearButton = new RadHostItem(b);
     
            b.Click += clearButton_Click;
            clearButton.PositionOffset = new Size(4, 4);
            this.PopupContentElement.FooterPanel.Children.Add(clearButton);
        }
     
        void clearButton_Click(object sender, EventArgs e)
        {
            this.Value = null;
        }
    }

    Please let me know if there is something else I can help you with. 
     
    Regards,
    Dimitar
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
UI for WinForms is Visual Studio 2017 Ready