2015-08-11 17 views
6

Esiste attualmente un kit di strumenti widget completo che fornisca il rendering di componenti solo in WebGL? Simile allo ZebraUI project, che rende un intero componente dell'interfaccia utente impostato nella tela HTML5?Rendering toolkit widget UI completo in WebGL

Screenshot of Zebra UI toolkit rendering in HTML5 canvas

L'idea è quella di scrivere puro JavaScript e ancora in grado di shader per rendere i componenti.

+3

Perché? hai l'intero browser per rendere l'interfaccia utente. Supporta tutti gli Unicode, tutti gli IME per altre lingue, lingue da destra a sinistra e leggibile da varie estensioni di disabilità. È anche completamente personalizzabile dai designer. Quale possibile motivo vorresti che l'UI di WebGL non facesse nulla di tutto ciò? – gman

+0

Oltre al commento di @gmans, html offre anche rendering del testo perfettamente scalabili, layout più semplice ed effetti accurati usando [css 3d transforms] (http://desandro.github.io/3dtransforms/) e [css filters] (https : //developer.mozilla.org/en-US/docs/Web/CSS/filter). L'unica cosa che * attualmente * manca è [css shaders] (http://www.adobe.com/devnet/archive/html5/articles/css-shaders.html), non sono sicuro di quale sia lo stato su di essi. –

+0

Dove ha senso costruire completamente l'interfaccia utente in WebGL: Rendering di interfacce utente altamente interattive a 4k con 60fps su piattaforme integrate (ad esempio schede basate su ARM in esecuzione in TV, ecc.); con l'opzione di andare completamente in 3D ad un certo punto nel futuro. I filtri personalizzati CSS (ovvero gli shader CSS) sono stati [rimossi dalla base del codice Webkit] (https://lists.webkit.org/pipermail/webkit-dev/2014-January/026098.html). –

risposta

5

C'è un nuovo progetto open source che supporta il rendering completo di tutti i widget tramite WebGL: DreemGL toolkit. Ecco uno screenshot di un'applicazione DreemGL. Tutti gli elementi dell'interfaccia utente vengono renderizzati utilizzando WebGL (inclusi i tipi di carattere). È ancora di qualità alfa o beta.

DreemGL application rendering the full UI in WebGL

+0

L'architetto software di DreemGL ​​sta lavorando su una piattaforma di codifica creativa chiamata [Makepad] (https://github.com/makepad/makepad.github.io) ora. Il codice sorgente è su Github, ecco il link alla [demo di Makepad] (https://makepad.github.io/makepad.html). Come DreemGL, l'interfaccia utente completa (inclusi gli elementi di testo) è completamente renderizzata in WebGL. È ancora un software di qualità Alpha, ma a un certo punto potrebbe essere utilizzato per creare rendering di prototipi a 60fps su smartphone come i modelli di iPhone 6 o successivi, nonché Galaxy S6 e Note 5 o versioni successive. –

+0

E ha sottolineato in precedenza completamente fallisce nel supportare qualsiasi lingua non romana. Nessun giapponese, nessun cinese, nessun coreano, nessun altro supporto IME. È anche SLOOOOW. Ho provato a scorrere verso il basso nell'editor di testo e sta scorrendo a circa 15-20fps dove questa pagina qui su Stackoverflow scorre a 60fps – gman