Calendar

Calendar is used to display and input dates with a built-in calendar in order to facilitate input.

Calendar inserted in a GridPanel as seen in Lycia Form Designer:

Form XML code:

Theme element filter XML code:

CSS element selector code:

Inheritance diagram:

Most commonly used form properties:

classnames

century

dataType

fieldTable

noEntry

notNull

required

identifier

horizontalAlignment

verticalAlignment

maxSize

minSize

preferredSize

text

Most commonly used theme properties:

Background

Font

Fore Color

Associated 4gl syntax:

DISPLAY 

INPUT ↓

Associated ui methods:

create ↓

forName

Influence and behavior:

To add a calendar to your form, you

Step 1. Choose a Calendar from the widgets palette by left-clicking its icon.

Step 2. Select the place in the form where you want to put the Calendar.

Step 3. Left-click the selected spot (cell or sector) to place the Calendar there.

Step 4. The Calendar is now added to your form, and you can see it in the Structure view.

 

There are two ways to enter date to the calendar at runtime:

1. To type in the date from the keyboard.

2. To choose a date from a built-in calendar:

   

 

Here you can find out how to input data to a calendar using the INPUT statement, e.g.:

 

Date is input and displayed in the format specified in the DBDATE environment variable:

DBDATE value	MDY4/ (default)	MDY2-	DMY4.
runtime appearance

 

Here you can find out how to change the initial text displayed to the calendar in Lycia Form Designer:

Here you can find out how to change the text displayed to the calendar at runtime using ui methods or DISPLAY ... TO statement.

 

To apply a property to a calendar, set its value in the master or user theme, directly or using filters:

property applied in the user theme:

theme XML code:

runtime appearance:

 

In the example below, we use css to change the font characteristics for the calendar text:

 

You can use ui methods to manipulate calendars at runtime:

<var>.create() is used to create calendar:

LET c1= ui.Calendar.create("f1","rootContainer")

<var.>setFormat() is used to set the calendar format - is analogous to the format property (see the example program, calendar_ui):

CALL c1.setFormat("dd yy mm")

You can use the methods of the ui.Locale object - <var>.setCountry(), <var>.setDirection(), <var>.setLanguage(), and/or <var>.setVariant() - to set the locale for the calendar (see the example program, locale_ui):

You can also use ui methods to change the appearance of a calendar at runtime:

• <var>.SetBackground() for the element's background,
• <var>.SetFont() for the element's font, and
• <var>.setForeColor() for the element's font color.

 

You can specify the default appearance of a Calendar by setting different classes to the classNames property.

For example, the class leading-button changes the position of the picker button (for MD Lycia):

default (= trailing):

leading: