Smart UI Framework
Framework for Construct 3
All the addons were built with support for the following features/capabilities:
UI composition and navigation based on the Object Hierarchy/Scene Graph.
Long-term compatibility with native Construct 3 SDK features.
Container-based interactions for managing component focus, document flow, and default actions, as well as grouping components to create operational contexts.
Focus management, sibling interactions, and clipping based on containers and views.
Modal and non-modal dialog windows.
Load/Save game states.
zIndex-based interactivity to respond to the top-most valid components.
Flexibility for custom design.
Simple implementation and easy-to-understand ACEs.
Advanced minification using UglifyJS (Closure Compiler is not supported).
Worker mode support for all addons.
Available Addons
SmartUI includes 12 addons to fulfill your UI needs. In combination, they can create powerful and complex UI's, and provide an instant polished feel to your games.
SmartUI addon integration fully depends on Construct 3 object hierarchy. For composite addons like dialogs, scrollbars, scrolviews and gridlayouts, their sub-components and children must be children of the main component.
Below, youll find a briefing about each of the avilable addons and their type.
All of the addons are empty vessels that comunicate with the framework, therefore you are required to always add the SmartUI Framework plugin to your projects. Initialization and component communication is done automatically.
By design, you can only add one SmartUI behavior to your instances.
Addon | Description | Type |
---|---|---|
Loads the framework and enables the SmartUI addons to communicate with Construct 3. | Single Global Plugin | |
React to user mouse/touch interactions with custom animations and easings. | Behavior | |
Lets you manage boolean values by toggling the check state. Also includes custom animations and easings. | Behavior | |
Under the same operational context, allows you to select only one object within the group. | Behavior | |
Under the same operational context, represent an integer value within a group of sprites, distributing the number within the available parts of a sprite. | Behavior | |
Represent a discrete value in a bar. Provides custom animations and easings when setting the value. | Behavior | |
Behaves like a slider or a scrollbar, the last if the object is composed with additional buttons in the layout. Handles float and integer values in a range. | Behavior | |
Group objects and create operational context for their siblings. Manages navigation, focusing and event propagation to its children. | Behavior | |
A complex composite object that behaves like a dialog window, with modal capabilities. Can be maximized, minimzed, or closed like a regular dialog and has custom animations and easings. | Behavior | |
Composite object that lays out your existing scene objects, or Renders objects in a grid layout from a datasource. When using a datasource, it triggers data-render requests. | Behavior | |
Composite object that renders all its children within a viewport. | Behavior | |
Reacts to data-render request from components, allowing you to decide what to do with the provided data. ℹ️ This behavior can co-exist in the same instance that has a SmartUI behavior. | Behavior |
Basic Setup Tutorials
I've created a playlist with all the tutorials for basic setup of each component. Take some time to look at them, most are between 3-5 minutes long, and you will get valuable information to quickly start building your game.
Last updated