Scirra cog

About Us

We're a London based startup that develops Construct 2, software that lets you make your own computer games!

Archives

Browse all our blog posts

Latest Blog Entries

We love brains!

Join us! Joiiinnn ussss! Mooooree brains!

New editors in Construct 3

by Ashley | 23rd, February 2017

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.

Adding project files in Construct 3

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.

The dictionary editor in Construct 3

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.

Duplicate keys in the dictionary editor

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 in Construct 3

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.

Some of the array editor tools in Construct 3

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.

Some XML being edited in the Construct 3 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.

Split event sheet and array editor view in Construct 3

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:

Promotional footer image for Construct 3
Now follow us and share this

Tags:

Comments

5
XMatrix 383 rep

Nice! Good job

Thursday, February 23, 2017 at 12:28:09 PM
8
scoterr 1,300 rep

Finally something truly epic!

Thursday, February 23, 2017 at 12:31:06 PM
3
Havok 3,755 rep

Very nice! Useful indeed.

Thursday, February 23, 2017 at 12:31:17 PM
7
TheRealDannyyy 35.8k rep

Now this is what I've been looking for, great job Scirra keep it up!
Speculation: SVG = Vector art support in C3 confirmed?

Thursday, February 23, 2017 at 12:31:35 PM
2
raxxusgeddon 348 rep

Awesome guys!

Thursday, February 23, 2017 at 12:33:37 PM
1
Psychokiller1888 3,045 rep

Looking good

Thursday, February 23, 2017 at 12:38:47 PM
0
ErekT 4,392 rep

Starting to look pretty swish!

Thursday, February 23, 2017 at 12:40:52 PM
2
Everade 2,772 rep

Really great. This will help me a lot on my current project.
Looking forward to the next blog entry ;)

Thursday, February 23, 2017 at 12:41:58 PM
1
uboel 9,303 rep

Great editor features!

Thursday, February 23, 2017 at 12:45:25 PM
2
Rushty 555 rep

Love this. The new array editor will make life a lot easier.

Thursday, February 23, 2017 at 12:46:15 PM
1
BreenLine 343 rep

Thank you guys

Thursday, February 23, 2017 at 12:47:20 PM
3
Wolod 5,670 rep

Really cool features indeed! Can we expect something similar in Construct 2?

Thursday, February 23, 2017 at 12:47:50 PM
3
oravalag 4,680 rep
Now this is what I've been looking for, great job Scirra keep it up!
Speculation: SVG = Vector art support in C3 confirmed?
quoted from TheRealDannyyy

Please please please

Thursday, February 23, 2017 at 1:01:34 PM
1
Thistom 3,294 rep

Cool! Good job.

Thursday, February 23, 2017 at 1:06:37 PM
3
lucid 16.7k rep

Does the new plugin architecture allow for the creation of editors like this? Meaning, if these object types (dictionary) didn't already exist, would it be possible for a user to create one, complete with the same editor?

Thursday, February 23, 2017 at 1:11:36 PM

Leave a comment

Everyone is welcome to leave their thoughts! Register a new account or login.