unix4ever / imvue Goto Github PK

View Code? Open in Web Editor NEW

8.0 8.0 7.0 1.41 MB

Declarative reactive ImGui bindings inspired by Vue.js

License: MIT License

CMake 0.89% Makefile 0.19% Shell 0.05% C++ 97.10% C 0.02% Lua 0.23% Python 1.52%

c-plus-plus dear-imgui lua ui xml

imvue's People

Contributors

Stargazers

Watchers

Forkers

voidforks zjsxwc mybios frinknet mfkiwl pronebel

imvue's Issues

CSS styles support

Parsing CSS is a first step.
Then need to implement actual cascade style selector.
Preferably this should be implemented using ImGui coding style.

For example:

// read css from memory/file
ImU32 styleID = ImVue::LoadStyle(data);
...
ImVue::PushStyle(styleID);
// render styleable button
ImVue::Button("label", "btn btn-toggle", "id");
ImVue::PopStyle();

Inside ImVue::Button:

IMVUE_API Button(const char* label, const char* classes, const char* id) {
...
    Context& ctx = GetContext();
    // this style selector should be really fast
    // probably it's possible to hash all these strings and cache this view
    Style* s = ctx.selectStyle("button", classes, id);
    
    if(s) {
        // should have some common code that can render any kind of shapes
        if(s.fontFamily) {
           // style parser should load this font
           ImGui::PushFont(s.fontFamily);
           // https://github.com/ocornut/imgui/issues/1018 can use the following approach to scale the font
           ImGui::TextUnformatted(label);
           ImGui::PopFont();
        }
    } else {
        return ImGui::Button(label);
    }

Can probably utilise window key value storage to generate and save hashes for elements.

CSS flex and table layouts

libcss already supports them, need to add this support in ImVue

Support sync directive

Handle field change in C++, propagate to script system if there is handler bind for the property.

Fix bugs with component size

Trying to set 100% to the first child of a component causes flickering.

Support all numeric types parsing

E.g.:
ImU32
unsigned short

V8 integration itself shouldn't be really complicated.
But it would make sense to actually make this library behave as an actual web browser (with limited functional). Therefore it would be required to support low level JS functions that are provided by browsers, like: getElementById, appendChild, events, and others.

But this task scope can be limited to adding same set of features Lua has but in Javascript.

Support Most used HTML elements

Implement custom elements for all most common tags:

<a>
<b>
<body>
<br> -- make simple alias to <new-line>.
<button> -- override imgui button tag.
<canvas> -- should expose imgui drawlist to script.
<datalist>
<div>
<footer>
<form> -- can be implemented using custom component (?).
<h1> to <h6>
<head>
<header>
<html>
<i>
<img> -- should unite ImGui::Image and ImVue:SvgImage.
<input> -- override input to make it support various kind of operation mode.
<li>
<option>
<p>
<s>
<script> -- run script in the body? Why not.
<select>
<span> -- make span default element. Can fall back to rendering span if can't resolve child tag in html node.
<style>
<svg> -- inline svg.
<table>
<tbody>
<td>
<tr>
<textarea>
<tfoot>
<thead>
<th>

Use v-model on imgui autogenerated widgets wrappers

v-model works great for <input>. If autogenerated widgets get the same functional it will be make them much more convenient to use.

Initial version

Create initial library version with the list of core features, like parsing xml, scripting support, reactive updates and others.

unix4ever / imvue Goto Github PK

imvue's People

Contributors

Stargazers

Watchers

Forkers

imvue's Issues

CSS styles support

CSS flex and table layouts

Support sync directive

Fix bugs with component size

Support all numeric types parsing

V8 integration

Support Most used HTML elements

Use v-model on imgui autogenerated widgets wrappers

Initial version

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent