New editors in Construct 3

1
Official Construct Post
Ashley's avatar
Ashley
  • 23 Feb, 2017
  • 993 words
  • ~4-7 mins
  • 4,486 visits
  • 0 favourites

Many games use array, dictionary or text-based formats to store data related to the project. For example an RPG may make use of a table of characters and their abilities. However Construct 2 did not provide any visual way to prepare this data. We've created three brand-new editors in Construct 3 to help make this easy.

The Dictionary Editor

A dictionary simply associates values with keys. For example just like a real dictionary it could store words as keys, and the definition of the word as a value — but you can use the same structure for any other kind of data, like high-scores per level.

The Dictionary object uses a JSON-based format to store dictionary data. You can now add a new project file in the format used by the Dictionary object directly from the Project Bar, as well as a variety of other formats.

Editing a dictionary file opens the new Dictionary Editor. This is a full editor that lets you add, edit and delete keys. Any changes are saved back to the project file. In this example we're associating characters in an RPG game with a character class.

Dictionaries only allow each key to appear once. If you accidentally use the same key twice, it highlights the duplicated keys to help you spot which one to change.

As a quick fix, you can click the "deduplicate" button in the toolbar to ensure every key has a unique name.

This new editor makes it a snap to set up dictionaries!

The Array Editor

An array is essentially a list of values. You can have a one-dimensional array, which is a simple list, or a two-dimensional array, which is like a spreadsheet with rows and columns which can store values. The Array object also supports three-dimensional arrays, but due to the complexity of editing this format, the Array editor only supports up to two-dimensional arrays.

As before, you can now create a new Array file directly from the Project Bar. You can then directly edit the Array file with Construct 3's new Array Editor. Here's what editing a two-dimensional array looks like, for a table of attack bonuses for character classes. It's like a miniature spreadsheet editor.

The Array Editor automatically determines if you entered a number or a string and saves the corresponding type. For example entering "hello" will save a string, but "123" will save a number.

The Array Editor also has some tools to help you manipulate your data, such as inserting new columns and rows.

Both Array and Dictionary files can be requested at runtime with the AJAX object, and then the result loaded by the Array or Dictionary object. This was also possible in Construct 2, but previously there were no built-in editors, so it could be difficult to create the files to load in the first place. It's much easier in Construct 3! The Array editor lets you set up large tables of data easily and visually right inside the editor.

The Text Editor

Advanced users may make use of custom text-based formats, like XML, CSV, JSON or just plain text files. These can be used or imported by other plugins in Construct 3, or read by your own events. It's also sometimes useful simply to have the file bundled with the export, such as a JavaScript file with a snippet of code used by the exported page. Here's an example of a snippet of XML being edited in Construct 3's text editor.

The Text Editor is useful for writing very long strings, such as an introductory story. While that could be entered in to a Text object, it can be more efficient to store very long content in project files and request them with the AJAX object at runtime. The Text Editor also provides a better editing experience for long content, as well as some basic code-editing features for other formats like XML. Here are a few of the editing features you get with the Text Editor:

  • Line numbering
  • Syntax highlighting
  • Code folding
  • Find/replace/replace all, including with regular expressions
  • Code templates for formats like HTML
  • In-editor undo & redo

When you edit a project file, Construct 3 automatically identifies which editor to use. If it recognises the file format, it will open the Dictionary or Array editors. Otherwise it will use the Text Editor. This allows you to conveniently edit custom JSON files while still using the Dictionary and Array editors for the JSON-based Dictionary and Array files.

Docking in the UI

All three editors can be docked to the UI, just like the Layers Bar and other bars. This means you can use them in split-screen arrangements so you can see other editors like the Event Sheet View at the same time. For example here's what the Array Editor looks like docked to work with some events at the same time.

Alternatively any of these new editors can also be docked as a tab in the main view, just like the usual Layout View and Event Sheet View tabs. The previous text editor picture shows an example of a tabbed editor.

Conclusion

The new Dictionary Editor, Array Editor and Text Editor are powerful and useful new tools to set up data and content used by your game. They use convenient visual interfaces to help you quickly and easily set up things like tables, associations, text and more for use in your game, integrating smoothly with the rest of Construct 3. We think you'll find these very handy when designing your games!

Catch-up

Missed our earlier announcements? Here's a list of all the news about Construct 3 so far:

Subscribe

Get emailed when there are new posts!