Widgets
Widgets is an obsolete application just for demonstrating how to use different type of widgets and getting touch with them. Written in plain Ano script, no C involved.
User interface
There is dummy widgets to play with.
Compilation
Easiest way to get Widgets running is to go to examples directory in package root, and run:
$ ./build.sh gui_widgets
build.sh script compiles Ano script, menu and widget definitions to C, copies source files in place and pops up instructions what to do next. Follow them. Check also examples/README for more info.
Preview
;
; This is dummy application to demonstrate widget outlook.
;
; @ANO_SCRIPT_NAME gui_widgets
; @ANO_SCRIPT_VERSION 0.0.6
; @ANO_SCRIPT_DESCRIPTION Widget demo
;
; @ANO_FLAGS_VAR_NAME_SUBS [ ]
; @ANO_FLAGS_VAR_WARN_UNUSED [ ]
;
; Copyright (c) 2016-2025, Jani Salonen <salojan@goto10.co>
; All rights reserved.
;
main {
; Global uninitialized variables
var [handle] hnd_wnd_main
; Initialize windowing system...
gui_enabled {
window_init
; ...and open main window
window_open (\
title_name: "Widgets", \
title_charset: NULL, \
parent_handle: NOPARENT, \
widget_stack_id: 1, \
widget_set: 0, \
window_refresh_divider: PASSIVE_REFRESH, \
position_x: POS_CENTERED, \
position_y: POS_CENTERED, \
size_width: 800, \
size_height: 900, \
cb_main_loop: NULL, \
cb_expose: NULL, \
cb_key_press: NULL, \
cb_key_release: NULL, \
cb_button_press: NULL, \
cb_button_release: NULL, \
cb_client_message: NULL, \
cb_save_yourself: NULL, \
cb_configure_notify: NULL, \
cb_destroy_notify: "cb_destroy", \
cb_motion_notify: NULL, \
cb_map_notify: NULL, \
cb_unmap_notify: NULL, \
cb_open_notify: "cb_open")
}
}
_WINCB_OPEN_ callback cb_open (_hnd) {
mov hnd_wnd_main (_hnd)
mov color (# 0xff, 0xff, 0xff, 0x00)
; Create scales and indicators
widget_update_scale_bars (hnd_wnd_main, \
"widget_a", NULL, NULL, 7, 0, 0, 100, 11, color)
widget_indicator_set (hnd_wnd_main, \
"widget_a", NULL, NULL, 7, 0, color, INDICATOR_ALWAYS, 20, \
0, 0, 0, 0, NULL)
widget_indicator_set (hnd_wnd_main, \
"widget_b", NULL, NULL, 7, 0, color, INDICATOR_ALWAYS, 20, \
0, 0, 0, 0, NULL)
widget_indicator_set (hnd_wnd_main, \
"widget_c", NULL, NULL, 7, 0, color, INDICATOR_ALWAYS, 20, \
0, 0, 0, 0, NULL)
widget_indicator_set (hnd_wnd_main, \
"widget_d", NULL, NULL, 7, 0, color, INDICATOR_ALWAYS, 20, \
0, 0, 0, 0, NULL)
widget_indicator_set (hnd_wnd_main, \
"widget_e", NULL, NULL, 7, 0, color, INDICATOR_ALWAYS, 20, \
0, 0, 0, 0, NULL)
widget_indicator_set (hnd_wnd_main, \
"widget_f", NULL, NULL, 7, 0, color, INDICATOR_ALWAYS, 20, \
0, 0, 0, 0, NULL)
widget_update_scale_bars (hnd_wnd_main, \
"slider_a", NULL, NULL, 7, 0, 0, 10, 11, color)
widget_update_scale_bars (hnd_wnd_main, \
"slider_b", NULL, NULL, 7, 0, 0, 20, 5, color)
; Map main window
_hnd.map()
}
_WINCB_DESTROY_ callback cb_destroy (_hnd) {
_hnd.destroy()
exit
}
_WIDGETCB_TURN_ callback cb_turn_a (_widget_name, _widget_id, _min, _max, _steps, _step) {
dump _widget_name
dump _step
}
_WIDGETCB_TURN_ callback cb_turn_b (_widget_name, _widget_id, _min, _max, _steps, _step) {
dump _widget_name
dump _step
}
_WIDGETCB_TURN_ callback cb_turn_c (_widget_name, _widget_id, _min, _max, _steps, _step) {
dump _widget_name
dump _step
}
_WIDGETCB_TURN_ callback cb_turn_d (_widget_name, _widget_id, _min, _max, _steps, _step) {
dump _widget_name
dump _step
}
_WIDGETCB_TURN_ callback cb_turn_e (_widget_name, _widget_id, _min, _max, _steps, _step) {
dump _widget_name
dump _step
}
_WIDGETCB_TURN_ callback cb_turn_f (_widget_name, _widget_id, _min, _max, _steps, _step) {
dump _widget_name
dump _step
; Widget even step turns light on, odd step turns it off
mov _s (_step % 2)
; Which lights to set is based on widget step
cmp _step (1)
ja "cb_turn_f_a"
mov _a ("lamp_a")
mov _b ("led_a_a")
mov _c ("led_b_a")
mov _d ("led_c_a")
jmp "cb_turn_f_x"
cb_turn_f_a:
cmp _step (3)
ja "cb_turn_f_b"
mov _a ("lamp_b")
mov _b ("led_a_b")
mov _c ("led_b_b")
mov _d ("led_c_b")
jmp "cb_turn_f_x"
cb_turn_f_b:
cmp _step (5)
ja "cb_turn_f_c"
mov _a ("lamp_c")
mov _b ("led_a_c")
mov _c ("led_b_c")
mov _d ("led_c_c")
jmp "cb_turn_f_x"
cb_turn_f_c:
cmp _step (7)
ja "cb_turn_f_d"
mov _a ("lamp_d")
mov _b ("led_a_d")
mov _c ("led_b_d")
mov _d ("led_c_d")
jmp "cb_turn_f_x"
cb_turn_f_d:
cmp _step (9)
ja "cb_turn_f_e"
mov _a ("lamp_e")
mov _b ("led_a_e")
mov _c ("led_b_e")
mov _d ("led_c_e")
jmp "cb_turn_f_x"
cb_turn_f_e:
mov _a ("lamp_f")
mov _b ("led_a_f")
mov _c ("led_b_f")
mov _d ("led_c_f")
cb_turn_f_x:
widget_step_set (hnd_wnd_main, _a, _s)
widget_step_set (hnd_wnd_main, _b, _s)
widget_step_set (hnd_wnd_main, _c, _s)
widget_step_set (hnd_wnd_main, _d, _s)
; widget_refresh (hnd_wnd_main)
}
_WIDGETCB_PUSH_ callback cb_push_a (_widget_name, _widget_id, _min, _max, _steps, _step) {
dump _widget_name
dump _step
}
_WIDGETCB_PUSH_ callback cb_push_b (_widget_name, _widget_id, _min, _max, _steps, _step) {
dump _widget_name
dump _step
}
_WIDGETCB_PUSH_ callback cb_push_c (_widget_name, _widget_id, _min, _max, _steps, _step) {
dump _widget_name
dump _step
widget_step_set (hnd_wnd_main, "led_button_c", _step)
; widget_refresh (hnd_wnd_main)
}
;
; Copyright (c) 2016-2025, Jani Salonen <salojan@goto10.co>
; All rights reserved.
;
; @WIDGET_DEFAULT_COLOR rgb:#ffffff
; @WIDGET_DEFAULT_HUE 0
; @WIDGET_DEFAULT_LIGHT no
; @WIDGET_DEFAULT_STATE enable
; @WIDGET_DEFAULT_STICKY no
; @WIDGET_DEFAULT_TITLE_CHARSET UTF-8
; @WIDGET_DEFAULT_TITLE_COLOR rgb:#ffffff
; @WIDGET_DEFAULT_TITLE_DPI 0
; WIDGET_DEFAULT_TITLE_FONT path_to_the_font_file
; @WIDGET_DEFAULT_TITLE_JUSTIFICATION center
; @WIDGET_DEFAULT_TITLE_POSITION above
; @WIDGET_DEFAULT_TITLE_SIZE 11
; @WIDGET_DEFAULT_TRIGGER constant
; @WIDGET_DEFAULT_TYPE 0
; @WIDGET_DEFAULT_VALUE 0
;
; @WIDGET_USE_BOUNDING_BOXES no
;
window "1" {
set "0" {
widget "background" {
name "background"
image "examples/datafiles/background.tga"
}
; Turnswitch type 0
widget "turnswitch" {
name "widget_a"
position x = 80, y = 100
angle min = 45, max = 315
steps start = 0, total = 100
title "Large chicken head", \
x = 0, y = -50
action turn = cb_turn_a
}
; Turnswitch type 1
widget "turnswitch" {
name "widget_b"
type 1
position x = 280, y = 108
angle min = 45, max = 315
steps start = 0, total = 100
title "Small chicken head", \
x = 0, y = -20
action turn = cb_turn_b
}
; Turnswitch type 2
widget "turnswitch" {
name "widget_c"
type 2
position x = 88, y = 310
angle min = 1, max = 359
steps start = 0, total = 359
title "Large round", \
x = 0, y = -20
action turn = cb_turn_c
}
; Turnswitch type 3
widget "turnswitch" {
name "widget_d"
type 3
position x = 296, y = 318
angle min = 1, max = 359
steps start = 0, total = 359
title "Small round", \
x = 0, y = -20
action turn = cb_turn_d
}
; Turnswitch type 4
widget "turnswitch" {
name "widget_e"
type 4
position x = 96, y = 500
angle min = 5, max = 355
steps start = 0, total = 9
title "Large flat-top", \
x = 0, y = -20
action turn = cb_turn_e
}
; Turnswitch type 5
widget "turnswitch" {
name "widget_f"
type 5
position x = 304, y = 508
angle min = 5, max = 355
steps start = 0, total = 11
title "Lights, please!", \
x = 0, y = -20
action turn = cb_turn_f
}
; Lamp type 0
widget "lamp" {
name "lamp_a"
position x = 440, y = 80
title "Red lamp", \
x = 0, y = -10
}
; Lamp type 1
widget "lamp" {
name "lamp_b"
type 1
position x = 558, y = 80
title "Orange", \
x = 0, y = -10
}
; Lamp type 2
widget "lamp" {
name "lamp_c"
type 2
position x = 676, y = 80
title "White", \
x = 0, y = -10
}
; Lamp type 3
widget "lamp" {
name "lamp_d"
type 3
position x = 440, y = 240
title "Green", \
x = 0, y = -10
}
; Lamp type 4
widget "lamp" {
name "lamp_e"
type 4
position x = 558, y = 240
title "Blue", \
x = 0, y = -10
}
; Lamp type 5
widget "lamp" {
name "lamp_f"
type 5
position x = 676, y = 240
title "Purple", \
x = 0, y = -10
}
; Led type 1, subtype 0
widget "led_1" {
name "led_a_a"
position x = 460, y = 400
}
; Led type 1, subtype 1
widget "led_1" {
name "led_a_b"
type 1
position x = 460, y = 432
}
; Led type 1, subtype 2
widget "led_1" {
name "led_a_c"
type 2
position x = 460, y = 464
}
; Led type 1, subtype 3
widget "led_1" {
name "led_a_d"
type 3
position x = 460, y = 496
}
; Led type 1, subtype 4
widget "led_1" {
name "led_a_e"
type 4
position x = 460, y = 528
}
; Led type 1, subtype 5
widget "led_1" {
name "led_a_f"
type 5
position x = 460, y = 560
}
; Led type 2, subtype 0
widget "led_2" {
name "led_b_a"
position x = 584, y = 400
}
; Led type 2, subtype 1
widget "led_2" {
name "led_b_b"
type 1
position x = 584, y = 432
}
; Led type 2, subtype 2
widget "led_2" {
name "led_b_c"
type 2
position x = 584, y = 464
}
; Led type 2, subtype 3
widget "led_2" {
name "led_b_d"
type 3
position x = 584, y = 496
}
; Led type 2, subtype 4
widget "led_2" {
name "led_b_e"
type 4
position x = 584, y = 528
}
; Led type 2, subtype 5
widget "led_2" {
name "led_b_f"
type 5
position x = 584, y = 560
}
; Led type 3, subtype 0
widget "led_3" {
name "led_c_a"
position x = 716, y = 396
}
; Led type 3, subtype 1
widget "led_3" {
name "led_c_b"
type 1
position x = 716, y = 428
}
; Led type 3, subtype 2
widget "led_3" {
name "led_c_c"
type 2
position x = 716, y = 460
}
; Led type 3, subtype 3
widget "led_3" {
name "led_c_d"
type 3
position x = 716, y = 492
}
; Led type 3, subtype 4
widget "led_3" {
name "led_c_e"
type 4
position x = 716, y = 524
}
; Led type 3, subtype 5
widget "led_3" {
name "led_c_f"
type 5
position x = 716, y = 556
}
; Pushbutton type 1, subtype 0
widget "pushbutton_1" {
name "button_a"
position x = 514, y = 420
title "Red button", \
size = 10, x = 0, y = -10
action push = cb_push_a
}
; Pushbutton type 2, subtype 1
widget "pushbutton_2" {
name "button_b"
type 1
position x = 510, y = 480
title "Yellow", \
size = 10, x = 0, y = -10
action push = cb_push_b
}
; Pushbutton type 3, subtype 2
widget "pushbutton_3" {
name "button_c"
type 2
position x = 510, y = 548
title "Sticky", \
size = 10, x = 0, y = -10
sticky yes
action push = cb_push_c
}
; Led for sticky button
widget "led_1" {
name "led_button_c"
type 3
position x = 654, y = 548
title "Sticky?", \
size = 10, x = 0, y = -10
}
; Pushbutton type 1, subtype 3
widget "pushbutton_1" {
name "button_d"
type 3
position x = 646, y = 400
action push = cb_push_a
}
; Pushbutton type 1, subtype 4
widget "pushbutton_1" {
name "button_e"
type 4
position x = 646, y = 430
action push = cb_push_a
}
; Pushbutton type 1, subtype 5
widget "pushbutton_1" {
name "button_f"
type 5
position x = 646, y = 460
action push = cb_push_a
}
; Sliders
widget "slideswitch" {
name "slider_a"
type 1
position x = 70, y = 680
slide length = 100, start = 0, total = 100
title "Channel A", \
size = 10, x = 0, y = -10
trigger release
action slide = cb_turn_a
}
widget "slideswitch" {
name "slider_b"
type 1
position x = 170, y = 680
slide length = 100, start = 0, total = 100
title "Channel B", \
size = 10, x = 0, y = -10
trigger release
action slide = cb_turn_a
}
widget "slideswitch" {
name "slider_c"
type 3
position x = 280, y = 704
slide length = 100, start = 0, total = 100
title "Channel C", \
size = 10, x = 0, y = -34
trigger release
action slide = cb_turn_a
}
widget "slideswitch" {
name "slider_d"
type 3
position x = 360, y = 704
slide length = 100, start = 0, total = 100
title "Channel D", \
size = 10, x = 0, y = -34
trigger release
action slide = cb_turn_a
}
widget "slideswitch" {
name "slider_e"
type 5
position x = 470, y = 680
slide length = 100, start = 0, total = 100
title "Channel E", \
size = 10, x = 0, y = -10
trigger release
action slide = cb_turn_a
}
widget "slideswitch" {
name "slider_f"
type 5
position x = 550, y = 680
slide length = 100, start = 0, total = 100
title "Channel F", \
size = 10, x = 0, y = -10
trigger release
action slide = cb_turn_a
}
widget "slideswitch" {
name "slider_g"
type 0
position x = 650, y = 680
slide length = 50, start = 0, total = 100
title "More sliders", \
size = 10, x = 0, y = -10
trigger release
action slide = cb_turn_a
}
widget "slideswitch" {
name "slider_h"
type 0
position x = 650, y = 740
slide length = 50, start = 0, total = 100
trigger release
action slide = cb_turn_a
}
}
}
Screenshots
Click to enlarge.
;)
Lights off
|
;)
Lights on
|
Copyright © 2025, Jani Salonen <salojan at goto10 piste co>. Piste is finnish word and means dot. All rights reserved.