kiui

Auto-layout Ui library, lightweight, skinnable and system agnostic, with an OpenGL backend

  • Owner: hugoam/kiui
  • Platform:
  • License:: zlib License
  • Category::
  • Topic:
  • Like:
    0
      Compare:

Github stars Tracking Chart

Warning: kiUi became the ui component inside the mud library

This repository just exists for history purposes but is not under active development anymore.

kiUi Build Status

kiUi is a lightweight auto-layout Ui library, abstracted out from any rendering or input code.

kiui supports Emscripten : try the live demo here.

It is designed according to the following design goals :

  • Separation of Ui appearance and logic
  • Automatic layout as the norm, not the exception (as in HTML)
  • Easy styling, separated from logic (as in CSS)
  • Brevity and simplicity above everything else, especially in C++ code
  • Good for both an editor Ui and a game Ui

screenshot of the example window with a raw skin

Auto-Layout

Every single element in kiUi auto-layouts ! You have nothing to do. No position to set, no size to determine.

  • Code the logic : Just add your widgets and define the logic as you please.
  • Code the appearance : Just set your fonts, font-size, images, and kiUi will do the rest.

The style can be defined and tweaked separately by an artist. Style are defined in C++ as of now, but Style Sheets are planned to come soon.

Skins

kiUi was conceived so that each element can be styled in a way very similar to CSS, through Style Sheets
You can switch between Styles Sheets on the fly

switching between styles at runtime

Usage

RootSheet& root = uiwindow.rootSheet();
Window& window = root.emplace<Window>("Example window");

Expandbox& expandbox = window.emplace<Expandbox>("Collapsable box");

Label& label = expandbox.emplace<Label>("kiUi says hello.");
Button& button = expand.emplace<Button>("Push me");

For a more in-depth usage example look at the full demo implementation : Example

Nano

kiUi comes with a light renderer / input system based on NanoVG and GLFW to quickly bootstrap a prototype application in a few lines of code.

GlWindow glwindow(1200, 800, "mk UiEditApp");
glwindow.initContext();

UiWindow& uiwindow = glwindow.uiWindow();
bool pursue = true;
while(pursue)
    pursue = glwindow.renderFrame();

Widgets

  • Dockspace
  • Tabber
  • Table
  • Window (resize, drag, dock)
  • Radiobutton
  • Dropdown

Editor

kiUi will come with a simple editor which also uses kiUi for its interface

License

The library is licensed under zlib license

Uses nanovg for vector rendering
Uses glfw for OpenGL context management

Main metrics

Overview
Name With Ownerhugoam/kiui
Primary LanguageC++
Program languageC++ (Language Count: 4)
Platform
License:zlib License
所有者活动
Created At2015-02-27 18:33:49
Pushed At2018-05-18 21:07:49
Last Commit At2018-05-18 23:07:48
Release Count0
用户参与
Stargazers Count752
Watchers Count68
Fork Count74
Commits Count466
Has Issues Enabled
Issues Count32
Issue Open Count16
Pull Requests Count6
Pull Requests Open Count1
Pull Requests Close Count1
项目设置
Has Wiki Enabled
Is Archived
Is Fork
Is Locked
Is Mirror
Is Private