Jump to content

Visual Control for selecting a date range

Recommended Posts

I've seen some nice controls on the web lately that allows a user to select, essentially 2 dates. They do this by opening a calendar component (usually plus a couple months), and then allowing the user to either click twice on each date, or click and drag. Google Analytics comes to mind as an example. A bit cleaner example is from a mobile communications company (example 2). 


Does anyone know of any Delphi analogs? 



Share this post

Link to post

There is no standard multi-calendar component in the VCL, so you would have to look around for a 3rd party solution, or just use the VCL's standard TDateTimePicker component alongside the TMonthCalendar, TCalendarView, or TCalendarPicker components.

Share this post

Link to post

TMS VCL UI Pack has a 'calendar group' component that does exactly this, with three months to a view.  I have used it and it works well.

  • Like 1

Share this post

Link to post

With https://www.delphihtmlcomponents.com/ the sky is the limit.


Just an example for selecting year/quartal/month/week/last 4 weeks/last 12 months/5 years


(of course, you have to build your own html/css/scripting, but the result is unique)



Edited by Attila Kovacs

Share this post

Link to post
2 hours ago, FLDelphi said:

Does anyone know of any Delphi analogs?

for select "a range of dates" is easy using the "TMonthCalendar" component by Delphi!

  • RAD Stuido 10.3.3 Arch in my test!


image.thumb.png.ca487621afa0b749908666875d9ba7cf.png     image.thumb.png.6bf901c2f38696b27d2920e855412b4a.png




procedure TForm1.Button1Click(Sender: TObject);
  Memo1.Lines.Add(Format('Date Init: %s, Date End: %s', [ { }
    DateToStr(MonthCalendar1.Date),                       { }
    DateToStr(MonthCalendar1.EndDate)                     { }
    ])                                                    { }
  Memo1.Lines.Add(Format('How many day between 2 dates: %d', [ { }
    System.DateUtils.DaysBetween(                              { }
    MonthCalendar1.Date,                                       { }
    MonthCalendar1.EndDate)                                    { }
    ])                                                         { }

you can change the regular behaviour using its event handler, like this: for exemple use the "BoldDays" like your "mark-day-prefered" you see? later, just catch it for other use!

Called whenever a new month is displayed in the calendar. 
Use the OnGetMonthInfo event to initialize the display properties of a month. In particular, OnGetMonthInfo allows applications to bold individual days in the calendar (such as holidays). 
To specify that specific dates are to be bolded, use the BoldDays method to obtain a value that can be returned as the MonthBoldInfo parameter. 
For example, to bold the first and eighth days of every month that is displayed, call 

BoldDays([1,8], MonthBoldInfo);


Edited by Guest

Share this post

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now