К содержимому

SUS UIСобирайте Unity UI так же, как Vue-приложения

Реактивные .sharq single-file компоненты, UI-kit в духе Vuetify и навигатор в стиле Vue Router для Unity UI Toolkit.

SUS UI

Зачем SUS?

Unity UI Toolkit мощный, но низкоуровневый: экраны тонут в boilerplate, manual bindings и MVVM-клейке на каждый data binding. SUS это снимает — реактивные .sharq SFC, чтобы не проводить Q<> и колбэки руками. Сравнение бок о бок: UI Toolkit без ручных биндингов.

SUS даёт web-подобный DX в Unity: SFC, реактивные props, директивы (v-if / v-for / :class), слоты, темы — и большую готовую библиотеку компонентов.

xml
<template>
  <sus:SusButton :text="Label.Value" @click="OnClick" class="demo-btn" />
</template>
<script>
public Prop<string> Label = new("Click me");
void OnClick() => Label.Value = "Clicked!";
</script>
<style>
.demo-btn { margin-top: 8px; }
</style>

Почему SUS, а не обычный UI Toolkit

Unity UI Toolkit даёт примитивы — UXML, USS, C#-байндинги. Без фреймворка вы всё равно пишете manual bindings и пересобираете списки руками. SUS — слой поверх: реактивность вместо MVVM-boilerplate, single-file компоненты и большая готовая библиотека.

обычный UI ToolkitSUS
Реактивные данныеРучные байндингиВстроено: Prop / Computed / Watch
SFC (template+script+style)Нет — UXML + USS + C#.sharq
Библиотека компонентовDIY80 готовых (kit) + 48 игровых
RouterDIYВстроенный

Сравниваете с Unity App UI? Он работает поверх того же UI Toolkit и может стоять в одном проекте рядом с SUS — берите SUS ради реактивной Vue-подобной модели компонентов (.sharq SFC, Prop/Computed/Watch) и готовой библиотеки поверх.

Один layout — оба экрана

Спроектируйте экран один раз — он поедет на desktop и mobile без отдельной сборки. Без системы токенов и breakpoints адаптация меню под телефон обычно значит пересобрать с нуля; SUS привязывает каждый экран к одной оси breakpoint (SusBreakpointService читает ширину самой панели — не проверку устройства), поэтому kit- и game-экраны перестраиваются, а не ветвятся. SusInventory — рабочий пример: тот же компонент сжимается в компактный touch-friendly одноколоночный layout на узкой панели и раскрывается в полный многопанельный desktop-layout на широкой — тот же .sharq, тот же C#, без mobile-only форка.

См. Адаптивная вёрстка про ось breakpoint или Design tokens — как токены на неё реагируют.

Посмотрите

Живая песочница: попробуйте в браузере — та же WebGL-сборка sus-demo; брейкпоинты переключаются в плеере.

Публичное демо (клонируемый runtime-пример): sus-demo-public

Inventory Сеточный инвентарь — drag & drop, экипировка, статыHUD presets HUD-пресеты — combat, tactical, MMO
Main menu Главное меню — Menu Wizard в один кликData table Таблицы данных — сортировка, media-ячейки
Forms Формы — валидация, dirty-tracking, серверные ошибкиБиблиотека компонентов 80 готовых компонентов (kit) + 48 игровых

Open-core

Движок бесплатный и MIT — попробуйте на своём проекте; готовые компоненты можно купить позже.

УровеньПакетыЦенаЛицензия
FreeCore + Router (git-package с GitHub)$0MIT
Kit-setCore + Router + Kit$50Asset Store EULA
Game-setCore + Router + Kit + Game$80Asset Store EULA

Смотреть цены →

Пакеты

  • sus-core — реактивность, компилятор .sharq, темы, оверлеи, world-space
  • sus-router — навигация, guards, модалки, transitions
  • sus-kit — 80 готовых компонентов (кнопки, формы, таблицы, модалки, тултипы…)
  • sus-game — 48 игровых компонента (HUD, инвентарь, экраны)