2015-04-21 09:41:52 -06:00
# termui [![Build Status](https://travis-ci.org/gizak/termui.svg?branch=master)](https://travis-ci.org/gizak/termui) [![Doc Status](https://godoc.org/github.com/gizak/termui?status.png)](https://godoc.org/github.com/gizak/termui)
2015-03-20 19:11:58 -06:00
2015-10-27 13:29:37 -06:00
< img src = "./_example/dashboard.gif" alt = "demo cast under osx 10.10; Terminal.app; Menlo Regular 12pt.)" width = "80%" >
2015-06-23 13:11:22 -06:00
2015-10-27 13:24:29 -06:00
`termui` is a cross-platform, easy-to-compile, and fully-customizable terminal dashboard. It is inspired by [blessed-contrib ](https://github.com/yaronn/blessed-contrib ), but purely in Go.
2015-03-20 19:11:58 -06:00
2015-10-27 13:24:29 -06:00
Now version v2 has arrived! It brings new event system, new theme system, new `Buffer` interface and specific colour text rendering.
2015-02-08 10:00:00 -07:00
2015-10-27 13:24:29 -06:00
## Installation
2015-03-15 13:56:38 -06:00
2015-10-27 13:24:29 -06:00
`master` mirrors v2 branch, to install:
2015-03-20 06:24:48 -06:00
2015-10-27 13:24:29 -06:00
go get -u github.com/gizak/termui
2015-03-20 06:24:48 -06:00
2015-10-27 13:24:29 -06:00
For the compatible reason, you can choose to install the legacy version of `termui` :
2015-03-20 06:24:48 -06:00
2015-10-27 13:24:29 -06:00
go get gopkg.in/gizak/termui.v1
2015-03-15 13:56:38 -06:00
2015-10-27 13:24:29 -06:00
## Usage
2015-02-08 10:00:00 -07:00
2015-10-27 13:24:29 -06:00
### Layout
2015-02-08 10:00:00 -07:00
2015-10-27 13:24:29 -06:00
To use `termui` , the very first thing you may want to know is how to manage layout. `termui` offers two ways of doing this, known as absolute layout and grid layout.
2015-02-08 10:00:00 -07:00
2015-10-27 13:24:29 -06:00
__Absolute layout__
2015-02-08 10:07:18 -07:00
2015-10-27 13:24:29 -06:00
Each widget has an underlying block structure which basically is a box model. It has border, label and padding properties. A border of a widget can be chosen to hide or display (with its border label), you can pick a different front/back colour for the border as well. To display such a widget at a specific location in terminal window, you need to assign `.X` , `.Y` , `.Height` , `.Width` values for each widget before send it to `.Render` . Let's demonstrate these by a code snippet:
2015-02-08 10:00:00 -07:00
`````go
import ui "github.com/gizak/termui" // < - ui shortcut , optional
func main() {
err := ui.Init()
if err != nil {
panic(err)
}
defer ui.Close()
2015-03-11 14:51:18 -06:00
p := ui.NewPar(":PRESS q TO QUIT DEMO")
2015-02-08 10:00:00 -07:00
p.Height = 3
p.Width = 50
p.TextFgColor = ui.ColorWhite
2015-10-27 13:24:29 -06:00
p.BorderLabel = "Text Box"
p.BorderFg = ui.ColorCyan
2015-02-08 10:00:00 -07:00
g := ui.NewGauge()
g.Percent = 50
g.Width = 50
g.Height = 3
g.Y = 11
g.Border.Label = "Gauge"
g.BarColor = ui.ColorRed
2015-10-27 13:24:29 -06:00
g.BorderFg = ui.ColorWhite
g.BorderLabelFg = ui.ColorCyan
2015-02-08 10:00:00 -07:00
2015-10-27 13:24:29 -06:00
ui.Render(p, g) // feel free to call Render, it's async and non-block
2015-02-08 10:00:00 -07:00
// event handler...
}
`````
2015-03-11 14:15:59 -06:00
Note that components can be overlapped (I'd rather call this a feature...), `Render(rs ...Renderer)` renders its args from left to right (i.e. each component's weight is arising from left to right).
2015-10-27 13:24:29 -06:00
__Grid layout:__
2015-03-11 14:15:59 -06:00
2015-10-27 13:29:37 -06:00
< img src = "./_example/grid.gif" alt = "grid" width = "60%" >
2015-10-27 13:24:29 -06:00
Grid layout uses [12 columns grid system ](http://www.w3schools.com/bootstrap/bootstrap_grid_system.asp ) with expressive syntax. To use `Grid` , all we need to do is build a widget tree consisting of `Row` s and Cols (Actually a Col is also a `Row` but with a widget endpoint attached).
2015-03-11 14:15:59 -06:00
2015-03-11 14:22:55 -06:00
```go
2015-10-27 13:24:29 -06:00
import ui "github.com/gizak/termui"
// init and create widgets...
2015-03-13 11:20:17 -06:00
2015-10-27 13:24:29 -06:00
// build
ui.Body.AddRows(
ui.NewRow(
ui.NewCol(6, 0, widget0),
ui.NewCol(6, 0, widget1)),
ui.NewRow(
ui.NewCol(3, 0, widget2),
ui.NewCol(3, 0, widget30, widget31, widget32),
ui.NewCol(6, 0, widget4)))
2015-03-13 11:20:17 -06:00
2015-10-27 13:24:29 -06:00
// calculate layout
ui.Body.Align()
2015-03-13 11:20:17 -06:00
2015-10-27 13:24:29 -06:00
ui.Render(ui.Body)
```
2015-03-13 11:20:17 -06:00
2015-10-27 13:24:29 -06:00
### Events
2015-03-13 11:20:17 -06:00
2015-10-27 13:24:29 -06:00
`termui` ships with a http-like event mux handling system. All events are channeled up from different sources (typing, click, windows resize, custom event) and then encoded as universal `Event` object. `Event.Path` indicates the event type and `Event.Data` stores the event data struct. Add a handler to a certain event is easy as below:
2015-03-13 11:20:17 -06:00
2015-10-27 13:24:29 -06:00
```go
// handle key q pressing
termui.Handle("/sys/kbd/q", func(termui.Event) {
// press q to quit
termui.StopLoop()
})
termui.Handle("/sys/kbd/C-x", func(termui.Event) {
// handle Ctrl + x combination
})
termui.Handle("/sys/kbd", func(termui.Event) {
// handle all other key pressing
})
// handle a 1s timer
termui.Handle("/timer/1s", func(e ui.Event) {
t := e.Data.(termui.EvtTimer)
// t is a EvtTimer
if t.Count%2 ==0 {
// do something
}
})
2015-04-27 18:27:11 -06:00
2015-10-27 13:24:29 -06:00
ui.Loop() // block until StopLoop is called
```
2015-04-27 18:27:11 -06:00
2015-10-27 13:24:29 -06:00
### Widgets
2015-03-13 11:20:17 -06:00
2015-10-27 13:24:29 -06:00
Click image to see the corresponding demo codes.
2015-03-13 11:20:17 -06:00
2015-10-27 13:34:47 -06:00
[<img src="./_example/par.png" alt="par" type="image/png" width="45%"> ](https://github.com/gizak/termui/blob/master/_example/par.go )
[<img src="./_example/list.png" alt="list" type="image/png" width="45%"> ](https://github.com/gizak/termui/blob/master/_example/list.go )
[<img src="./_example/gauge.png" alt="gauge" type="image/png" width="45%"> ](https://github.com/gizak/termui/blob/master/_example/gauge.go )
[<img src="./_example/linechart.png" alt="linechart" type="image/png" width="45%"> ](https://github.com/gizak/termui/blob/master/_example/linechart.go )
[<img src="./_example/barchart.png" alt="barchart" type="image/png" width="45%"> ](https://github.com/gizak/termui/blob/master/_example/barchart.go )
[<img src="./_example/mbarchart.png" alt="barchart" type="image/png" width="45%"> ](https://github.com/gizak/termui/blob/master/_example/mbarchart.go )
[<img src="./_example/sparklines.png" alt="sparklines" type="image/png" width="45%"> ](https://github.com/gizak/termui/blob/master/_example/sparklines.go )
2015-02-08 10:00:00 -07:00
## GoDoc
2015-03-13 11:26:51 -06:00
[godoc ](https://godoc.org/github.com/gizak/termui )
2015-02-08 10:00:00 -07:00
2015-03-13 11:20:17 -06:00
## TODO
2015-03-20 06:24:48 -06:00
- [x] Grid layout
2015-10-27 13:24:29 -06:00
- [x] Event system
- [x] Canvas widget
- [x] Refine APIs
2015-03-20 06:24:48 -06:00
- [ ] Focusable widgets
2015-03-13 11:20:17 -06:00
2015-10-27 13:24:29 -06:00
## Changelog
2015-02-08 10:00:00 -07:00
## License
This library is under the [MIT License ](http://opensource.org/licenses/MIT )