Chili: Difference between revisions

From Spring
Jump to navigationJump to search
m fix hierachy
add links to objects, clearer text (todo: clean up examples)
Line 1: Line 1:
== Chili UI ==
== Chili UI ==
ChiliUi is a framework still in development by author JK. It's a very flexible class based framework, with it's structure derived from Delphi.  It has most of the basic components you expect a framework like for example Swing in java must have. It might feel a bit daunting at first to get started but with a little reverse engineering and this tutorial page you'll get a long way !
 
Chili is Springs very own GUI framework. It's a flexible, class based framework which allows you to create great looking GUIs quickly.
 
In Chili, every element of the GUI has properties that control how it looks, and functions it can call when special events (such as a double click, or mouseover) affect it.  


== Getting Chili ==
== Getting Chili ==
[https://github.com/jk3064/chiliui Chili UI framework git hub]


Download it , and put the extracted files in LuaUi/widgets.  It should run out of the box, but user experiences have been conflicted on that.  If you are in trouble getting Chili to run, I advice to login to the lobby and join /j moddev.  People there will help you figure it out.
The Chili repository can be found at [https://github.com/jk3064/chiliui https://github.com/jk3064/chiliui]. There are two ways to add Chili to your game:
* Include the Chili repository as a git submodule in your project.
* Checkout the Chili repository, and place the files from its /luaui/chili directory into your games /luaui/widgets directory.
   
If you are having trouble getting Chili to run, login to the lobby and join the #moddev channel (type /j moddev).  People there will help you figure it out.


Here are some hints that helped me get a vanilla ChiliUI running as of Spring 94.x.
== Chili Component Hierachy ==


* Create an empty file called lockluaui.txt in the gamedata folder of your game
The Chili framework is object orientated, and each different component is a class. The hierachy of components, which is documented [http://gajop.github.io/chiliui/index.html here],  is as follows:
* Copy main.lua and widgets.lua from the spring /luaUi folder to your games /luaUi folder


This helped me getting started again with a vanilla spring and chiliui install !
[http://gajop.github.io/chiliui/modules/controls.object.html Object]
|_ [http://gajop.github.io/chiliui/modules/controls.screen.html Screen]
|_ [http://gajop.github.io/chiliui/modules/controls.control.html Control]
  |_ [http://gajop.github.io/chiliui/modules/controls.button.html Button]
  |_ [http://gajop.github.io/chiliui/modules/controls.checkbox.html Checkbox]
  |_ [http://gajop.github.io/chiliui/modules/controls.checkbox.html ColorBars]
  |_ [http://gajop.github.io/chiliui/modules/controls.combobox.html ComboBox]
  |_ [http://gajop.github.io/chiliui/modules/controls.editbox.html EditBox]
  |_ [http://gajop.github.io/chiliui/modules/controls.font.html Font]
  |_ [http://gajop.github.io/chiliui/modules/controls.label.html Label]
  |_ [http://gajop.github.io/chiliui/modules/controls.layoutpanel.html LayoutPanel]
    |_ [http://gajop.github.io/chiliui/modules/controls.imagelistview.html ImageListView]
    |_ [http://gajop.github.io/chiliui/modules/controls.grid.html Grid]
    |_ [http://gajop.github.io/chiliui/modules/controls.stackpanel.html StackPanel]
    |_ [http://gajop.github.io/chiliui/modules/controls.tabpanel.html TabPanel]
  |_ [http://gajop.github.io/chiliui/modules/controls.line.html Line]
  |_ [http://gajop.github.io/chiliui/modules/controls.image.html Image]
  |_ [http://gajop.github.io/chiliui/modules/controls.multiprogressbar.html MultiProgressBar]
  |_ [http://gajop.github.io/chiliui/modules/controls.panel.html Panel]
  |_ [http://gajop.github.io/chiliui/modules/controls.progressbar.html ProgressBar]
  |_ [http://gajop.github.io/chiliui/modules/controls.scale.html Scale]
  |_ [http://gajop.github.io/chiliui/modules/controls.scrollpanel.html ScrollPanel]
  |_ [http://gajop.github.io/chiliui/modules/controls.textbox.html TextBox]
  |_ [http://gajop.github.io/chiliui/modules/controls.trackbar.html TrackBar]
  |_ [http://gajop.github.io/chiliui/modules/controls.treeview.html TreeView]
  |_ TreeViewNode
  |_ [http://gajop.github.io/chiliui/modules/controls.window.html Window]


== Chili Component Hiearchy ==
Viewing the diagram as a tree, each component inherits from its parent in the tree. In practice, this means each component has the properties/functionality of its own type, and also of all components found upwards from it in the tree. For example, a Grid has it's own properties, but also has those of a LayoutPanel, Control and Object.


object
|_screen
|_control
  |_button
  |_checkbox
  |_colorbars
  |_combobox
  |_editbox
  |_font
  |_label
  |_layoutpanel
    |_imagelistview
    |_grid
    |_stackpanel
    |_treeview
  |_line
  |_image
  |_multiprogressbar
  |_panel
  |_progressbar
  |_scrollpanel
  |_tabpanel
  |_textbox
  |_trackbar
  |_treeview
  |_treeviewnode
  |_window


== Tutorials ==
== Example Chili Widgets ==
[[Lesson 1 : Hello World]]
[[Lesson 1 : Hello World]]


Line 50: Line 54:


[[Lesson 3 : Command and Build commands in a chili window]]
[[Lesson 3 : Command and Build commands in a chili window]]
== Chili documentation ==
API documentation: http://gajop.github.io/chiliui/
[[Category:Libraries]]

Revision as of 17:43, 30 August 2015

Chili UI

Chili is Springs very own GUI framework. It's a flexible, class based framework which allows you to create great looking GUIs quickly.

In Chili, every element of the GUI has properties that control how it looks, and functions it can call when special events (such as a double click, or mouseover) affect it.

Getting Chili

The Chili repository can be found at https://github.com/jk3064/chiliui. There are two ways to add Chili to your game:

  • Include the Chili repository as a git submodule in your project.
  • Checkout the Chili repository, and place the files from its /luaui/chili directory into your games /luaui/widgets directory.

If you are having trouble getting Chili to run, login to the lobby and join the #moddev channel (type /j moddev). People there will help you figure it out.

Chili Component Hierachy

The Chili framework is object orientated, and each different component is a class. The hierachy of components, which is documented here, is as follows:

Object
|_ Screen
|_ Control
 |_ Button
 |_ Checkbox
 |_ ColorBars
 |_ ComboBox
 |_ EditBox
 |_ Font
 |_ Label
 |_ LayoutPanel
   |_ ImageListView
   |_ Grid
   |_ StackPanel
   |_ TabPanel
 |_ Line
 |_ Image
 |_ MultiProgressBar
 |_ Panel
 |_ ProgressBar
 |_ Scale
 |_ ScrollPanel
 |_ TextBox
 |_ TrackBar
 |_ TreeView
  |_ TreeViewNode
 |_ Window

Viewing the diagram as a tree, each component inherits from its parent in the tree. In practice, this means each component has the properties/functionality of its own type, and also of all components found upwards from it in the tree. For example, a Grid has it's own properties, but also has those of a LayoutPanel, Control and Object.


Example Chili Widgets

Lesson 1 : Hello World

Lesson 2 : Dynamicly change label content

Lesson 3 : Command and Build commands in a chili window