Graphene

screenshot of Graphene

Graphene for Unity UI Toolkit is a lightweight and modular framework for building user interfaces

Overview

Graphene is a lightweight and modular framework for building runtime user interfaces with Unity's UI Toolkit. It offers a range of features that simplify the process of designing and building interactive UI for games. With Graphene, developers can focus on their custom logic and design while reducing the need for repetitive low-level tasks. It provides a declarative hierarchy, attribute-based UI, state-based routing, template composition, and comes with a component-kit library, sample project, VisualElement extensions, and an online demo.

Features

  • Declarative Hierarchy: Design interactive UI using the familiar GameObjects hierarchy. Create simple Views as sections of the screen or nested states.
  • Reduce Boilerplate: Focus on custom logic and design instead of repeating low-level tasks for each unique screen. Graphene comes with Controls that enhance the speed of creating interactive UI and exposes vital functionality in Uxml.
  • Attribute-Based: Instruct UI to draw and bind templates using any data-container with a [Bind] attribute. Supports primitives, objects, collections, one-way, two-way binding, and specific control selection.
  • State-Based Routing: Use the GameObject hierarchy to dynamically construct the router's states. Mimics url-based addresses.
  • Template Composition: Write atomic templates of static assets and dynamically compose them at runtime.

Using Unity Package Manager (For Unity 2018.3 or later)

  1. Open your project's Packages folder in a file browser.
  2. Locate the file for Graphene package.
  3. Note that both components and the demo are optional packages but recommended for a Graphene-based development environment.

Staying updated

  • Update the package via Window/Graphene/Check for updates.
  • Use UPM Git Extension for installation and updates by adding "https://github.com/LudiKha/Graphene.git" under subdirectory src in the Package Manager.

Summary

Graphene is a lightweight and modular framework for building interactive UI in Unity. It simplifies the process by providing a declarative hierarchy, reducing boilerplate code, supporting attribute-based UI, state-based routing, and template composition. It also comes with a component-kit library, sample project, VisualElement extensions, and an online demo. Developers can install Graphene using Unity Package Manager and stay updated either through the Package Manager or by using UPM Git Extension.

ui-kit
UI Kits & Components

A UI kit provides developers with a set of reusable components that can be easily integrated into a website or application. These components are pre-designed with consistent styling and functionality, allowing developers to save time and effort in the design and development process. UI kits can be either custom-built or third-party, and often include components for buttons, forms, typography, icons, and more.