Embedding Ventus in WT

问题

Hello fellow programmers! My goal is to embed a Ventus window manager (http://www.rlamana.es/ventus/), repo here (https://github.com/rlamana/Ventus) in a WT page (http://www.webtoolkit.eu/wt) and get the "Simple Example" running. I have the ventus window embedded in the WT page, however I am having a styling problem with the window. My guess this is a conflict with CSS of Ventus and WT. Which brings me here, as CSS is not my strong point. I am using visual studio2010 for my development, and I have the bare minimum of a WT project running, basically the hello world app with all the widgets ripped out of it. I've included all the CSS and JS that the simple.html example uses, and have been trying to figure out how to make it work with WT. Any help would be much appreciated!

void HelloApplication::InitInterface()
{
//Include the CSS
wApp->useStyleSheet("Ventus/examples/simple/css/normalize.css");
wApp->useStyleSheet("Ventus/examples/simple/css/simple.css");
wApp->useStyleSheet("Ventus/build/ventus.css");
wApp->useStyleSheet("Ventus/examples/simple/css/browseralert.css");

//Include the JS
wApp->require("Ventus/vendor/modernizr.js");
wApp->require("Ventus/vendor/jquery.js");
wApp->require("Ventus/vendor/handlebars.js");
wApp->require("Ventus/build/ventus.js");

WContainerWidget* root = this->root();

WContainerWidget* ventus_widget = new WContainerWidget(root);

//Widget ref
std::string ventus_widget_ref = ventus_widget->jsRef(); // is a text string that will be the element when executed in JS


std::string command = ventus_widget_ref + ".wm = new Ventus.WindowManager();";
//Create the window manager
ventus_widget->doJavaScript(command);

command = ventus_widget_ref + ".wm.createWindow({title: 'Ventus', x: 10, y: 10, width: 500, height: 500}).open();";

//You may also create new windows by creating container widgets and fromQuery function
//WContainerWidget* app_window = new WContainerWidget(wApp->root());
//command = ventus_widget_ref + ".wm.createWindow.fromQuery(" + app_window->jsRef() + ", {title: 'Ventus', x: 10, y: 10, width: 500, height: 500}).open();";
//You can then add widgets to the ventus window like any other WT container
//app_window->addWidget(app.get());

//Create a window
ventus_widget->doJavaScript(command);
}

回答1:

Finally figured it out. When using WT instead of using "require" for loading CSS files, use "useStyleSheet".

来源：https://stackoverflow.com/questions/16590073/embedding-ventus-in-wt