| 1 |
--- |
| 2 |
title: "Add scrubbing / dragging to number_input widget" |
| 3 |
authors: ["@viridia"] |
| 4 |
pull_requests: [24636, 24701] |
| 5 |
--- |
| 6 |
|
| 7 |
The `FeathersNumberInput` widget has been substantially overhauled, with several new features. |
| 8 |
|
| 9 |
Blender's [numeric input](https://docs.blender.org/manual/en/latest/interface/controls/buttons/fields.html) |
| 10 |
is great, and we've borrowed its best elements. This includes support for multiple |
| 11 |
editing modes — including "scrubbing" (click-and-drag) and direct keyboard |
| 12 |
entry. The updated feathers widget is now much closer to feature parity with Blender. |
| 13 |
|
| 14 |
The widget supports editing numbers of different data types: `f32`, `f64`, `i32` and `i64`. |
| 15 |
|
| 16 |
The behavior of the widget can be configured through the use of several optional components: |
| 17 |
|
| 18 |
- `HardLimit` specifies the minimum and maximum range for the value. If this component is absent, |
| 19 |
then the natural range of the data type is used. |
| 20 |
- `SoftLimit` specifies the range that is accessible via dragging. Numbers that are entered by |
| 21 |
typing can exceed this limit. |
| 22 |
- `NumberInputPrecision` is used to specify the number of decimal points of precision when dragging, |
| 23 |
so that you don't get a bunch of digits jumping around. This only quantizes the value when |
| 24 |
dragging, not when typing. |
| 25 |
- `Step` is used to indicate the delta value when incrementing and decrementing. |
| 26 |
|
| 27 |
When `SoftLimit` is present, the widget will look and feel like a slider: it will draw a slide |
| 28 |
bar in the background, and the drag speed will be calculated such that changes in the bar's size |
| 29 |
will be synchronized with movement of the mouse. |
| 30 |
|
| 31 |
If `SoftLimit` is _not_ present, then the widget behaves more like a "scrubber", where there is |
| 32 |
no slide bar, and drag speed is calculated based on a heuristic that takes into account precision, |
| 33 |
step, and the current input value. |
| 34 |
|
| 35 |
In either of this cases, a non-drag click event will activate "typing" mode, where a value can |
| 36 |
be entered by typing digits. |
| 37 |
|
| 38 |
Like all feathers widgets, this is a "controlled" widget, which means that the internal numeric |
| 39 |
value is not automatically updated, but instead relies on the application's event handlers to |
| 40 |
update the widget state in response to `ValueChange` events. Check out the `feathers_number_input` |
| 41 |
example to see how to write such a handler trivially. |