Howto:Creating a Canvas GUI dialog file
Jump to navigation
Jump to search
This article is a stub. You can help the wiki by expanding it. |
The FlightGear forum has a subforum related to: Canvas |
Navigate to the sub-menu where you'd like to add your new dialog, e.g. "Equipment" in this case, and then add a key:
<equipment>Equipment</equipment>
<canvas-demo-dialog>Canvas Demo Dialog</canvas-demo-dialog>
Next, open $FG_ROOT/gui/menubar.xml and navigate to the corresponding sub-menu and add a new item/binding to load your dialog:
<item>
<name>canvas-demo-dialog</name>
<binding>
<command>nasal</command>
<script>
canvas.loadDialog("CanvasDemo");
</script>
</binding>
</item>
Note These dialog files can be edited at run-time and simply closed/re-opened, because the Canvas system will reload them from disk whenever the menu binding is triggered. So this is very convenient for quickly developing and testing your dialogs. |
Next, open/create $FG_ROOT/Nasal/canvas/gui/dialogs/CanvasDemo.nas and add some boilerplate code:
var DemoDialog = {
new: func
{
var m = {
parents: [DemoDialog],
_dlg: canvas.Window.new([400,300], "dialog")
.set("title", "Demo Dialog")
.set("resize", 1),
_active_button: nil
};
m._dlg.getCanvas(1)
.set("background", canvas.style.getColor("bg_color"));
m._root = m._dlg.getCanvas().createGroup();
var vbox = VBoxLayout.new();
m._dlg.setLayout(vbox);
return m;
},
};
var demo = DemoDialog.new();
Finally, start FlightGear and open your new dialog