Customize time format in the Clock view of the DateTimePicker

2 posts, 1 answers
  1. Alain
    Alain avatar
    5 posts
    Member since:
    Mar 2018

    Posted 27 Apr 2018 Link to this post

    Hi,

    I need to dynamically modify the date and time format displayed by a RadDateTimePicker, in the InputBox and the Clock view.

    I am able to change the format of the date and time displayed in the Input box using this code:

                        var culture = new CultureInfo("en-US"); // or "fr-FR"
                        var dtfInfo = new DateTimeFormatInfo();
                        dtfInfo.ShortDatePattern = "M/d/yyyy"; // or "yyyy-MM-dd" for fr-FR
                        dtfInfo.LongDatePattern = "M/d/yyyy";  // idem
                        dtfInfo.DateSeparator = "/"; // "-" for fr-FR
                        dtfInfo.ShortTimePattern = "h:mm tt"; // HH:mm for fr-FR
                        dtfInfo.LongTimePattern = "h:mm tt"; // idem
                        dtfInfo.TimeSeparator = ":";
                        culture.DateTimeFormat = dtfInfo;
                        System.Threading.Thread.CurrentThread.CurrentCulture = culture;
                        System.Threading.Thread.CurrentThread.CurrentUICulture = culture;

    However, it seems this code has no effect on the format of the time items displayed by the Clock view , opened after the change of date and time patterns.

    How to customize the formatting of the time items displayed in the Clock ?  

    I am testing with either "en-US" or "fr-FR" cultures.

    Thx,

    Alain

     

  2. Answer
    Vladimir Stoyanov
    Admin
    Vladimir Stoyanov avatar
    460 posts

    Posted 02 May 2018 Link to this post

    Hello Alain,

    In order to change the format in the clock view, you can reset the template property of the RadDateTimePicker like so:
    var culture = new CultureInfo("en-US"); // or "fr-FR"
    var dtfInfo = new DateTimeFormatInfo();
    dtfInfo.ShortDatePattern = "M/d/yyyy"; // or "yyyy-MM-dd" for fr-FR
    dtfInfo.LongDatePattern = "M/d/yyyy"// idem
    dtfInfo.DateSeparator = "/"; // "-" for fr-FR
    dtfInfo.ShortTimePattern = "h:mm tt"; // HH:mm for fr-FR
    dtfInfo.LongTimePattern = "h:mm tt"; // idem
    dtfInfo.TimeSeparator = ":";
    culture.DateTimeFormat = dtfInfo;
    this.dateTimePicker.Culture = culture;
     
    var dateTimePickerTemplate = this.dateTimePicker.Template;
    this.dateTimePicker.Template = null;
    this.dateTimePicker.Template = dateTimePickerTemplate;

    This will recreate the clock view part of the control and apply the desired culture.

    Please note that I have used the Culture property of the RadDateTimePicker. This way you don't have to set the Culture on the Application level.

    Hope this helps.

    Regards,
    Vladimir Stoyanov
    Progress Telerik
    Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
Back to Top