Skip to content

TTMSFNCWidgetTrendIndicator

TTMSFNCWidgetTrendIndicator

Introduction

TTMSFNCWidgetTrendIndicator displays a graph of Values and can accommodate a varying number of values, plotting them evenly distributed along the width. Hence, it is very convenient to display a trend.

Features

  • Flexible, can accommodate a varying count of values, automatically fitting them to the width
  • Ability to add the values directly in the Form Designer and in code
  • Option to display as a bar graph with a property to control the gap
  • Option to display a summary Value at the bottom along with a description text
  • Properties to customize the color and the stroke used to draw the graph or bars

Demo

A Demo is included in the source in a subfolder “Demo\WidgetTrendIndicator.” A screenshot is shown at the top above. The Demo generates random values to draw the graph. With each click of the button “Get Next Page Stats,” the values are changed randomly and the graph changes. Switch ON the “Show Bars” option to show a bar graph as in the screenshot.

TTMSFNCWidgetTrendIndicator1

Properties

Property name Description
Values contains the value items to plot the graph. Each item includes a Value property that you need to set. You can click the for the property in the Object Inspector to manage the values, to add, reorder or delete values. You can also expand the property in the Structure window of Delphi IDE to inspect the values.
GraphType sets the type of graph to show—gtLine or gtBar. The default value is gtLine.
GraphColor sets the stroke for the graph line or the edges of the bars in case of bar graph.
GraphFill sets the fill for the graph or the bars in case of bar graph.
Value sets the summary value shown at the bottom. Application uses its own criteria to set this summary value.
ValueFormat sets the format string to display the summary value text at the bottom.
ValueFont sets the font to display the summary value text at the bottom.
DescriptionText sets the Description Text shown below the summary value at the bottom.
DescriptionFont sets the font to display the DescriptionText.

Code Snippets

Fill Values

var
 v: TTMSFNCWidgetTrendValue; 
begin
  .
  TMSFNCWidgetTrendIndicator1.Values.BeginUpdate;
  try
    TMSFNCWidgetTrendIndicator1.Values.Clear;
    for I := 0 to 15 do
    begin
      v := TMSFNCWidgetTrendIndicator1.Values.Add;
      v.Value := ..avalue from application..
    end;
  finally
    TMSFNCWidgetTrendIndicator1.Values.EndUpdate; 
  end;

Set description text and a summary value

 TMSFNCWidgetTrendIndicator1.DescriptionText := 'Page Views';
 TMSFNCWidgetTrendIndicator1.Value := 24358; 

Change the type of the graph

 TMSFNCWidgetTrendIndicator1.GraphType := gtBar;
Or,

 TMSFNCWidgetTrendIndicator1.GraphType := gtLine;