Spinner widget example

- Main Page
- Related Pages
- Modules
- Data Structures
- Files
- Examples

Spinner widget example

This code places seven Elementary spinner widgets on a window, each of them exemplifying a part of the widget's API.

The first of them is the default spinner:

sp = elm_spinner_add(win);
elm_spinner_add
Evas_Object * elm_spinner_add(Evas_Object *parent)
Add a new spinner widget to the given parent Elementary (container) object.
Definition: elm_spinner.c:1350
evas_object_size_hint_align_set(sp, EVAS_HINT_FILL, 0.5);
evas_object_size_hint_weight_set(sp, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
elm_box_pack_end(bx, sp);
evas_object_show(sp);
EVAS_HINT_EXPAND
#define EVAS_HINT_EXPAND
Use with evas_object_size_hint_weight_set(), evas_object_size_hint_weight_get(), evas_object_size_hin...
Definition: Evas_Common.h:297
EVAS_HINT_FILL
#define EVAS_HINT_FILL
Use with evas_object_size_hint_align_set(), evas_object_size_hint_align_get(), evas_object_size_hint_...
Definition: Evas_Common.h:298
elm_box_pack_end
void elm_box_pack_end(Elm_Box *obj, Efl_Canvas_Object *subobj)
Add an object at the end of the pack list.
Definition: elm_box_eo.legacy.c:57
evas_object_show
EVAS_API void evas_object_show(Evas_Object *eo_obj)
Makes the given Evas object visible.
Definition: evas_object_main.c:1814
evas_object_size_hint_weight_set
EVAS_API void evas_object_size_hint_weight_set(Evas_Object *obj, double x, double y)
Sets the hints for an object's weight.
Definition: evas_object_main.c:2638
evas_object_size_hint_align_set
EVAS_API void evas_object_size_hint_align_set(Evas_Object *obj, double x, double y)
Sets the hints for an object's alignment.
Definition: evas_object_main.c:2650

As you see, the defaults for a spinner are:

- no wrap
- min value set to 0
- max value set to 100
- step value set to 1
- label format set to "%0.f"

If another format is required, see the second spinner. It will put a text before and after the value, and also format value to display two decimals:

elm_spinner_label_format_set(sp, "Percentage %%%1.2f something");
elm_spinner_label_format_set
void elm_spinner_label_format_set(Elm_Spinner *obj, const char *fmt)
Control the format string of the displayed label.
Definition: elm_spinner_eo.legacy.c:63

The third one will use a customized step, define new minimum and maximum values and enable wrap, so when value reaches minimum it jumps to maximum, or jumps to minimum after maximum value is reached. Format is set to display a decimal:

sp = elm_spinner_add(win);
elm_spinner_label_format_set(sp, "%1.1f units");
elm_spinner_step_set(sp, 1.5);
elm_spinner_wrap_set(sp, EINA_TRUE);
elm_spinner_min_max_set(sp, -50.0, 250.0);
evas_object_size_hint_align_set(sp, EVAS_HINT_FILL, 0.5);
evas_object_size_hint_weight_set(sp, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
elm_box_pack_end(bx, sp);
evas_object_show(sp);
EINA_TRUE
#define EINA_TRUE
boolean value TRUE (numerical value 1)
Definition: eina_types.h:539
elm_spinner_wrap_set
void elm_spinner_wrap_set(Elm_Spinner *obj, Eina_Bool wrap)
Control whether the spinner should wrap when it reaches its minimum or maximum value.
Definition: elm_spinner_eo.legacy.c:3
elm_spinner_min_max_set
void elm_spinner_min_max_set(Evas_Object *obj, double min, double max)
Control the minimum and maximum values for the spinner.
Definition: elm_spinner.c:1357
elm_spinner_step_set
void elm_spinner_step_set(Evas_Object *obj, double step)
Control the step used to increment or decrement the spinner value.
Definition: elm_spinner.c:1369

The fourth uses `vertical` style, so instead of left and right arrows, top and bottom are displayed. Also the change interval is reduced, so user can change value faster.

elm_object_style_set(sp, "vertical");
elm_object_style_set
Eina_Bool elm_object_style_set(Evas_Object *obj, const char *style)
Set the style to used by a given widget.
Definition: elm_main.c:1583
elm_spinner_interval_set(sp, 0.2);
elm_spinner_interval_set
void elm_spinner_interval_set(Elm_Spinner *obj, double interval)
Control the interval on time updates for a user mouse button hold on spinner widgets' arrows.
Definition: elm_spinner_eo.legacy.c:15

In the fifth the user won't be allowed to set value directly, i.e., will be obligate change value only using arrows:

elm_spinner_editable_set(sp, EINA_FALSE);
EINA_FALSE
#define EINA_FALSE
boolean value FALSE (numerical value 0)
Definition: eina_types.h:533
elm_spinner_editable_set
void elm_spinner_editable_set(Elm_Spinner *obj, Eina_Bool editable)
Control whether the spinner can be directly edited by the user or not.
Definition: elm_spinner_eo.legacy.c:39

The sixth widget will receive a lot of special values, so instead of reading numeric values, user will see labels for each one. Also direct edition is disabled, otherwise users would see the numeric value on edition mode. User will be able to select a month in this widget:

sp = elm_spinner_add(win);
elm_spinner_editable_set(sp, EINA_FALSE);
elm_spinner_min_max_set(sp, 1, 12);
elm_spinner_special_value_add(sp, 1, "January");
elm_spinner_special_value_add(sp, 2, "February");
elm_spinner_special_value_add(sp, 3, "March");
elm_spinner_special_value_add(sp, 4, "April");
elm_spinner_special_value_add(sp, 5, "May");
elm_spinner_special_value_add(sp, 6, "June");
elm_spinner_special_value_add(sp, 7, "July");
elm_spinner_special_value_add(sp, 8, "August");
elm_spinner_special_value_add(sp, 9, "September");
elm_spinner_special_value_add(sp, 10, "October");
elm_spinner_special_value_add(sp, 11, "November");
elm_spinner_special_value_add(sp, 12, "December");
evas_object_size_hint_align_set(sp, EVAS_HINT_FILL, 0.5);
evas_object_size_hint_weight_set(sp, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
elm_box_pack_end(bx, sp);
evas_object_show(sp);
elm_spinner_special_value_add
void elm_spinner_special_value_add(Elm_Spinner *obj, double value, const char *label)
Control special string to display in the place of the numerical value.
Definition: elm_spinner_eo.legacy.c:75

Finally the last widget will exemplify how to listen to widget's signals, `changed` and `delay,changed` . First we need to implement callback functions that will simply print spinner's value:

static void
_delay_changed_cb(void *data EINA_UNUSED, Evas_Object *obj, void *event_info EINA_UNUSED)
{
printf("Value delay changed to %0.f\n", elm_spinner_value_get(obj));
}
EINA_UNUSED
#define EINA_UNUSED
Used to indicate that a function parameter is purposely unused.
Definition: eina_types.h:339
elm_spinner_value_get
double elm_spinner_value_get(const Evas_Object *obj)
Control the value the spinner displays.
Definition: elm_spinner.c:1387
Evas_Object
Efl_Canvas_Object Evas_Object
An Evas Object handle.
Definition: Evas_Common.h:185
static void
_focused_cb(void *data EINA_UNUSED, Evas_Object *obj EINA_UNUSED, void *event_info EINA_UNUSED)
{
printf("spinner focused\n");
}

The first callback function should be called everytime value changes, the second one only after user stops to increment or decrement. Try to keep arrows pressed and check the difference.

evas_object_smart_callback_add(sp, "focused", _focused_cb, NULL);
evas_object_smart_callback_add
EVAS_API void evas_object_smart_callback_add(Evas_Object *eo_obj, const char *event, Evas_Smart_Cb func, const void *data)
Add (register) a callback function to the smart event specified by event on the smart object obj.
Definition: evas_object_smart.c:1040
evas_object_smart_callback_add(sp, "unfocused", _unfocused_cb, NULL);

See the full example, whose window should look like this picture:

See the full source code for this example.