The Action Editor
The Action editor allows you to edit the actions of a line of events. The display of the actions in this editor is done as a list, with actions listed one after another. It is also sometimes called the “event-list” editor in other sections of this documentation. To add a new action, just click on the line “Insert your action here”. This will open a dialog box presenting you all the objects of the application. Right click on the one you want to change, and choose the action in the list. Your new action is then inserted in the event. Here too you can define more than one action : right click on the action and select the Insert option in the popup menu. Drag & Drop Like most of the editors in Clickteam Fusion 2.5, the Action editor supports drag and drop. Just try it and you will very quickly understand how it works. Cut & Paste The action editor allows you to make blocks of actions. Just use the usual cut / paste commands and the action beneath the cursor will be copied or pasted. Undo / Redo The Action editor responds to the multiple Undo / Redo features, like the event editor.
The Expression Editor
The Expression Editor appears when you need to enter a value for an action or a condition. You will therefore get it when you are using the event editor. The expression editor works like a big calculator. The current expression is displayed in the white edit zone and you can click any of the buttons to enter a new value. The number buttons are used to enter numbers, and the function buttons to enter functions, like Sine and Cosine. Some functions ask for a parameter, the parameter is delimited by < and > and is automatically selected when you choose the function. Replace the content of < and > by the parameter. To select the next < and > click on the Next button. Some actions or conditions ask for text expressions : you then use strings enclosed in quotes like “This string”, and the functions ending by $. [Todo] Retrieve data from object This button is very important : it opens a dialog box presenting you with all the objects of the application. Right-click on one of the objects. This opens a popup menu presenting the possible expressions of the object : you just have to choose what value you need to retrieve from the object. Click on OK, and a new function appears in the edit zone. Note: If “Valid expression” appears then your expression is correctly written. If “Syntax error” appears then you have made a mistake somewhere in your expression : carefully check every element of the expression to find it.
The Event List Editor – Menus
When you right click on the event number, you get the following popup menu : Edit Edits the selected line, a remark or a group header. Insert / A comment Inserts a new comment after the selected line. Insert / A new line Inserts a new line of events after the selected line Insert / A group of events Inserts a new group of events after the selected line. Cut Copies the selected line in the clipboard and deletes it. Copy Copies the selected line in the clipboard. Paste Pastes the content of the clipboard at the selected position. Delete Deletes the selected line. When you right click on a condition, you get the following menu: Edit Edits the parameters of the selected line. Replace Replaces the selected line by a new condition. Insert Inserts a new condition at the selected position. Negate Negates the current condition. For more information on negated conditions please refer to the “Understanding the events / Understanding the conditions / Condition negation” section. OR operator (filtered) Inserts a filtered OR operator in the list of conditions of the events. For more information on OR please refer to the “Understanding the events / Understanding the conditions / OR operators” section. OR operator (logical) Inserts a logical OR operator in the list of conditions of the events. For more information on OR please refer to the “Understanding the events / Understanding the conditions / OR operators” section. Cut Copies the selected condition to the clipboard and deletes it. Copy Copies the selected condition to the clipboard. Paste Pastes the content of the clipboard at the selected position. Delete Deletes the current line. When you right click on an action, you get the following menu: Edit Edits the parameters of the selected line. Replace Replaces the selected line by a new action. Insert Inserts a new action at the selected position. Negate Not available for actions. Cut Copies the selected action to the clipboard and deletes it. Copy Copies the selected action to the clipboard. Paste Pastes the content of the clipboard at the selected position. Delete Deletes the current line.
The Event List Editor – Toolbar
When the event-list editor is active, the editor toolbar displays the following icons : Zoom factor. Change the zoom factor to enlarge or reduce the size of the text in the event-list editor. From 0 to 200. Go to line. Moves the cursor to the given line number. Display events relative to the system objects : as its name indicates, this tool will filter the events and only display the ones relative to the system objects. Display events relative to the active objects. Display events relative to the text objects. Display events relative to the game oriented objects. Display events relative to extension objects. Display all the events (removes the event-filters).
The Event List Editor – Overview
The event-list editor is the other way to edit your program of events. The display of the events in this editor is done as a list, with conditions and actions listed one after another. It is up to you to use this editor or the event editor as you prefer. To enter a new event, first click on the New condition line : this will open a dialog box presenting all the objects. Right click on the object you want to test and choose the condition in the list. Once your condition created, you can add more conditions to the event by right clicking on the condition and choosing Insert. When you are done with the conditions, just click on the line “Insert your action here” : This will open a dialog box presenting you all the objects of the application. Right click on the one you want to change, and choose the action in the list. Your new action is then inserted in the event. Here too you can define more than one action : right click on the action and select the Insert option in the popup menu. Drag & Drop Like most of the editors in Clickteam Fusion 2.5, the event-list editor supports drag and drop. You can drag and drop actions, conditions, or lines of events. Just try it and you will very quickly understand how it works. Cut & Paste The event-list editor allows you to make blocks of events, conditions and actions. Just use the usual cut / paste commands and the event, condition or action beneath the cursor will be copied or pasted. Undo / Redo The event-list editor responds to the multiple Undo / Redo features, like the event editor. Printing the events One of the main advantages of the event-list editor, is its capability of printing the list of events. Just choose the Print, Print preview, or Print Setup options in the File menu in the main menu bar.
The Event Editor – Menus
The event editor contains a lot of popup menus : they provide a very quick access to a lot of functions. In this page we will describe all the menus. The objects bar menu You obtain this menu by right-clicking on one of the objects in the objects bar. Hide Hides the object from the display. Use this option if you have a lot of objects : the objects are stored in another hidden folder. A special icon appears on the right of the objects bar to get the object back, or you can use the next option. Insert hidden object Opens a dialog for you to choose between the hidden objects. Insert object folder The object folders are handy ways to classify the objects in the bar. Choose this option and it will create two brackets at the location where you clicked. Now you are free to drag & drop objects in between these brackets. Drop as many as you want. Once done, a double click on one of the brackets will close the folder : all the objects are now safe in the folder. To open the folder back, just double click on it. Replace by another object When you select this option, it opens a new dialog for you to choose another object. Only the objects of the same type as the selected object are displayed. Choose an object and click OK : the event editor will replace all the occurrences of the first object by the second object, in both the actions and the conditions. Very handy to replace an object by another one. Delete any action in column The option will do as stated : it will delete all the actions in the column. For example, you want to get rid of all the samples and sounds, choose this option for the Speaker object. Display properties Displays the properties of the object in the property toolbar. If the property toolbar was closed, it is opened. Open behavior If the object contains behaviors, this submenu allows you to open the behavior event editor to edit the content of the behavior. Hide objects with qualifiers This option is only available for qualifiers. All the objects bearing this qualifier will be hidden, but the qualifier will remain visible. Handy when you have a lot of objects responding to one qualifier. The event menu You obtain this menu by clicking on one of the numbers on the left of the display. Edit the actions This option opens the action editor so that you can reorder the actions in the correct order. Add a new condition This option opens the objects dialog box for you to choose a new condition. The new condition is added at the end of the list of conditions. Hide objects without action This option hides all the objects that do not contain any actions. Warning : this might remove a lot of objects from the display, objects that you will be forced to re-enter by hand! Insert / A new comment As the name indicates, inserts a new comment in the list of events. It opens the comment setup dialog. Comments are mandatory for large programs. Insert / A new event Inserts a new event at the current position. Insert / A group of events Inserts a new group of events at the current position. Groups are a very handy way of simplifying your programming, please refer to the group documentation for more info. Cut Copies the line of event to the clipboard and deletes it. Copy Copies the line of event to the clipboard. Delete Deletes the current line. The Condition menu You obtain this menu by right clicking on a condition in the list of events. Edit Edits the current action. This may open other dialog boxes and editors. Replace Replaces the current condition. This option opens the New Condition dialog box for you to choose the condition. Insert Inserts a new condition. This option opens the new condition dialog box. Negate Negates the current condition. For more information on negated conditions please refer to the “Understanding the events / Understanding the conditions / Condition negation” section. OR operator (filtered) Inserts a filtered OR operator in the list of conditions of the events. For more information on OR please refer to the “Understanding the events / Understanding the conditions / OR operators” section. OR operator (logical) Inserts a logical OR operator in the list of conditions of the events. For more information on OR please refer to the “Understanding the events / Understanding the conditions / OR operators” section. Cut Copies the current condition to the clipboard and deletes it. Copy Copies the current condition to the clipboard. Paste Pastes the condition contained in the clipboard. Delete Erases the current condition. The Action menus When you right-click on a cell in the grid, a popup menu appears. This menu depends on the object you have clicked on. Clickteam Fusion 2.5 contains several hundreds of different menus, each menu being specific to the object you have clicked on. Please refer to the object inventory documentation for information on all the possible choices.
The Event Editor – Toolbar
When the event editor is active, the editor toolbar contains the following icons : The zoom settings : use the slider to modify the size of the events in the display, from 0 to 200… Go to line. Click this icon to jump directly to a specific line number. Very handy for large programs. Go to column. Click this icon to make the cursor jump to a given column. Very handy if you have a lot of objects. Displays only the events related to the system object. Very handy when you have a lot of events. Displays only the events related to active objects. Displays only the events related to the text objects. Displays only the events related to the game-oriented objects. Displays only the events related to extension objects. Shows all the hidden events Hides the system objects from the horizontal object bar : very useful if you have a lot of objects in your application. Hides the active object from the objects bar. Hides the text-related objects from the objects toolbar. Hides the game-oriented objects from the objects toolbar. Hides the extension objects from the objects toolbar. Shows all the hidden objects.
The Event Editor – Overview
The event editor is the place where you enter events. Events trigger all the actions and define the logic of your game or application. Events are made out of one or more conditions, and one or more actions. The event editor displays the conditions and the actions in innovative way, like a spreadsheet. The conditions are listed vertically in the left column, and the action horizontally in the grid. To enter a new condition simply click on the New Condition line displayed in the left column, then right click on the object you want to test in the dialog box, and choose the condition in the popup menu. To enter a new action, locate the condition you want to affect with the action, and locate horizontally the object you want to modify. Click with the right mouse button in the square located under the object and in front of the condition : a popup menu appears and you only have to choose your action in the list. Drag & Drop The event editor is mouse driven and drag & drop oriented. You can drag almost every element : The conditions between different events The actions (checkmarks) from one object to another The events to reorder the listing The objects on the top bar to set the order as your heart’s desires You can rearrange the event editor as your heart’s desires by drag & dropping the resizing lines Just try and see by yourself. You will discover with the event editor a completely new way of programming, with the mouse and not with the keyboard. Blocks It is perfectly possible to make blocks of events and perform cut / paste / delete operations : the event editor reacts like any editor to the cut and paste operations. The usual keyboard shortcuts apply to the event editor, or you can choose the cut / paste options in the main menu. Undo / Redo The event editor contains a multiple step undo / redo system : feel free to use it when you have made a mistake. Re-ordering You can modify the order of the actions in an event line. Just double-click a cell in the line, or right-click the event number and select “Edit the actions” in the popup menu. This will open the Action Editor.
The Animation Editor
The Animation editor is opened when you edit an Active object. It allows you to draw and define the animations of the object. As you can see in the picture, the animation editor is an enhanced version of the picture editor. Refer to its documentation for information on the tools and their use. The animation editor is extended in the bottom of the dialog box. From left to right: The animation selector An active object can have a number of animations, and these animations are used when the object is moving on the screen. The animations consist of default animations and custom animations. The default animations are: Stopped: used when the object is static Walking: used when the object is moving at a slow pace Running: used when the object is moving at high speed Appearing: if defined, this animation will be played immediately when the object is created Disappearing: if defined, this animation will be played when the object is destroyed Bouncing: played when the object is bouncing on an obstacle Launching: played when the Launch object action is triggered. The bullet is created at the location of the action point of the first image of the animation Jumping: used by platform movements, played when the object is jumping Falling: used by platform movements, played when the object is falling Climbing: used by platform movements, played when the object is climbing a ladder Crouch down: used by platform movements, played when the object is crouching Stand up: used by platform movements, played when the object is uncrouching User animations: you can define an unlimited number of extra animations, for you to use in your application. To create a new animation, click with the right mouse button in the animation selector and choose New. The direction selector The direction selector is located to the right of the animation selector. Each animation can consist of up to 32 different directions. The correct direction will be automatically selected and used by the movement routines used in the runtime, if it exists. If the direction does not exist, the closest existing direction is chosen. To change the number of directions, use the slider located under the direction selector. It consists of four settings, 4, 8, 16 and 32 directions. 32 directions take a lot of memory and should be reserved for the main objects of your application. Empty directions are marked by an empty square in the direction selector, whereas directions containing images are marked by a filled dot.If you right click on one of the filled dots, it opens a popup menu: Cut / Copy / Paste / Delete: the casual editing functions are available for directions. They copy or paste all the images of the direction at once. Create rotated directions. This very powerful option allows you to create all the rotated directions of the animation with just a click. All the directions are computed by rotating the images around the hot-spot. Create opposite direction. Creates the opposite direction by flipping the object around the hot-spot of the image. Flip Horizontally. Flips horizontally all the images contained in the direction. Flip Vertically. Flips vertically all the images contained in the direction. Invert Frame Order. Replace the first frame by the last one, the second by the previous etc. Direction options tab. This tab presents important options for the animation. Lower speed. Defines the lower speed of the animation. This speed indicates how fast the animation plays when the object is static. The speed is a number from 0 to 100. Higher speed. Defines the higher speed of the animation. This speed is the speed used when the object moves at maximum speed. For movements between minimum and maximum speed, the speed of the animation is calculated from the two values. Repeat. Indicates how many times the animation should play. Click on the loop checkbox to force the animation to play forever. Back to. Indicates the number of the frame at which the animation loops. Frame tab The frame tab shows the different frames of the animation. A right click on one of the frames opens the following popup menu: Clone frame. Creates a new frame using the current frame as a template. Zoom. Opens the zoom dialog box, allowing you to create new frames by zooming in or out the current frame. The new frames can be inserted before or after the current frame. Rotation. Creates new frames by rotating the object around its hot-spot. Here too, the new frames can be inserted before or after the current frame. Flip horizontally. Flips the selected frames horizontally. Flip vertically. Flips the selected frames vertically. Select all. Selects all the frames of the animation. Unselect. Unselects the selected frames of the animation. Cut / Copy / Paste. The casual editing functions work on frames too. Delete. Deletes the selected frames. The control bar. The control bar is displayed under the magnified frame. It allows you to quickly navigate through the different frames of the animation. From left to right: First frame. Displays the first frame of the animation. Previous frame. Displays the previous frame of the animation. Frame Number. Indicates the number of the frame and the total number of frames contained in the animation. Next frame. Displays the next frame of the animation. Last frame. Displays the last frame of the animation. Clone frame. Creates a new frame by duplicating the current one. The new frame is inserted after the current frame. Delete frame. Destroys the current frame. Display previous or next frame. This powerful option transforms the animation editor into a light table: it allows to display the previous or next frame in semi-transparency above the current frame. Very useful to create animation: you can copy the previous image and create the new one from it. Moving the cursor to the left displays the previous frame, and to the right the next frame.
The Picture Editor
The Picture editor is a complete paint package embedded in Clickteam Fusion 2.5. It contains all the necessary tools to draw, import and edit images. Edit Area The edit area, in the center of the dialog box, contains the image to edit. To draw, you have to select a tool from the Drawing tools on the left, select the drawing color(s) in the color palette on the right, and then use your mouse to draw in the image. If the image is larger than the edit area, you can use the scroll bars to view the hidden areas. You can also press the SPACE key and move the image with the left mouse button without releasing the SPACEBAR key. To zoom the image, either use the Zoom slider in the Drawing tools, or use the mouse wheel. Drawing tools Clear: erases the current image. Import: opens the Import dialog allowing you to import an image file in the editor. See below. Export: saves the image as an external file. Options: allows you to choose the function of the right mouse click on the image, either the second (background) color, or pick a color from the image. Cut: copies the current selection to the clipboard and deletes it. Copy: copies the current selection to the clipboard. Paste: pastes the content of the clipboard to the picture. Delete: deletes the current selection. Undo / Redo: cancels or redoes the last actions. Flips the image horizontally. Press SHIFT to flip the alpha channel at the same time. Flips the image vertically. Press SHIFT to flip the alpha channel at the same time. Crop: resizes the image by eliminating the blank area around it. You can use a combination of keys to crop several images at the same time when you click on the Crop button : SHIFT to crop all the images of the current direction or image list, SHIFT + CONTROL to crop all the directions of the current animation, SHIFT + CONTROL + ALT to crop all the animations of the current object. Transparency mode. In this mode you can choose to view and edit the transparent color, or the alpha channel. When drawing in the alpha channel, the color palette is replaced by shades of gray. Magnifier: sets the zoom factor used to display the image. Use the slider beside the icon to change the zoom factor. Selection: allows you to make a block around areas of the image. Use the Opacity slider to make the selected area semi-transparent. Color picker: allows you to pick a color in the image using the mouse. The left mouse button allows you to pick the foreground color, the right mouse button allows you to pick the background color. Brush: used to draw pixels and lines in the image. The options in the settings window allow you to change the size of the brush and modify its opacity. Lines: allows you to draw straight lines in the image. The options in the settings window allow you to change the size of the line and modify its opacity. Rectangle: used to draw rectangle shapes in the image. The options in the settings window allow you to choose between filled, outlined and filled+outlined rectangle, change the size of the border and modify the opacity of the rectangle. Ellipse: used to draw circles and ellipses in the The options in the settings window allow you to choose between filled, outlined and filled+outlined ellipse, change the size of the border and modify the opacity of the ellipse. Polygon: allows you to draw closed polygons. Draw the lines defining the polygon with the left mouse button, and close the polygon with a double click. The options in the settings window allow you to choose between filled, outlined and filled+outlined polygon, change the size of the border and modify the opacity of the polygon. Shape: used to draw a closed shape with the mouse. The options in the settings window allow you to choose between filled, outlined and filled+outlined shape, change the size of the border and modify the opacity of the shape. Fill: fills closed shapes with one color. You can change the color tolerance of the filling process in the settings window. Spray: use a spray to draw in the image. You can change the size and pressure of the spray in the settings window. Text: used to draw a text in the image. Choose the font and the attribute of the font, and enter your text in the dialog box. You can move the text with the mouse while the dialog box is open. The Import Font button is enabled when you edit a Counter, Score on Lives object displayed as Numbers. It allows you to import the numbers from a font. Eraser: draws with the transparent color, therefore erasing the image. Resize: used to resize the image. Enter the new size of the picture in the edit zones and click the Apply button. If you choose Proportional, the other coordinate will be calculated automatically to keep the proportions of the image. Stretch will stretch the image to the new size, Resample will resample the new image and produce a better resizing effect. Rotation: used to rotate the image. Enter the angle and click the Apply button and this tool will rotate the image around its hot spot. Hot spot: the hot spot is the point in the image corresponding to the actual X and Y coordinates of the object. You can set the position of the hot spot in the image with this tool. The Quick Move buttons allow you to move the hot spot to specific positions in the image: top-left, top-center, top-right, center-left, center, etc. If you are editing an image list, for example a direction in the Animation editor, you move the hot spot in all the images by pressing ALT while changing the position of the hot spot. Action point: the action point is the location in the image where the
