Age: The Scripted Graphic Item

• Download the scripted item sample code - 960 B

Introduction

This article explains how to use ScriptAge to define a AGE graphic engine scripted item.

Background

AGE from release 1.4 introduces the ScriptedItem class and the concept of ScriptAge, a simple scripting language that lets you define a graphic item without the need for compiling it.

Now I'll explain how you can draw with a scripted item, and you'll see that it is really simple and funny. Let's go draw a little tree.

Step 1: What We Need

A ScriptedItem object in the canvas document.

// c#
using NeoDataType.Graphic;
...
ScriptedItem item = new ScriptedItem();
canvas1.Document = new GraphicDocument();
canvas1.Document.Add(item);

Assign script to the item.

item.Script = scriptText;

Step 2: The Script Text

I'll explain the ScriptAge syntax in the next paragraph, now let's see the code.

stroke: Ellipse
pen: green, 1!
brush: gradient, lightgreen, green, (.2; 0.4)(.7;.6)
points: (.2; 0.4)(.7;.6)

stroke: Curves, 0.5!
pen: brown, 1!
brush: gradient, gold, brown, (0.3; .5)(0.7; .5)
points: (.35; 1)(.42;.8)(.42; .3)(.5; .55)(.58; .3)(.58;.8)(.65; 1)

stroke: Ellipse
pen: green, 1!
brush: gradient, lightgreen, green, (.5; 0.2)(1;.6)
points: (.5; 0.2)(1;.55)

stroke: Ellipse
pen: green, 1!
brush: gradient, lightgreen, green, (0.2; 0)(.8;.5)
points: (0.2; 0)(.8;.5)

stroke: Ellipse
pen: green, 1!
brush: gradient, lightgreen, green, (0; .2)(.5; .5)
points: (0; 0.2)(.5;.5)

ScriptAge Syntax

The script engine works on commands with the following syntax:

token: param1[, param2[...]]

Parameters are comma separated and each token defines its own accepted parameters.

The recognized tokens are:

stroke: stroke_type, type_parameters_list

stroke_type can be one of the following string values:

• Ellipse
• Polygon
• Lines
• Curves
• Rectangle
• RoundRectangle (not implemented yet)
• Point
• Arc

pen: pen_color, pen_width
brush: brush_type, brush_parameters_list

brush_type can be one of the following string values:

• solid
• gradient

points: points_list

points_list is a list of one or more points defined as (x; y),
i.e. (0.1; 100!) (10#; .5) (0.5; 1)

All color values are read as HTML color codes.
This means that a color can be named, as red, green or blue or coded as #FF0000, #00FF00 or #0000FF.
Transparency can be added with two extra digits: #50FF0000.

All number values are read as stroke_number.

A stroke_number is a number defined as follows, where n is an arbitrary number:

For example, in the following image, the point Pb can be described as:

• (0.2; 0.4) x = 1/5 of item width and y = 2/5 of the item height
• (130!; 90!) x = 130 pixels from canvas origin and y = 90 pixels from canvas origin
• (30#; 40#) x = 30 pixels from item origin and y = 40 pixels from item origin

Note that the resulting value of a stroke_number in the notation as n! never changes, as n changes with the item size and position and as n# changes with the item position.

Note also that a point can be a combination of all these notations.
For an exhaustive description of the ScriptAge syntax, please refer to my Web site.

How Can You Contribute?

If you think this article and the project published are interesting and/or useful, you can help me maintain it live in many ways:

• Sending me your item script (that I'll publish with your credentials)
• Telling me if this article is clear or missing something
• Voting for this article
• Visiting my Web site
• Visiting my Web site and making a small contribution (this would be a great incentive)

History

• 13^th January, 2007: Initial post