TTMSFNCPlanner

Introduction

The TMS FNC Planner offers a wide range of features to enhance your planning and scheduling applications. From simple person PIM applications to schedulers of activities for a group of persons, time planning for resources such as hotel rooms, car rental, university courses and so much more.

It is built from the ground up with a very high customizability and supports a set of predefined single-resource views such as day time view, day period view, half-day period view, month view and multi-month view. A multi-resource view is available for day time view, day period view, half day period view and month view and finally for day view, there are also 2 mixed multi day / multi resource views.

The TMS FNC Planner is designed for use with Win32, Win64, Mac OS-X, Linux, iOS and Android operating systems.

Organization

Below is a quick overview of the most important elements in the planner. This guide will cover all elements in different chapters.

1) The timeline area, which displays a datetime range, set by ModeSettings.StartTime, TimeLine.DisplayStart and TimeLine.DisplayEnd. The timeline area can be set at the left and/or right side or at the top and/or bottom side depending on the orientation. The orientation can be changed with the OrientationMode property.

2) The Positions / Groups area, which displays the positions, set by Positions.Count. Depending on the mode, explained on the previous page, the positions can display datetime values and /or resources. Like the timeline, the positions / groups area can be displayed at all sides depending on the orientation mode.

3) Empty area, used for custom drawing / text.

4) Scrollbars, used to navigate through the planner. The positions /groups are stretched by default but can be configured to have a horizontal scrollbar as well. The scrollbars can be hidden to allow touch-only scrolling on mobile devices.

5) An item, that can be moved, resized and edited depending on the planner settings. Each item can have its own colors for various states and can stretch over multiple positions depending on the mode as explained on the previous page.

6) The grid / time slots area which is configured with the same settings as the timeline area. It displays the active and inactive datetime values and can be used to select a range of cells or navigate through the planner. The grid / time slots area display the current selection as well.

Modes

The planner supports a set of predefined modes. In this chapter, we will illustrate and show how you can configure each mode.

pmDay:

• Timeline: Displays the hours of a single day, customized with ModeSettings.StartTime, TimeLine.DisplayStart and TimeLine.DisplayEnd. Further customization can be done with the additional properties under the TimeLine property.

• Positions: Displays resources, added through the resources collection and based on the Positions.Count property. When no resources are added, the Positions are automatically given a predefined value.

pmDayPeriod:

• Timeline: Displays multiple days, customized with ModeSettings.StartTime and ModeSettings.EndTime.

• Positions: Displays resources, added through the resources collection and based on the Positions.Count property. When no resources are added, the Positions are automatically given a predefined value.

pmHalfDayPeriod:

• Timeline: Displays multiple half days, customized with ModeSettings.StartTime and ModeSettings.EndTime.

• Positions: Displays resources, added through the resources collection and based on the Positions.Count property. When no resources are added, the Positions are automatically given a predefined value.

pmMultiDay:

• Timeline: Displays the hours of multiple days, customized with ModeSettings.StartTime, TimeLine.DisplayStart and TimeLine.DisplayEnd. Further customization can be done with the additional properties under the TimeLine property.

• Positions: Displays multiple days based on the Positions.Count property.

pmMultiResDay:

• Timeline: Displays the hours of multiple days, customized with ModeSettings.StartTime, TimeLine.DisplayStart and TimeLine.DisplayEnd. Further customization can be done with the additional properties under the TimeLine property.

• Positions: Displays multiple resources for each day based on the Positions.Count property.

pmMultiDayRes:

• Timeline: Displays the hours of multiple days, customized with ModeSettings.StartTime, TimeLine.DisplayStart and TimeLine.DisplayEnd. Further customization can be done with the additional properties under the TimeLine property.

• Positions: Displays multiple days for each resource based on the Positions.Count property.

pmMonth:

• Timeline: Displays the days of a single month, customized with ModeSettings.StartTime, TimeLine.DisplayStart and TimeLine.DisplayEnd. Further customization can be done with the additional properties under the TimeLine property.

• Positions: Displays resources, added through the resources collection and based on the Positions.Count property. When no resources are added, the Positions are automatically given a predefined value.

pmMultiMonth:

• Timeline: Displays the days of multiple months, customized with ModeSettings.StartTime, TimeLine.DisplayStart and TimeLine.DisplayEnd. Further customization can be done with the additional properties under the TimeLine property.

• Positions: Displays multiple months based on the Positions.Count property.

pmCustom:

• Timeline: A custom set of automatically sorted datetime values added through the TMSFNCPlanner.CustomDatesTime property.

• Positions: Displays resources, added through the resources collection and based on the Positions.Count property. When no resources are added, the Positions are automatically given a predefined value.

TimeLine

Display configuration

The timeline displays a range of timeslots configured with the properties under TimeLine. The ModeSettings.StartTime is used to set the planner’s initial display start time and with the TimeLine.DisplayUnitFormat / TimeLine.DisplaySubUnitFormat the values that are displayed are formatted. The amount of units can be changed with the TimeLine.DisplayUnit property in combination with the TimeLine.DisplayUnitType property.

For the pmMultiDay, pmDay, pmMultiResDay and pmMultiDayRes modes a view of 24 hours is displayed with subunits every 30 minutes (TimeLine.DisplayUnit := 30 and TimeLine.DisplayUnitType := pduMinute). For the pmMonth and pmMultiMonth modes a view per day is shown (TimeLine.DisplayUnit := 1 and TimeLine.DisplayUnitType := pduDay).

Instead of the TimeLine.DisplayStart and TimeLine.DisplayEnd, the ModeSettings.EndTime is used in the pmHalfDayPeriod and pmDayPeriod modes, and these modes display a half day or a full day respectively. The TimeLine.DisplayUnit, TimeLine.DisplayUnitOffset, TimeLine.DisplayUnitType and TimeLine.DisplayUnitOffsetType do not have any effect on these modes.

The displayed time range can be changed with the TimeLine.DisplayStart and TimeLine DisplayEnd properties. Below are some samples that demonstrate how these properties are used.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmDay;
TMSFNCPlanner1.TimeLine.DisplayUnit := 10;
TMSFNCPlanner1.TimeLine.DisplayUnitType := pduMinute;
TMSFNCPlanner1.TimeLine.DisplayStart := 0;
TMSFNCPlanner1.TimeLine.DisplayEnd := 143;
TMSFNCPlanner1.EndUpdate;

The above code changes the range to display a timeslot every 10 minutes for a full 24 hour range for a single day. The TimeLine.DisplayStart property remains 0, the TimeLine.DisplayEnd value is set to 143 which is based on the following calculation:

Round(MinsPerDay / TMSFNCPlanner1.TimeLine.DisplayUnit) - 1;

The TimeLine.DisplayStart is 0 which displays the initial ModeSettings.StartTime at midnight til midnight of the next day (24 hour range). Below is a sample that changes this to start at 11 PM til 1 PM. (2 hour range). The below code applies this to a pmMultiDay mode and shows how to calculate the TimeLine.DisplayStart and TimeLine.DisplayEnd. Additionally it applies formatting to the units and increases the size of the timeline.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmMultiDay;
TMSFNCPlanner1.TimeLine.DisplayUnit := 10;
TMSFNCPlanner1.TimeLine.DisplayUnitType := pduMinute;
TMSFNCPlanner1.TimeLine.DisplayStart := Round((MinsPerHour * 11) /
TMSFNCPlanner1.TimeLine.DisplayUnit);
TMSFNCPlanner1.TimeLine.DisplayEnd := Round((MinsPerHour * 13) /
TMSFNCPlanner1.TimeLine.DisplayUnit) - 1;
TMSFNCPlanner1.TimeLine.DisplayUnitFormat := 'h AMPM';
TMSFNCPlanner1.TimeLineAppearance.LeftSize := 80;
TMSFNCPlanner1.EndUpdate;

In the pmDay mode the TimeLine.DisplayEnd property doesn’t have a single day limitation, since the days are continuously displayed along the timeline. After the 24 hour mark of the initial ModeSettings.StartTime, the timeline continues to display the next day. In the pmMultiDay, pmMultiResDay and pmMultiDayRes modes however, the range is limited to display maximum 24 hours. The initial ModeSettings.StartTime is displayed in the first position, the next day in the next position, etc…

The range can be displayed with an offset. The properties TimeLine.DisplayUnitOffset and TimeLine.DisplayUnitOffsetType are used for this purpose. Below is a sample that applies an additional offset of 5 minutes to the pmDay sample code.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmDay;
TMSFNCPlanner1.TimeLine.DisplayUnit := 10;
TMSFNCPlanner1.TimeLine.DisplayUnitType := pduMinute;
TMSFNCPlanner1.TimeLine.DisplayStart := 0;
TMSFNCPlanner1.TimeLine.DisplayEnd := 143;
TMSFNCPlanner1.TimeLine.DisplayOffset := 5;
TMSFNCPlanner1.TimeLine.DisplayOffsetType := pduMinute;
TMSFNCPlanner1.EndUpdate;

The pmMonth and pmMultiMonth modes are similar to the pmDay and pmMultiDay modes except the range shows all the days for a single month in pmMonth mode and a range from 1 to 31 for the pmMultiMonth mode. The first month in pmMultiMonth mode is displayed in the first position, the next month in the next position.

The difference between pmMultiMonth and pmMultiDay mode is that the TimeLine.DisplayUnit, TimeLine.DisplayUnitOffset, TimeLine.DisplayUnitType and TimeLine.DisplayUnitOffsetType do not have any effect.

The pmCustom mode is based on a public generic TList of TDateTime values (property CustomDateTimes). The timeline configuration is limited to the TimeLine.DisplayUnitFormat property. Below is a sample that demonstrates how to configure a custom timeline.

Additionally it changes the unit size with the TimeLine.DisplayUnitSize property. This is used to change the height / width of a time slot depending on the orientation.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmCustom;
dt := Int(Now);
TMSFNCPlanner1.CustomDateTimes.Add(dt + EncodeTime(3, 0, 0, 0));
TMSFNCPlanner1.CustomDateTimes.Add(dt + EncodeTime(7, 0, 0, 0));
TMSFNCPlanner1.CustomDateTimes.Add(dt + 1 + EncodeTime(5, 0, 0, 0));
TMSFNCPlanner1.CustomDateTimes.Add(dt + 1 + EncodeTime(7, 0, 0, 0));
TMSFNCPlanner1.CustomDateTimes.Add(dt + 2 + EncodeTime(3, 0, 0, 0));
TMSFNCPlanner1.CustomDateTimes.Add(dt + 2 + EncodeTime(21, 0, 0, 0));
TMSFNCPlanner1.TimeLineAppearance.LeftSize := 160;
TMSFNCPlanner1.TimeLine.DisplayUnitSize := 75;
TMSFNCPlanner1.EndUpdate;

Appearance

The look and feel of the timeline can be changed with the TimeLineAppearance properties. These properties can be used for the timeline that is placed left and/or right or top and or bottom in horizontal mode. Below is a sample that configures the timeline to change the font, font color and fill of a timeslot as well as showing the timeline at the left and right of the planner.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmDay;
TMSFNCPlanner1.TimeLineAppearance.Layouts := [ptlLeft, ptlRight];
TMSFNCPlanner1.TimeLineAppearance.LeftFontColor := gcSteelblue;
TMSFNCPlanner1.TimeLineAppearance.LeftFill.Color := gcAliceblue;
TMSFNCPlanner1.TimeLineAppearance.LeftFill.Kind := TBrushKind.Solid;
TMSFNCPlanner1.TimeLineAppearance.RightFontColor := gcOrangered;
TMSFNCPlanner1.TimeLineAppearance.RightFill.Color := gcGreenyellow;
TMSFNCPlanner1.TimeLineAppearance.RightFill.Kind := TBrushKind.Solid;
TMSFNCPlanner1.TimeLineAppearance.RightFont.Family := 'Broadway';
TMSFNCPlanner1.TimeLineAppearance.RightSubUnitFontSize := 10;
TMSFNCPlanner1.EndUpdate;

Positions / Resources

Display configuration

The positions area is designed for multiple purposes. In pmDay, pmHalfDayPeriod, pmDayPeriod, pmMonth and pmCustom the positions area displays the resources, which are added through the Resources collection. When no resources exist, the planner automatically uses a default resource. In these modes, the position to resource and resource to position conversion is one on one.

In pmMultiDay and pmMultiMonth modes, the Resources are not used, instead the configuration of the timeline is no longer limited to the timeline area, but also stretches along the positions area. This view is capable of displaying multiple days / months in multiple positions, where the previous modes where only capable of display a single day / month or a day / month that continuously runs along the timeline.

The special modes that combine resources and multiple days are the pmMultiResDay and pmMultiDayRes modes. Additionally, these modes also make use of the Groups that are explained in a separate chapter. The positions that are drawn are set with Positions.Count as demonstrated in the sample below.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmDay;
TMSFNCPlanner1.Positions.Count := 7;
TMSFNCPlanner1.EndUpdate;

The planner has 3 resources (“BMW / “Mercedes” / “Audi”) by default. As seen in the screenshot, those default resources are displayed for the first 3 positions. The positions count has been set to 7, and the planner will automatically set a default resource for the remaining positions. To add more resources, use the following code:

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmDay;
TMSFNCPlanner1.Positions.Count := 7;
TMSFNCPlanner1.Resources.Add.Text := 'Land Rover';
TMSFNCPlanner1.Resources.Add.Text := 'Mini';
TMSFNCPlanner1.Resources.Add.Text := 'Ferrari';
TMSFNCPlanner1.Resources.Add.Text := 'Porsche';
TMSFNCPlanner1.EndUpdate;

Using the Resources collection is not obligatory. You can also dynamically set resources by implementing the OnGetPositionText event.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmDay;
TMSFNCPlanner1.Positions.Count := 4;
TMSFNCPlanner1.Resources.Clear;
TMSFNCPlanner1.EndUpdate;

procedure TForm1.TMSFNCPlanner1GetPositionText(Sender: TObject;
 APosition: Integer; AKind: TTMSFNCPlannerCacheItemKind; var AText:
string);
begin
 AText := 'Sample Resource ' + inttostr(APosition);
end;

When switching to pmMultiDay or pmMultiMonth mode on a default planner you will notice that the resources will no longer be used. Instead the positions represent days / months respectively. The formatting of the days / months representation is automatically determined by the mode, but can be overriden with the Positions.Format property.

The modes pmMultiResDay and pmMultiDayRes combine both resources and days in the positions / groups area. The initial positions count is set with the property Positions.Count and the Resources collection is filled with resource items. In pmMultiResDay the resources are drawn in the positions area, and the days in the groups area and for the pmMultiDayRes vice versa. In all other modes, the groups area is used for grouping of resources through the Groups collection, which is explained in the next chapter.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmMultiResDay;
TMSFNCPlanner1.Positions.Count := 6;
TMSFNCPlanner1.EndUpdate;

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmMultiDayRes;
TMSFNCPlanner1.Positions.Count := 6;
TMSFNCPlanner1.EndUpdate;

Appearance

The appearance of the positions area is similar to the timeline area, and is found under PositionsAppearance. Below is a sample that demonstrates this property set.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmMultiDay;
TMSFNCPlanner1.Positions.Format := 'dd/mm/yyy';
TMSFNCPlanner1.PositionsAppearance.TopFontColor := gcBlue;
TMSFNCPlanner1.PositionsAppearance.TopFont.Size := 18;
TMSFNCPlanner1.PositionsAppearance.TopFill.Color := gcLightskyblue;
TMSFNCPlanner1.PositionsAppearance.TopFill.Kind := TBrushKind.Solid;
TMSFNCPlanner1.PositionsAppearance.Layouts := [pplTop, pplBottom];
TMSFNCPlanner1.EndUpdate;

Groups

Display configuration

As explained in the previous chapter, groups are used in pmMultiResDay and pmMultiDayRes to indicate days or resources. In all other modes, the groups are only visible in combination with the Groups collection. A group indicates a series of resources. Groups are always placed above (top layout) or below (bottom layout) positions. Below is a sample that demonstrates this.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmDay;
TMSFNCPlanner1.Positions.Count := 7;
TMSFNCPlanner1.Resources.Add.Text := 'Ferrari';
TMSFNCPlanner1.Resources.Add.Text := 'Porsche';
TMSFNCPlanner1.Resources.Add.Text := 'Land Rover';
TMSFNCPlanner1.Resources.Add.Text := 'Jeep';
grp := TMSFNCPlanner1.Groups.Add;
grp.Text := 'Exceptional Cars';
grp.StartPosition := 0;
grp.EndPosition := 2;
grp := TMSFNCPlanner1.Groups.Add;
grp.Text := 'Super Cars';
grp.StartPosition := 3;
grp.EndPosition := 4;
grp := TMSFNCPlanner1.Groups.Add;
grp.Text := 'Offroad Cars';
grp.StartPosition := 5;
grp.EndPosition := 6;
TMSFNCPlanner1.EndUpdate;

Appearance

Similar to the positions appearance, the appearance of the groups can be found under GroupsAppearance. The groups can be placed at the top and / or bottom side in vertical mode and the left and / or right side in horizontal mode. Below is a screenshot that shows the groups / positions and timeline in full layout mode in both directions.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmDay;
TMSFNCPlanner1.Positions.Count := 7;
TMSFNCPlanner1.Resources.Add.Text := 'Ferrari';
TMSFNCPlanner1.Resources.Add.Text := 'Porsche';
TMSFNCPlanner1.Resources.Add.Text := 'Land Rover';
TMSFNCPlanner1.Resources.Add.Text := 'Jeep';
grp := TMSFNCPlanner1.Groups.Add;
grp.Text := 'Exceptional Cars';
grp.StartPosition := 0;
grp.EndPosition := 2;
grp := TMSFNCPlanner1.Groups.Add;
grp.Text := 'Super Cars';
grp.StartPosition := 3;
grp.EndPosition := 4;
grp := TMSFNCPlanner1.Groups.Add;
grp.Text := 'Offroad Cars';
grp.StartPosition := 5;
grp.EndPosition := 6;
TMSFNCPlanner1.PositionsAppearance.Layouts := [pplTop, pplBottom];
TMSFNCPlanner1.TimeLineAppearance.Layouts := [ptlLeft, ptlRight];
TMSFNCPlanner1.GroupsAppearance.Layouts := [pglTop, pglBottom];
TMSFNCPlanner1.EndUpdate;

Vertical mode (TMSFNCPlanner1.OrientationMode := pomVertical)

Horizontal mode (TMSFNCPlanner1.OrientationMode := pomHorizontal)

Full Days Area

Display configuration

Items who are marked as a full day item, will be displayed in this area. The full day area (and full day items) is only supported in pmDay, pmMultiDay, pmMultiDayRes and pmMultiResDay mode. The full days area is always placed above (top layout) or below (bottom layout) positions. Below is a sample that demonstrates this.

var
 it: TTMSFNCPlannerItem;
begin
 TMSFNCPlanner1.BeginUpdate;
 TMSFNCPlanner1.Items.Clear;
 TMSFNCPlanner1.Mode := pmMultiDay;
 it := TMSFNCPlanner1.Items.Add;
 it.StartTime := Int(Now);
 it.EndTime := Int(Now);
 it.FullDay := True;
 TMSFNCPlanner1.EndUpdate;TMSFNCPlanner1.EndUpdate;

Appearance

Similar to the positions appearance, the appearance of the full days area can be found under FullDaysAppearance. The full days area can be placed at the top and / or bottom side in vertical mode and the left and / or right side in horizontal mode. Below is a screenshot that shows the groups / positions and timeline in full layout mode in both directions.

var
 it: TTMSFNCPlannerItem;
 grp: TTMSFNCPlannerGroup;
begin
 TMSFNCPlanner1.BeginUpdate;
 TMSFNCPlanner1.Items.Clear;
 it := TMSFNCPlanner1.AddItem(Now, IncHour(Now, 4));
 it.FullDay := True;
 it.Title := 'This is a full day item';
 TMSFNCPlanner1.Mode := pmDay;
 TMSFNCPlanner1.Positions.Count := 7;
 TMSFNCPlanner1.Resources.Add.Text := 'Ferrari';
 TMSFNCPlanner1.Resources.Add.Text := 'Porsche';
 TMSFNCPlanner1.Resources.Add.Text := 'Land Rover';
 TMSFNCPlanner1.Resources.Add.Text := 'Jeep';
 grp := TMSFNCPlanner1.Groups.Add;
 grp.Text := 'Exceptional Cars';
 grp.StartPosition := 0;
 grp.EndPosition := 2;
 grp := TMSFNCPlanner1.Groups.Add;
 grp.Text := 'Super Cars';
 grp.StartPosition := 3;
 grp.EndPosition := 4;
 grp := TMSFNCPlanner1.Groups.Add;
 grp.Text := 'Offroad Cars';
 grp.StartPosition := 5;
 grp.EndPosition := 6;
 TMSFNCPlanner1.PositionsAppearance.Layouts := [pplTop, pplBottom];
 TMSFNCPlanner1.TimeLineAppearance.Layouts := [ptlLeft, ptlRight];
 TMSFNCPlanner1.GroupsAppearance.Layouts := [pglTop, pglBottom];
 TMSFNCPlanner1.FullDaysAppearance.Layouts := [pfdlTop, pfdlBottom];
 TMSFNCPlanner1.EndUpdate;

Vertical mode (TMSFNCPlanner1.OrientationMode := pomVertical)

Horizontal mode (TMSFNCPlanner1.OrientationMode := pomHorizontal)

Grid

Display configuration

The area between the timeline and the positions area is the grid area. The grid area is scrollable (depending on the positions and timeline configuration), and shows the items (events) along with the active, inactive and disabled time slot values. The inactive time slots can be configured with the TimeLine.ActiveStart and TimeLine.ActiveEnd and the ModeSettings.InactiveDays properties. The grid also displays the current selected timeslots in a different appearance. The Interaction chapter explains more about selection settings in the grid.

Appearance

The grid appearance can be changed under the GridCellAppearance property. Below is a sample that changes the inactive days and changes the inactive fill for the pmMultiMonth mode.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmMultiMonth;
TMSFNCPlanner1.GridCellAppearance.InActiveFill.Color :=
gcDarkseagreen;
TMSFNCPlanner1.ModeSettings.InActiveDays := [padMonday, padTuesday,
padFriday];
TMSFNCPlanner1.EndUpdate;

The selection is drawn with a fill that can be changed under SelectionAppearance.

Current time indication

The timeline and the grid area are capable of displaying the current machine/device time. By default, the current time is set to show a line in both grid & timeline areas. The code below shows how to set the start time, configure the timeline to show units of 10 minutes and initialize the planner start view to the hour mark of the current time.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.ModeSettings.StartTime := Now;
TMSFNCPlanner1.TimeLine.DisplayUnit := 10;
TMSFNCPlanner1.TimeLine.CurrentTimeMode := pctmLine;
TMSFNCPlanner1.TimeLine.DisplayEnd := Round(MinsPerDay /
TMSFNCPlanner1.TimeLine.DisplayUnit) - 1;
TMSFNCPlanner1.EndUpdate;
TMSFNCPlanner1.TimeLine.ViewStart :=
Int(TMSFNCPlanner1.ModeSettings.StartTime) +
EncodeTime(HourOf(TMSFNCPlanner1.ModeSettings.StartTime), 0, 0, 0);

Setting the TimeLine.CurrentTimeMode to pctmText will display text in the timeline area instead. The current time indication can have a different color under TimeLineAppearance.CurrentTimeColor. Further customization can be done with one of the many custom drawing events, which is explained in the Customization chapter.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.ModeSettings.StartTime := Now;
TMSFNCPlanner1.TimeLine.DisplayUnit := 20;
TMSFNCPlanner1.TimeLine.DisplayUnitSize := 50;
TMSFNCPlanner1.TimeLine.CurrentTimeMode := pctmText;
TMSFNCPlanner1.TimeLineAppearance.CurrentTimeColor := gcBlue;
TMSFNCPlanner1.TimeLine.DisplayEnd := Round(MinsPerDay /
TMSFNCPlanner1.TimeLine.DisplayUnit) - 1;
TMSFNCPlanner1.EndUpdate;
TMSFNCPlanner1.TimeLine.ViewStart :=
Int(TMSFNCPlanner1.ModeSettings.StartTime) +
EncodeTime(HourOf(TMSFNCPlanner1.ModeSettings.StartTime), 0, 0, 0);

Items (events)

When dropping a new instance of the planner (TTMSFNCPlanner) on the form, you will notice it already has a default item. The item has a title and text area and its position within the grid is based on the StartTime, EndTime and Resource properties. The text area supports HTML formatted text including hyperlink detection. In the pmMultiDay, pmMultiMonth modes, the items can stretch over multiple positions depending on the StartTime and EndTime. In the pmDay, pmHalfDayPeriod, pmDayPeriod, pmMonth and pmCustom modes, the position is set with the Resource property. The pmMultiDayRes and pmMultiResDay modes combine all three properties to position its items.

The planner has a DefaultItem property that can be used to preset item property settings that will be applied to all new created items. Adding items can be done with Items.Add or with one of the AddOrUpdateItem overload functions. Below are some samples that demonstrate this in various modes.

The first sample shows the default view for the pmDay mode, displays three resources and adds an item for each resource. Additionally, it initializes the view scrolling position to a specific datetime value.

dt := Int(Now);
TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmDay;
TMSFNCPlanner1.ModeSettings.StartTime := dt;
TMSFNCPlanner1.Items.Clear;
TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(12, 0, 0, 0), dt +
EncodeTime(14, 30, 0, 0), 'New Car', 'Presenting the new BMW
i8').Resource := 0;
TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(16, 30, 0, 0), dt +
EncodeTime(18, 30, 0, 0), 'Presentation', 'Presentation on the
Mercedes SLS 65 AMG').Resource := 1;
TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(14, 0, 0, 0), dt +
EncodeTime(15, 30, 0, 0), 'Meeting', 'Meeting to show the new Audi
A3').Resource := 2;
TMSFNCPlanner1.EndUpdate;
TMSFNCPlanner1.TimeLine.ViewStart := dt + EncodeTime(10, 0, 0, 0);

Note that the AddOrUpdateItem function returns an item reference and the Resource property is set to 0, 1 and 2 respectively. If we would add items without setting the Resource property, the items would all be placed on the first position.

If we now change this to pmMultiDay mode, you will notice that all items will be on the same position. Since all items are added on the same day through the StartTime and EndTime properties.

If we want to change the position of the Mercedes “Presentation” item to Saturday and the Audi “Meeting” item to Sunday, we need to increase the StartTime and EndTime with 1 and 2 days respectively. The sample below demonstrates this.

dt := Int(Now);
TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmMultiDay;
TMSFNCPlanner1.ModeSettings.StartTime := dt;
TMSFNCPlanner1.Items.Clear;
TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(12, 0, 0, 0), dt +
EncodeTime(14, 30, 0, 0), 'New Car', 'Presenting the new BMW i8');
TMSFNCPlanner1.AddOrUpdateItem(dt + 1 + EncodeTime(16, 30, 0, 0), dt +
1 + EncodeTime(18, 30, 0, 0), 'Presentation', 'Presentation on the
Mercedes SLS 65 AMG');
TMSFNCPlanner1.AddOrUpdateItem(dt + 2 + EncodeTime(14, 0, 0, 0), dt +
2 + EncodeTime(15, 30, 0, 0), 'Meeting', 'Meeting to show the new Audi
A3');
TMSFNCPlanner1.EndUpdate;
TMSFNCPlanner1.TimeLine.ViewStart := dt + EncodeTime(10, 0, 0, 0);

The items are now shown in a similar way as pmDay mode, but with the difference that they are not linked to any resource, but instead are placed in the position that displays the day.

As explained in the beginning of this chapter, the item can stretch over multiple positions in some modes. When we change the code to allow an item to have an EndTime that ends on the next day, we get an item that is stretched over 2 positions. Important to know is that the item repeats the title and text for every position it is stretched on. When we change the ViewStart property to scroll to the beginning of the display, you will notice the BMW item will be drawn in the same day as the Mercedes item, which starts at a later time. Below is a sample that demonstrates this.

dt := Int(Now);
TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmMultiDay;
TMSFNCPlanner1.ModeSettings.StartTime := dt;
TMSFNCPlanner1.Items.Clear;
TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(12, 0, 0, 0), dt + 1 +
EncodeTime(14, 30, 0, 0), 'New Car', 'Presenting the new BMW i8');
TMSFNCPlanner1.AddOrUpdateItem(dt + 1 + EncodeTime(16, 30, 0, 0), dt +
1 + EncodeTime(18, 30, 0, 0), 'Presentation', 'Presentation on the
Mercedes SLS 65 AMG');
TMSFNCPlanner1.AddOrUpdateItem(dt + 2 + EncodeTime(14, 0, 0, 0), dt +
2 + EncodeTime(15, 30, 0, 0), 'Meeting', 'Meeting to show the new Audi
A3');
TMSFNCPlanner1.EndUpdate;
TMSFNCPlanner1.TimeLine.ViewStart := dt + EncodeTime(10, 0, 0, 0);

The pmDayPeriod, pmHalfDayPeriod, pmMonth, pmMultiMonth and pmCustom modes can use the same approach as the pmDay and pmMultiDay mode samples in this chapter, but with different settings of StartTime and EndTime.

As explained, the pmMultiResDay and pmMultiDayRes modes combine the StartTime, EndTime and Resource properties into a single view. Below is a sample that demonstrates this. To display all items we will need to increase the positions count.

dt := Int(Now);
TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmMultiResDay;
TMSFNCPlanner1.ModeSettings.StartTime := dt;
TMSFNCPlanner1.Items.Clear;
TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(12, 0, 0, 0), dt + 1 +
EncodeTime(14, 30, 0, 0), 'New Car', 'Presenting the new BMW
i8').Resource := 0;
TMSFNCPlanner1.AddOrUpdateItem(dt + 1 + EncodeTime(16, 30, 0, 0), dt +
1 + EncodeTime(18, 30, 0, 0), 'Presentation', 'Presentation on the
Mercedes SLS 65 AMG').Resource := 1;
TMSFNCPlanner1.AddOrUpdateItem(dt + 2 + EncodeTime(14, 0, 0, 0), dt +
2 + EncodeTime(15, 30, 0, 0), 'Meeting', 'Meeting to show the new Audi
A3').Resource := 2;
TMSFNCPlanner1.Positions.Count := 9;
TMSFNCPlanner1.EndUpdate;
TMSFNCPlanner1.TimeLine.ViewStart := dt + EncodeTime(10, 0, 0, 0);

Note how the BMW item still stretches over multiple positions, but keeps displaying in the same resource. The other items are placed on Saturday and Sunday in their respective resource. When we change to the other mode pmMultiDayRes, we get a different view.

The BMW item is stretched over multiple days, but the days are repeated for each resource in this mode.

Default item

The DefaultItem property can be used to completely preset how an item should look and feel before adding it. Below is a sample that demonstrates this on one of the previous samples.

dt := Int(Now);
TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmDay;
TMSFNCPlanner1.ModeSettings.StartTime := dt;
TMSFNCPlanner1.Items.Clear;
TMSFNCPlanner1.DefaultItem.ShowTitle := False;
TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(12, 0, 0, 0), dt +
EncodeTime(14, 30, 0, 0), 'New Car', 'Presenting the new BMW
i8').Resource := 0;
TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(16, 30, 0, 0), dt +
EncodeTime(18, 30, 0, 0), 'Presentation', 'Presentation on the
Mercedes SLS 65 AMG').Resource := 1;
TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(14, 0, 0, 0), dt +
EncodeTime(15, 30, 0, 0), 'Meeting', 'Meeting to show the new Audi
A3').Resource := 2;
TMSFNCPlanner1.EndUpdate;
TMSFNCPlanner1.TimeLine.ViewStart := dt + EncodeTime(10, 0, 0, 0);

The sample code sets the ShowTitle property of the DefaultItem to False. Each item that is created takes over the DefaultItem settings.

HTML formatted text

The item text area is capable of displaying HTML formatted text with hyperlink detection. As soon as HTML tags are detected, the text will be rendered in HTML. Below is a sample that demonstrates this.

TMSFNCPlanner1.Items[0].Title := 'HTML formatted text';
TMSFNCPlanner1.Items[0].Text := '<u><font
color="#FF0000">Necessities</font></u> <br><ul><li>Notebook<li>Digital
lineout<li>Model artwork</ul><br><br><a
href="http://www.tmssoftware.com">http://www.tmssoftware.com</a>';

Full Day Items

A planner item has a start date/time & end date/time, and this item is displayed in the planner visible item area, which is determined by the mode, resources and the date/time settings. Even when an item exceeds 24 hours and has more than one full day, the item will be displayed with multiple segments in the default item behavior. To make that item a real full day item and represent it in a different way, the FullDay property can be set to True. Let’s take a look at an example.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Items.Clear;
it := TMSFNCPlanner1.AddItem(Now, IncHour(Now, 4));
it.Title := 'This is a full day item';
TMSFNCPlanner1.EndUpdate;

You can see the item is now only a couple of hours long. Let’s make it display more than a day in length:

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Items.Clear;
it := TMSFNCPlanner1.AddItem(Now, IncDay(Now, 2));
it.Title := 'This is a full day item';
TMSFNCPlanner1.EndUpdate;

Immediately, the item takes on the whole screen, which consists of three days displaying on a timeline of 24 hours. Adding another item to the screen, taking the initial example, will then calculate the conflicts between items taking the same space. The following sample demonstrates this.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Items.Clear;
it := TMSFNCPlanner1.AddItem(Now, IncHour(Now, 4));
it.Title := 'This is a normal item';
it := TMSFNCPlanner1.AddItem(Now, IncDay(Now, 2));
it.Title := 'This is a full day item';
TMSFNCPlanner1.EndUpdate;

To make the most of the available space, we can now set the property FullDay of the planner item to true, which will draw the item in the reserved area for full day items, which is actually only visible when the calculations detect an item to be valid for that area.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Items.Clear;
it := TMSFNCPlanner1.AddItem(Now, IncHour(Now, 4));
it.Title := 'This is a normal item';
it := TMSFNCPlanner1.AddItem(Now, IncDay(Now, 2));
it.Title := 'This is a full day item';
it.FullDay := True;
TMSFNCPlanner1.EndUpdate;

A full day item can be selected, it only shows the title, and can only be updated with the built-in dialog. The item cannot be moved or resized. By default the full days area will automatically resize to the amount of items, based on the settings in the FullDaysAppearance property.

Item Linking

A planner item can be linked in various ways to another planner item. Linking two items means that if the user will move or size one item, the linked item can also move or size, depending on the link type. A link is a relationship between two items. It is not possible to link one item to more than one other item but chained linking is possible, even circular chained linking. Linking is achieved through 2 planner item properties:

TTMSFNCPlannerItem.LinkedItem: TTMSFNCPlannerItem; defines to which the item is linked TTMSFNCPlannerItem.LinkType: TTMSFNCPlannerItemLinkType; defines the type of the link

The LinkType can be:

name	Description
iltFull	both StartTime and EndTime are linked. This means that item duration is always synchronised between the items. When the item moves or sizes, both begin and end of the linked item will do the same move or size.
iltStartEnd	StartTime of the item is linked to the EndTime of the linked item. This means that if the StartTime of the item changes, the EndTime of the linked item will change with the same delta
iltEndStart	EndTime of the item is linked to the StartTime of the linked item
iltEndEnd	EndTime of the item is linked to the EndTime of the linked item
iltStartStart	StartTime of the item is linked to the StartTime of the linked item
iltNone	the items are linked but in a loose relationship. This means that moving or sizing of linked items will not affect the size or position of other items.

With linked items, it is possible that when selecting one item in a chain of linked items, all linked items will become selected automatically. To enable this, set Planner.Interaction.MultiSelect = True and Planner.Interaction.AutoSelectLinkedItems = true.

Example:

var
 dt: TDateTime;
 it1, it2: TTMSFNCPlannerItem;
begin
 TMSFNCPlanner1.BeginUpdate;
 TMSFNCPlanner1.Items.Clear;
 TMSFNCPlanner1.Mode := pmMultiResDay;
 dt := Int(Now);
it1 := TMSFNCPlanner1.AddItem(dt + EncodeTime(10, 0, 0, 0), dt +
EncodeTime(12, 0, 0, 0));
 it1.Title := 'Sample';
 it1.Resource := 0;
 it2 := TMSFNCPlanner1.AddItem(dt + EncodeTime(8, 0, 0, 0), dt +
EncodeTime(10, 30, 0, 0));
 it2.Title := 'Linked Item';
 it2.Resource := 1;

 it1.LinkedItem := it2;
 it1.LinkType := iltFull;

TMSFNCPlanner1.ViewRow := 14;
TMSFNCPlanner1.Interaction.MultiSelect := True;
TMSFNCPlanner1.Interaction.AutoSelectLinkedItems := True;
TMSFNCPlanner1.EndUpdate;
end;

Some additional methods are available on Planner level to facilitate handling item linking:

procedure LinkItems(AItems: TTMSFNCPlannerLinkedItemArray; ACircular: Boolean = false;
ALinkType: TTMSFNCPlannerItemLinkType = ltLinkNone);

Sets up a link between all items in the array. By default, this is a chained link from item 0 in the array to the last item. When parameter ACircular = true, a circular chained link is created. The last parameter sets the link type.

procedure LinkItems(AItems: TTMSFNCPlannerLinkedItemArray);

Breaks the link between all items in the array.

procedure SelectedLinkedItems(AItem: TTMSFNCPlannerItem)

Selects all items that are linked (in chain) to AItem

function FindItemLinkedTo(AItem: TTMSFNCPlannerItem): TTMSFNCPlannerItem;

Returns the item that is linked to APlannerItem.

Optionally, the Planner can also visually show linked items by drawing an interconnection line between linked items. This featured is enabled by setting Planner.ItemsAppearance.ShowLinks = true. The color of the interconnection line between two items is set by PlannerItem.LinkColor.

Example:

var
 dt: TDateTime;
 it1, it2: TTMSFNCPlannerItem;
begin
 TMSFNCPlanner1.BeginUpdate;
 TMSFNCPlanner1.Items.Clear;
 TMSFNCPlanner1.Mode := pmMultiResDay;
 dt := Int(Now);
 it1 := TMSFNCPlanner1.AddItem(dt + EncodeTime(10, 0, 0, 0), dt +
EncodeTime(12, 0, 0, 0));
 it1.Title := 'Sample';
 it1.Resource := 0;
 it1.ActiveColor := gcPurple;
 it1.SelectedColor := gcPurple;
 it1.SelectedLinkColor := gcPurple;
 it2 := TMSFNCPlanner1.AddItem(dt + EncodeTime(8, 0, 0, 0), dt +
EncodeTime(10, 30, 0, 0));
 it2.Title := 'Linked Item';
 it2.Resource := 2;
 it2.ActiveColor := gcPurple;
 it2.SelectedColor := gcPurple;
 it2.SelectedLinkColor := gcPurple;
 it1.LinkedItem := it2;
 it1.LinkType := iltFull;
 TMSFNCPlanner1.ItemsAppearance.ShowLinks := True;
 TMSFNCPlanner1.Interaction.AutoSelectLinkedItems := True;
 TMSFNCPlanner1.Interaction.MultiSelect := True;
 TMSFNCPlanner1.ViewRow := 14;
TMSFNCPlanner1.EndUpdate;
end;

Overlapping items

Items that are placed at the same position at the same time interval are overlapping items. Overlapping is enabled by default for all items and can be turned off globally with the property ModeSettings.OverlappableItems. Each item has a property Overlappable which can be used to control per item if the item is overlappable or not. If the items overlap, they contain a list of conflicts and conflict positions. As the item can be stretched over multiple positions, the count of conflicts can be retrieved by passing the position as a parameter to the ConflictsForPosition function on item level. Below is a sample that demonstrates this.

 TMSFNCPlanner1.BeginUpdate;
 TMSFNCPlanner1.Mode := pmDay;
 TMSFNCPlanner1.Items.Clear;
 dt := Int(Now);
 TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(14, 0, 0, 0), dt +
EncodeTime(15, 35, 0, 0) , 'Item 1', 'Notes');
 TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(13, 45, 0, 0), dt +
EncodeTime(16, 10, 0, 0) , 'Item 2', 'Notes');
 TMSFNCPlanner1.TimeLine.CurrentTimeMode := pctmNone;
 TMSFNCPlanner1.EndUpdate;
 TMSFNCPlanner1.TimeLine.ViewStart := dt + EncodeTime(12, 30, 0, 0);

The AItem.ConflictsForPosition(0) will return 2 for the first and the third item. The second item will have 3 conflicts. To know the position of the item if it has a conflict is to use the AItem.ConflictsPosForPosition function.

In the above sample, moving the items is possible, but by setting the overlappable property to false for an item, that particular item is not overlappable. An item that might possibly have a conflict with an item that is not overlappable will not be able to move to that position. The item that is not overlappable can be moved anywhere since all the other items are overlappable.

Note that while the planner will control that with the user moving items, the rules for overlap will be respected, the planner does not perform checks when programmaticalyl inserting items. If an item cannot be programmatically created because it would overlap with an existing non-overlappable item, this should be checked at application level and when and appropriate warning should be given to the user for the reason the item cannot be created.

Appearance

The overall appearance of the item can be set with the ItemsAppearance properties. The ItemsAppearance properties define the kind of fill / stroke that is used for various states (which are explained in the Interaction chapter).

Each item has color and font properties for the title and text area for different states. Each state has its own set of properties. By default the item takes over the default color settings from the DefaultItem property, but after the items are added, the items can be further customized. We take the first pmDay sample again, which shows three items placed on different resources. The AddOrUpdateItem returns a reference to the newly created item. In this sample we define a TTMSFNCPlannerItem variable and then set the Color, FontColor and TitleFontColor for each item.

dt := Int(Now);
TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmDay;
TMSFNCPlanner1.ModeSettings.StartTime := dt;
TMSFNCPlanner1.Items.Clear;
it := TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(12, 0, 0, 0), dt + EncodeTime(14, 30, 0, 0), 'New Car', 'Presenting the new BMW i8');
it.Resource := 0;
it.Color := gcLightSteelBlue;
it.FontColor := gcWhite;
it.TitleFontColor := gcWhite;
it := TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(16, 30, 0, 0), dt + EncodeTime(18, 30, 0, 0), 'Presentation', 'Presentation on the Mercedes SLS 65 AMG');
it.Resource := 1;
it.Color := gcLightblue;
it.FontColor := gcBlack;
it.TitleFontColor := gcBlack;
it := TMSFNCPlanner1.AddOrUpdateItem(dt + EncodeTime(14, 0, 0, 0), dt + EncodeTime(15, 30, 0, 0), 'Meeting', 'Meeting to show the new Audi A3');
it.Resource := 2;
it.Color := gcSilver;
it.FontColor := gcGreen;
it.TitleFontColor := gcGreen;
TMSFNCPlanner1.EndUpdate;
TMSFNCPlanner1.TimeLine.ViewStart := dt + EncodeTime(10, 0, 0, 0);

In the Interaction chapter, you will see that each item has a normal, disabled, selected and active state. The properties in this sample are based on the normal state, but other properties can be used to give the item a unique look and feel for all states.

Interaction

Items

We continue with the previous sample, which shows three items in pmDay mode. The planner supports selection, moving and sizing of items. These interaction modes can be configured per item. Each item has a Movable, Sizeable and Selectable property. When we click on the BMW item, you will notice it changes the color settings to the active state. The item also shows a move and size helper which can be used to change the position, start and end time of the item. On mobile devices, the move and size helper areas are replaced with customizable arrows as seen in the screenshots below:

Desktop

Mobile

The behavior of sizing and moving can be changed with the Interaction.SizeMode and Interaction.MoveMode properties. In mobile mode, sizing is done by clicking and dragging the arrows and moving is done by tapping and holding the finger down on an item. You will notice the sizing or moving operation is active when 2 additional helper controls are visible that indicate the start and end time of the item. These helper controls are optional.

In desktop mode, moving and sizing can also be done with the keyboard. The arrow keys can be used to move the item and the shift key to size the end time of the item. The start time can be changed by arrow key and holding the ctrl key in combination with the shift key.

Selection / navigation

When clicking next to the item, on the grid area, the item will be unselected again. Selection and navigation can be done with the mouse / finger and keyboard (desktop only). On mobile operating systems, a single timeslot selection can be done by tapping. On desktop operating system, the same operating can be done with the mouse.

On mobile operating systems, tapping and holding the finger down will start a range selection. On desktop operating systems, the same keyboard shift, ctrl and arrow keys combination can be used to move the selection or change the selection range.

Inserting new items

As demonstrated in the Items chapter, items can be added with Items.Add or with one of the AddOrUpdateItem overloads. Adding items can also be done after selecting a range of cells with the mouse or the finger, or when pressing insert on the keyboard. By default this way of adding items is disabled but can be enabled by changing the Interaction.MouseInsertMode and Interaction.KeyboardInsertMode. If the Interaction.MouseInsertMode is pmimAfterSelection, the item will be added immediately after a selection is made. If the Interaction.MouseInsertMode is pmimDialogAfterSelection, a built-in dialog is presented before the item is added. The dialog offers a way to customize the item before it is inserted at the selected timeslot range. The same action applies to the Interaction.KeyboardInsertMode after pressing the insert key. Below is a sample that adds a new item in both modes.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Interaction.KeyboardInsertMode := pkimSelection;
TMSFNCPlanner1.Interaction.MouseInsertMode := pmimAfterSelection;
TMSFNCPlanner1.EndUpdate;

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Interaction.KeyboardInsertMode := pkimSelectionDialog;
TMSFNCPlanner1.Interaction.MouseInsertMode :=
pmimDialogAfterSelection;
TMSFNCPlanner1.EndUpdate;

The dialog can also be used for updating items, which is explained in the Editing chapter.

Editing

Editing can be done in several ways, with the mouse / finger and the keyboard. The properties under Interaction are set to allow editing by default. Clicking or tapping a second time on an active item will start editing. Editing can also be started by pressing F2 or Enter on the keyboard. To stop editing, click next to the item or press F2 again on the item. By default, a built-in TMemo is shown in the area of the item.

The editor can be changed to the built-in editor dialog as we have shown in the previous chapter when insert a new item.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Interaction.UpdateMode := pumDialog;
TMSFNCPlanner1.EndUpdate;

For each action, be it sizing, moving, selection or editing an event is triggered. An explanation of each event / property / function and procedure that can be used to further customize the planner and to handle interaction / editing actions can be found under the Properties, Events and Procedures and functions chapters.

Custom Dialog

Based on the previous method of editing an item via a built-in editor, the planner is capable of assigning a form based on a default class, which is predefined in the planner classes. The property to use is called CustomItemEditorForm;, which is a public property and is asking for a class of type TTMSFNCPlannerCustomItemEditorForm, which is the base class inheriting from TForm. When designing a custom item editing form, you can write

type
  TForm1 = class(TTMSFNCPlannerCustomItemEditorForm)
    procedure FormCreate(Sender: TObject);
  private
    { Private declarations }
  public
    { Public declarations }
    procedure Initialize; override;
  end;

and then use TForm1 as a class to assign to the CustomItemEditorForm property.

TMSFNCPlanner1.CustomItemEditorForm := TForm1;

What will happen is, when the editing mode is dialog for either updating existing or inserting new items, TForm1 will be instantiated and shown modally. When the planner instantiates TForm1, the abstract virtual Initialize method will be called, which is a requirement when implementing the TTMSFNCPlannerCustomItemEditorForm class. The custom editor form class also brings properties predefined based on the information coming from the item, or when a new item is being created. This way, you can update your components custom designed on the form based on these properties. The properties that can be accessed are

PlannerMode: TTMSFNCPlannerEditingMode;
PlannerItem: TTMSFNCPlannerItem; (read only)
Planner: TTMSFNCCustomPlanner; (read only)
PlannerEndTime: TDateTime;
PlannerStartTime: TDateTime;
PlannerResource: Integer;
PlannerTitle: string;
PlannerText: string;
PlannerFullDay: Boolean;

Except for the read only properties, these properties can also be set. This is important to make sure the item gets updated afterwards. To close the dialog while accepting the changes, call TTMSFNCPlanner.StopEditing;, to cancel the changes call TTMSFNCPlanner.CancelEditing;.

Databinding

The planner supports databinding through a non-visual component called TTMSFNCPlannerDatabaseAdapter. As with the other adapters (explained in the ‘Demos’ chapter) it is a simple as connecting the adapter to the planner, filling in the database fields and set the Active property to True.

Below is a screenshot and sample code how binding is done at designtime and at runtime.

TMSFNCPlanner1.Adapter := TMSFNCPlannerDatabaseAdapter1;
 TMSFNCPlannerDatabaseAdapter1.Item.DataSource := DataSource1;
 TMSFNCPlannerDatabaseAdapter1.Item.DBKey := 'Id';
 TMSFNCPlannerDatabaseAdapter1.Item.StartTime := 'StartTime';
 TMSFNCPlannerDatabaseAdapter1.Item.EndTime := 'EndTime';
 TMSFNCPlannerDatabaseAdapter1.Item.Title := 'Title';
 TMSFNCPlannerDatabaseAdapter1.Item.Text := 'Text';
 TMSFNCPlannerDatabaseAdapter1.Item.Resource := 'Resource';
 TMSFNCPlannerDatabaseAdapter1.Item.Recurrency := 'Recurrency';

After filling the mandatory (DBKey, StartTime and EndTime) and optional fields the planner will automatically load the items from the dataset and display the items that are visible in the current configuration. The items can be re-loaded at any time using TMSFNCPlannerDatabaseAdapter1.LoadItems for instance when the starttime of the planner is changed.

The planner database adapter also supports item recurrency. When adding a new or editing an existing item, the (optional) built-in editor dialog is triggered with a replacement for the content. This replacement is coming from the TTMSFNCPlannerItemEditorRecurrency component that can be connected to the ItemEditor property of the planner. When starting the application after everything is setup, the custom editor appears after editing an item.

Customization

The planner is highly customizable. There are a lot of events that you can use for further customization, such as changing the color of a specific timeslot, adding an icon to an item, dynamically changing the formatting of the positions, customize the built-in or inplace editor, etc... Below are some samples that demonstrate these events.

Setting a specific inactive timeslot

The properties for setting a timeslot inactive is by adding or removing a value in the ModeSettings.InactiveDays set or, in some modes, by changing the TimeLine.ActiveStart and TimeLine.ActiveEnd. This behaviour is shared for all timeslots. What if you want to set an additional timeslot inactive? The OnIsDateTimeInactive event can be used to accomplish this. In this sample, we take the pmMultiMonth mode, which clearly demonstrates the inactive timeslot state.

As you can see in the above screenshot, the inactivedays are set with the ModeSettings.InactiveDays property and by default limited to Saturday and Sunday. If we want to add for example the 7th of May as inactive day, we use the following code:

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.Mode := pmMultiMonth;
TMSFNCPlanner1.Interaction.ShowSelection := False;
TMSFNCPlanner1.EndUpdate;
procedure TForm1.TMSFNCPlanner1IsDateTimeInActive(Sender: TObject;
 ADateTime: TDateTime; APosition: Integer; var AInActive: Boolean);
begin
 AInActive := AInActive or (CompareDate(ADateTime, EncodeDate(2015,
5, 7)) = EqualsValue);
end;

As you can see, the 7 th of May is set to an inactive state. If we want to change the color for a specific cell we can use the OnBeforeDrawCell event and change the fill settings. If we apply this to the above sample, we can color the 7th of May which is inactive.

procedure TForm1.TMSFNCPlanner1BeforeDrawCell(Sender: TObject;
 AGraphics: TGraphics; ARect: TRectF; ACol, ARow: Integer;
AStartTime,
 AEndTime: TDateTime; APosition: Integer; AKind:
TTMSFNCPlannerCacheItemKind;
 var AAllow, ADefaultDraw: Boolean);
begin
 if CompareDate(AStartTime, EncodeDate(2015, 5, 7)) = EqualsValue
then
 AGraphics.Fill.Color := gcOrange;
end;

Adding an icon to an item based on the conflict state

When adding items that overlap, you might need to show a notification that they are overlapping. This sample adds 2 overlapping items and custom draws an additional icon in the lower left corner to indicate the item is in conflict with another item. To do this, we add a TTMSFNCBitmapContainer instance on the form. Below is the code that demonstrates this. Comparing this to the previous sample, we do not want to change the default drawing, but want to add an additional element after the item is drawn. The difference here is that we make use of the OnAfterDrawItem event.

TMSFNCPlanner1.BeginUpdate;
TMSFNCPlanner1.items.Clear;
TMSFNCPlanner1.DefaultItem.Title := 'Sample';
TMSFNCPlanner1.DefaultItem.Text := 'Notes';
it := TMSFNCPlanner1.Items.Add;
it.StartTime := Now + EncodeTime(1, 0, 0, 0);
it.EndTime := Now + EncodeTime(3, 0, 0, 0);
it := TMSFNCPlanner1.Items.Add;
it.StartTime := Now;
it.EndTime := Now + EncodeTime(2, 0, 0, 0);
TMSFNCPlanner1.EndUpdate;
procedure TForm1.TMSFNCPlanner1AfterDrawItem(Sender: TObject;
AGraphics: TGraphics;
 ARect: TRectF; AItem: TTMSFNCPlannerItem);
var
 bmp: TBitmap;
 rbmp: TRectF;
begin
 if AItem.ConflictsForPosition(0) > 1 then
 begin
 bmp := TMSFNCBitmapContainer1.FindBitmap('warning');
 if Assigned(bmp) then
 begin
 rbmp := RectF(ARect.Right - 26, ARect.Bottom - 26, ARect.Right -
2, ARect.Bottom - 2);
 AGraphics.DrawBitmap(bmp, RectF(0, 0, bmp.Width, bmp.Height),
rbmp, 1);
 end;
 end;
end;

As soon as we move the item so it is not in conflict with the other item, the icons will disappear.

Changing the color for a specific timeline unit

The appearance of the timeline can be changed with the TimeLineAppearance properties. The appearance of the units and subunits are the same for all timeslots except for the font size. The sample below is demonstrating how to change the font color of the current time timeslot.

procedure TForm1.TMSFNCPlanner1BeforeDrawTimeText(Sender: TObject;
 AGraphics: TGraphics; ARect: TRectF; AValue: Double; ARow: Integer;
 ASubUnit: Boolean; AKind: TTMSFNCPlannerCacheItemKind; AText:
string;
 var AAllow: Boolean);
var
 du: TDateTime;
begin
 du := EncodeTime(0, 30, 0, 0);
if (CompareDateTime(AValue, Now) = LessThanValue) and
(CompareDateTime(AValue + du, Now) = GreaterThanValue) then
 AGraphics.Fill.Color := gcRed;
end;

Demos

Overview

The overview demo demonstrates the most important elements of the planner.

• HTML rendering in the positions area and the item text area.
• Changing the appearance of an item.
• Custom drawing
• Styling of the timeline, positions and groups area.
• Navigation through the different modes.

Properties

Property name	Description
ActiveItem	Gets or Sets the Active Item.
Adapter	Property to connect to an instance of TTMSFNCPlannerAdapter.
BitmapContainer	A container that contains a set of images to be used in combination with HTML drawing.
CustomDateTimes	Property to add datetime values when the mode is set to pmCustom. The
values that are added will automatically be sorted.
DefaultItem	The default item that is applied when creating a new item in the planner either programmatically or at runtime through the planner interaction. These properties also apply to all items that are created, which are not repeated in this table for the items collection.
GridCellAppearance	The appearance of the cells (timeslots) in the planner.
Groups	A collection of custom groups that are added on top or at the bottom relative to the positions. In multi resource / multi day mode the groups are replaced by days or resources but the appearance of the groups is applied.
GroupsAppearance	The appearance of the groups.
HorizontalScrollBarVisible	Sets whether the horizontal scrollbar is visible or not.
Interaction	The interaction options of the planner.
ItemEditor	Property to connect to an instance of TTMSFNCPlannerItemEditor for replacing the built-in editor dialog content with custom content.
Items	The items collection, the explanation of the properties of the item can be found under the DefaultItem property in this table.
ItemsAppearance	The general appearance of the item.
ModeSettings	The initial settings to configure the planner.
OrientationMode	The orientation of the planner. The default mode is vertical. In horizontal mode the planner automatically rotates text and applies the opposite settings from vertical mode where necessary.
Positions	The positions in the planner.
PositionsAppearance	The appearance of the positions.
Resources	A collection combined with items in views that support resources. Each resource has a text and a name property to uniquely identify each resource.
SelectedItems	Returns a list of selected items when the planner is configured for multiselect. This list also includes the active item.
Selection	Read-only property to retrieve the current selection cell range. The selection can set with the method TMSFNCPlanner.SelectCells(AStartCell, AEndCell: TTMSFNCPlannerCell);
SelectionAppearance	The Appearance of the selection.
TimeLine	The settings of the timeline.
TimeLineAppearance	The appearance of the timeline.
VerticalScrollBarVisible	Sets whether the vertical scrollbar is visible or not.
ViewCol / ViewRow	Properties to initialize the first visible Column and Row. Can be used in combination with TimeLine.ViewStart and Positions.ViewStart.

Events

Event name	Description
OnAfterDeleteItem	Event called after an item is deleted.
OnAfterDrawBottomNavigationButton	Event called after a bottom navigation button is drawn.
OnAfterDrawCell	Event called after the cell is drawn.
OnAfterDrawCellHorizontalLine	Event called after the horizontal line in a cell is drawn.
OnAfterDrawCellVerticalLine	Event called after the vertical line in a cell is drawn.
OnAfterDrawCurrentTimeInGrid	Event called after the current time indication is drawn in the grid.
OnAfterDrawCurrentTimeInTimeLine	Event called after the current time indication is drawn in the timeline.
OnAfterDrawDeleteArea	Event called after the delete area in desktop mode is drawn.
OnAfterDrawGroup	Event called after a group is drawn.
OnAfterDrawGroupEmptySpace	Event called after the empty space next to the group area is drawn.
OnAfterDrawGroupText	Event called after the group text is drawn.
OnAfterDrawItem	Event called after an item is drawn.
OnAfterDrawItemHelper	Event called after an item helper is drawn.
OnAfterDrawItemHelperText	Event called after an item helper text is drawn.
OnAfterDrawItemText	Event called after an item text is drawn.
OnAfterDrawItemTitle	Event called after an item title is drawn.
OnAfterDrawItemTitleText	Event called after an item title text is drawn.
OnAfterDrawMoveArea	Event called after the move area in desktop mode is drawn.
OnAfterDrawPosition	Event called after a position is drawn.
OnAfterDrawPositionEmptySpace	Event called after an empty space next to the position area is drawn.
OnAfterDrawPositionText	Event called after a position text is drawn.
OnAfterDrawSizeArea	Event called after the size area in desktop mode is drawn.
OnAfterDrawTime	Event called after a time is drawn.
OnAfterDrawTimeStroke	Event called after a time stroke is drawn.
OnAfterDrawTimeText	Event called after a time text is drawn.
OnAfterDrawTopNavigationButton	Event called after a top navigation button is drawn.
OnAfterInsertItem	Event called after an item is inserted.
OnAfterMoveItem	Event called after an item is moved.
OnAfterNavigateToDateTime	Event called after the planner is navigated to a new datetime through the navigation buttons or through the swipe gesture.
OnAfterOpenInplaceEditor	Event called after the inplace editor is opened.
OnAfterOpenInsertDialog	Event called after the built-in editor dialog is shown in insert mode for a new item.
OnAfterOpenUpdateDialog	Event called after the built-in editor dialog is shown in update mode for an existing item.
OnAfterSelectItem	Event called after an item is selected.
OnAfterSizeItem	Event called after an item is sized.
OnAfterUpdateItem	Event called after an item is updated through the in place editor or built-in editor dialog.
OnBeforeDeleteItem	Event called before an item is deleted.
OnBeforeDrawBottomNavigationButton	Event called before a bottom navigation button is drawn.
OnBeforeDrawCell	Event called before the cell is drawn.
OnBeforeDrawCellHorizontalLine	Event called before the horizontal line in a cell is drawn.
OnBeforeDrawCellVerticalLine	Event called before the vertical line in a cell is drawn.
OnBeforeDrawCurrentTimeInGrid	Event called before the current time indication is drawn in the grid.
OnBeforeDrawCurrentTimeInTimeLine	Event called before the current time indication is drawn in the timeline.
OnBeforeDrawDeleteArea	Event called before the delete area in desktop mode is drawn.
OnBeforeDrawGroup	Event called before a group is drawn.
OnBeforeDrawGroupEmptySpace	Event called before the empty space next to the group area is drawn.
OnBeforeDrawGroupText	Event called before the group text is drawn.
OnBeforeDrawItem	Event called before an item is drawn.
OnBeforeDrawItemHelper	Event called before an item helper is drawn.
OnBeforeDrawItemHelperText	Event called before an item helper text is drawn.
OnBeforeDrawItemText	Event called before an item text is drawn.
OnBeforeDrawItemTitle	Event called before an item title is drawn.
OnBeforeDrawItemTitleText	Event called before an item title text is drawn.
OnBeforeDrawMoveArea	Event called before the move area in desktop mode is drawn.
OnBeforeDrawPosition	Event called before a position is drawn.
OnBeforeDrawPositionEmptySpace	Event called before an empty space next to the position area is drawn.
OnBeforeDrawPositionText	Event called before a position text is drawn.
OnBeforeDrawSizeArea	Event called before the size area in desktop mode is drawn.
OnBeforeDrawTime	Event called before a time is drawn.
OnBeforeDrawTimeStroke	Event called before a time stroke is drawn.
OnBeforeDrawTimeText	Event called before a time text is drawn.
OnBeforeDrawTopNavigationButton	Event called before a top navigation button is drawn.
OnBeforeInsertItem	Event called before an item is inserted.
OnBeforeMoveItem	Event called before an item is moved.
OnBeforeNavigateToDateTime	Event called before the planner is navigated to a new datetime through the navigation buttons or through the swipe gesture.
OnBeforeOpenInplaceEditor	Event called before the inplace editor is opened.
OnBeforeOpenInsertDialog	Event called before the built-in editor dialog is shown in insert mode for a new item.
OnBeforeOpenUpdateDialog	Event called before the built-in editor dialog is shown in update mode for an existing item.
OnBeforeSelectItem	Event called before an item is selected.
OnBeforeSizeItem	Event called before an item is sized.
OnBeforeUpdateItem	Event called before an item is updated through the in place editor or built-in editor dialog.
OnCloseInplaceEditor	Event called when the inplace editor is closed.
OnCloseInsertDialog	Event called when the built-in editor is closed after inserting a new item.
OnCloseUpdateDialog	Event called when the built-in editor is closed after updating an existing item.
OnCustomPanelToItem	Event called when the editor dialog is closed and the contents will be transferred to the item.
OnGetCustomContentPanel	Event called when the editor dialog is created and asks for the content panel for a particular item.
OnGetGroupText	Event called when the group text is retrieved.
OnGetInplaceEditor	Event called before the inplace editor is created, to customize the built-in editor for each item.
OnGetItemHelperText	Event called when the helper text for an item is retrieved.
OnGetItemText	Event called when the item text is retrieved.
OnGetItemTitleText	Event called when the item title text is retrieved.
OnGetPositionText	Event called when the position text is retrieved.
OnGetTimeText	Event called when the time text is retrieved.
OnHasDateTimeSub	Event called to determine if the current mode supports drawing of sub datetime values.
OnHScroll	Event called when the planner scrolls horizontally.
OnIsDateTimeDisabled	Event called to retrieve which datetime value is inactive.
OnIsDateTimeInActive	Event called when an anchor is clicked inside an item text.
OnIsDateTimeSub	Event called to determine if a datetime value is a sub value or not.
OnIsItemDeletable	Event called to determine if an item is deletable.
OnItemAnchorClick	Event called when a time slot is being selected.
OnItemChanged	Event called when the item is updated after moving, sizing and editing.
OnItemToCustomPanel	Event called when the editor dialog is being opened and the data of the item will be transferred to the content panel.
OnSelectCell	Event called when the selected cell range has changed
OnSelectingCell	Event called when the selected cell range is changing.
OnSelectingTime	Event called when a time slot is selected.
OnSelectTime	Event called when the planner is scrolled vertically
OnVScroll	Event called when the planner scrolls vertically.
StretchScrollBars (public)	When true: stretches the scrollbars to the total height / width of the planner. When false (default): the scrollbars are limited to the grid area.

Procedures and functions

Planner

name	Description
AddOrUpdateItem(…): TTMSFNCPlannerItem + overloads	Adds a new or updates an existing item with the parameters passed through this function. Returns the item that has been created or updated.
ApplyDefaultStyle	Applies the default style to the planner.
CancelEditing	Stops editing the active item and cancels the changes.
CellToDateTime(ACell: TTMSFNCPlannerCell): TDateTime	Converts the cell to a datetime value.
CellToEndDateTime(ACell: TTMSFNCPlannerCell): TDateTime	Converts the cell to an end datetime value.
CellToStartDateTime(ACell: TTMSFNCPlannerCell): TDateTime	Converts the cell to a start datetime value.
CloseEditingDialog(ACancel: Boolean)	Closes the editing dialog and commits or cancels the changes made to the active item.
CloseEditingDialogAndRemoveItem	Closes the editing dialog when the dialog is active and removes the item. This action is triggered from the Remove button in the lower left corner of the dialog.
DateTimeToCell(ADateTime: TDateTime; AEndDateTime: Boolean = False): TTMSFNCPlannerCell	Converts the datetime value to a cell.
DateTimeToPosition(ADateTime: TDateTime; AEndDateTime: Boolean = False; ACheckBounds: Boolean = True): Integer	Converts a datetime value to a position. Additional parameters can be passed to limit the value within the scrollable area or to get the value as an end datetime instead of a start date time.
DateTimeToValue(ADateTime: TDateTime; AEndDateTime: Boolean = False; ACheckBounds: Boolean = True): Double	Converts the datetime value to an x (horizontal orientation) or y (vertical orientation) pixel value. Additional parameters can be passed to limit the value within the scrollable area or to get the value as an end datetime instead of a start date time.
EditItem(AItem: TTMSFNCPlannerItem)	Start editing an item. Depending on the properties, inplace editing or dialog editing will be started.
FindFirstItem(AStartTime, AEndTime: TDateTime; APosition: Integer): TTMSFNCPlannerItem	Returns the first item with a specific start time, end time and position.
FindGroupByName(AName: String): TTMSFNCPlannerGroup	Returns a group with a specific name.
FindGroupIndexByName(AName: String): Integer	Returns a group index with a specific name.
FindItemWithDBKey(ADBKey: String): TTMSFNCPlannerItem	Returns the item with a specific DBKey property.
FindNextItem(AStartTime, AEndTime: TDateTime; APosition: Integer): TTMSFNCPlannerItem Returns the next item with a specific start time, end time and position based on the results of the FindFirstItem.
FindResourceByName(AName: String): TTMSFNCPlannerResource	Returns a resource with a specific name.
FindResourceIndexByName(AName: String): Integer	Returns a resource index with a specific name.
GetEditingDialog(AItemIndex: Integer = -1): TTMSFNCPlannerEditingDialog	Returns the editing dialog for further customization, optionally based on the item index.
GetEndTimeSizeHandler: TTMSFNCPlannerSizeHandler	Returns the end time size handler for further customization in case mobile sizing is used.
GetHintPopup: TTMSFNCPlannerHintPopup	Returns the item hint popup for further customization.
GetInplaceEditor: TTMSFNCPlannerInplaceEditor	Returns the inplace editor for further customization.
GetStartTimeSizeHandler: TTMSFNCPlannerSizeHandler	Returns the start time size handler for further customization in case mobile sizing is used.
HasItem(AStartTime, AEndTime: TDateTime; APosition: Integer; ACompareWithItemIndex: Integer = -1; ACheckOverlap: Boolean = True): Boolean	Returns a Boolean if the planner has another item within a specific position. Additional parameters can be used to compare with a specific item and check if an item overlaps without checking the ModeSettings.OverlappableItems property or the Overlappable property per item.
InitSample	Initializes a sample with 3 resources and 1 item.
IsCellDisabled(ACell: TTMSFNCPlannerCell): Boolean	Returns a Boolean if the cell is disabled. This converts the cell to a datetime and uses the same approach as the IsDateTimeDisabled function.
IsCellInActive(ACell: TTMSFNCPlannerCell): Boolean	Returns a Boolean if the cell is inactive. This converts the cell to a datetime and uses the same approach as the IsDateTimeInactive function.
IsDateTimeDisabled(ADateTime: TDateTime; APosition: Integer = -1): Boolean	Returns a Boolean if the datetime that is passed as a parameter is disabled. The disabled state is determined automatically and can be overridden in the OnIsDateTimeDisabled event.
IsDateTimeInActive(ADateTime: TDateTime; APosition: Integer = -1): Boolean	Returns a Boolean if the datetime that is passed as a paremeter is inactive. The inactive state is determined through the ModeSettings.InActiveDays and the TimeLine.ActiveStart and TimeLine.ActiveEnd properties. The state can be overridden by the OnIsDateTimeInActive event.
IsEditing: Boolean	Returns a Boolean to indicate the planner is in edit mode.
IsValidItem(AItem: TTMSFNCPlannerItem): Boolean	Returns a Boolean whether the item is valid or not. A valid item is an item that lies within the display start time and display end time and within the defined resources.
ItemToEndCell(AItem: TTMSFNCPlannerItem): TTMSFNCPlannerCell	Returns the end cell of the item.
ItemToStartCell(AItem: TTMSFNCPlannerItem): TTMSFNCPlannerCell;	Returns the start cell of the item.
Navigate(ACell: TTMSFNCPlannerCell; AForceScroll: Boolean = False)	Navigate to a specific cell in range and optionally force the actual scrolling position to the cell.
NavigateToNextDateTime	Navigates to the next datetime depending on the mode.
NavigateToPreviousDateTime	Navigates to the previous datetime depending on the mode.
OpenEditingDialog(AStartTime, AEndTime: TDateTime; AResource: Integer, ATitle, AText: String; AUpdateItem: Integer = -1)	Opens the editing dialog programmatically with a set of initialization parameters and the ability to start as an insert dialog or an update dialog with the AUpdateItem parameter.
PositionToDateTime(APosition: Integer): TDateTime	Converts a position to a datetime value.
PositionToResource(APosition: Integer): Integer	Returns the resource for a specific position.
ResourceToPosition(AResource: Integer): Integer	Returns the position for a specific resource.
RestoreScrollPosition	Restores the previous vertical and horizontal scroll position. Needs to be combined with SaveScrollPosition.
SaveScrollPosition	Saves the current vertical and horizontal scroll position. Needs to be combined with RestoreScrollPosition.
SelectCells(AStartCell, AEndCell: TTMSFNCPlannerCell)	Select and navigate to a range of cells.
SelectedEndDateTime	Returns the datetime of the selected end cell.
SelectedResource	Returns the resource of the selected cell.
SelectedStartDateTime	Returns the datetime of the selected start cell.
SelectItem(AItem: TTMSFNCPlannerItem)	Selects a specific item and makes it active.
SelectItem(AItemIndex: Integer)	Selects a specific item through the item index and makes it active.
SelectItems(AItems: TTMSFNCPlannerItemArray)	Selects a range of items.
SelectNextItem: TTMSFNCPlannerItem	Selects the next item.
SelectPreviousItem: TTMSFNCPlannerItem	Selects the previous item.
StopEditing	Stops editing the active item and commits the changes.
ValueToDateTime(AValue: Double; APosition: Integer = -1): TDateTime;	Converts an x (horizontal orientation) or y (vertical orientation) pixel value to a datetime value.
XYToCacheItem(X, Y: Double): TTMSFNCPlannerCacheItem	Returns the cached item at X and Y. An Item can consist of multiple rectangles (if the item stretches over multiple columns due to the time difference between start time and end time). Each rectangle represents a cache.
XYToCell(X, Y: Double): TTMSFNCPlannerCell	Returns the cell at X and Y.
XYToCell(X, Y: Double): TTMSFNCPlannerCell	Returns a cell at X and Y.
XYToItem(X, Y: Double): TTMSFNCPlannerItem	Returns the item at X and Y regardless of how many rectangles are drawn.
XYToItemAnchor(AItem: TTMSFNCPlannerItem; X, Y: Single)	Returns the anchor at X and Y for a specific item.
XYToTime(X, Y: Double): TTMSFNCPlannerTime	Returns the time at X and Y.

Item

name	Description
ConflictsForPosition(APosition: Integer): Integer	Returns the count of conflicts for a specific position. The item can be stretched over multiple positions depending on the mode.
ConflictsPosForPosition(APosition: Integer): Integer	Returns the conflict position for a specific position. The item can be stretched over multiple positions depending on the mode.
GetFirstRect: TRectF	The first rectangle of the item.
GetLastRect: TRectF	The last rectangle of the item.
GetRect(AIndex: Integer = -1): TRectF	Returns the rectangle of the item, if multiple rectangles are present due to stretching of the item over multiple positions, the AIndex parameter can be used to retrieve the rectangle of choice. The index of the rectangle lies within the count of rectangles retrieved with the RectCount function.
RectCount: Integer	The count of rectangles of an item.

TMS Mini HTML rendering engine

Another core technology used among many components is a small fast & lightweight HTML rendering engine. This engine implements a subset of the HTML standard to display formatted text. It supports following tags :

B : Bold tag

<B> : start bold text
</B> : end bold text

Example : This is a test

U : Underline tag

<U> : start underlined text
</U> : end underlined text

Example : This is a test

I : Italic tag

<I> : start italic text
</I> : end italic text

Example : This is a test

S : Strikeout tag

<S> : start strike-through text
</S> : end strike-through text

Example : This is a test

A : anchor tag <A href="value"> : text after tag is an anchor. The 'value' after the href identifier is the anchor. This can be an URL (with ftp,http,mailto,file identifier) or any text. If the value is an URL, the shellexecute function is called, otherwise, the anchor value can be found in the OnAnchorClick event </A> : end of anchor

Examples : This is a test

This is a test

This is a test FONT : font specifier tag

<FONT face='facevalue' size='sizevalue' color='colorvalue' bgcolor='colorvalue'> : specifies font of text after tag. with

• face : name of the font
• size : HTML style size if smaller than 5, otherwise pointsize of the font
• color : font color with either hexidecimal color specification or color constant name, ie gcRed,gcYellow,gcWhite ... etc
• bgcolor : background color with either hexidecimal color specification or color constant name </FONT> : ends font setting

Examples: This is a test This is a test

P : paragraph

<P align="alignvalue" [bgcolor="colorvalue"] [bgcolorto="colorvalue"]> : starts a new paragraph, with left, right or center alignment. The paragraph background color is set by the optional bgcolor parameter. If bgcolor and bgcolorto are specified, a gradient is displayed ranging from begin to end color. </P> : end of paragraph

Example :

This is a test

Example :

This is a test

Example :

This has a red background

Example :

This has a yellow background

Example :

This has a gradient background

*

HR : horizontal line

<HR> : inserts linebreak with horizontal line

BR : linebreak

<BR> : inserts a linebreak

BODY : body color / background specifier <BODY bgcolor="colorvalue" [bgcolorto="colorvalue"] [dir="v|h"] background="imagefile specifier"> : sets the background color of the HTML text or the background bitmap file

Example : : sets background color to yellow

<BODY background="file://c:\test.bmp"> : sets tiled background to file test.bmp
<BODY bgcolor="gcYellow" bgcolorto="gcWhite" dir="v"> : sets a vertical gradient from yellow to white

IND : indent tag
This is not part of the standard HTML tags but can be used to easily create multicolumn text <IND x="indent"> : indents with "indent" pixels Example : This will be indented 75 pixels.

IMG : image tag

<IMG src="specifier:name" [align="specifier"] [width="width"] [height="height"] [alt="specifier:name"]> : inserts an image at the location

specifier can be: name of image in a BitmapContainer

Optionally, an alignment tag can be included. If no alignment is included, the text alignment with respect to the image is bottom. Other possibilities are: align="top" and align="middle"

The width & height to render the image can be specified as well. If the image is embedded in anchor tags, a different image can be displayed when the mouse is in the image area through the Alt attribute.

Examples : This is an image

SUB : subscript tag

<SUB> : start subscript text
</SUB> : end subscript text 

Example : This is ⁹/₁₆ looks like 9/16

SUP : superscript tag

<SUP> : start superscript text
</SUP> : end superscript text

UL : list tag

<UL> : start unordered list tag
</UL> : end unordered list

Example :

<LI>List item 1
<LI>List item 2
<UL>
<LI> Sub list item A
<LI> Sub list item B
</UL>
<LI>List item 3
</UL>

LI : list item


<LI [type="specifier"] [color="color"] [name="imagename"]> <br>

New list item specifier can be "square", "circle" or "image" bullet. Color sets the color of the square or circle bullet. Imagename sets the PictureContainer image name for image to use as bullet


SHAD : text with shadow

<SHAD> : start text with shadow
</SHAD> : end text with shadow

Z : hidden text

<Z> : start hidden text
</Z> : end hidden text

Special characters Following standard HTML special characters are supported :

&lt; : less than : <

&gt; : greater than : >

&amp; : &

&quot; : "

&nbsp; : non breaking space

&trade; : trademark symbol

&euro; : euro symbol

&sect; : section symbol

&copy; : copyright symbol

&para; : paragraph symbol