3.5 Selecting from a Range of Values

Modern user interfaces provide widgets such as sliders and rotary dials, for example, volume controls. Such user interface controls can be viewed as a special case of selection control where the underlying set of choices has additional structure in that the available values are well ordered. XForms defines a generic range control that can be used to pick a value from a set of well-ordered values.

Element range returns a single value from the set of available values. As with other XForms controls, the set of available values is declared in the XForms model. Thus, it is meaningless to bind control range to types whose value space is not well ordered. Element range accepts all the common attributes and child elements described in Section 3.2; in addition, special attributes on element range are used to tune the presentation and interaction behavior of the resulting control ”see Figure 3.20 for an example of a volume control authored using element range .

Figure 3.20 Volume control authored using element range .

 <  html   xmlns  ="http://www.w3.org/1999/xhtml"> <  head  ><  title  >Volume Control</  title  > <  model   xmlns  ="http://www.w3.org/2002/xforms"  id  ="sound"  schema  ="units.xsd"> <  instance  > <  settings   xmlns  ="http://example.com/volume"> <  volume   xsi:type  ="percentage"/>... </  settings  ></  instance  > </  model  ></  head  > <  body  > <  group   xmlns  ="http://www.w3.org/2002/xforms"> <  range   model  ="sound"  ref  ="/settings/volume"  appearance  ="full"  step  ="5"> <  label  >Volume</  label  > <  help  >...</  help  ><  hint  >...</  hint  > </  range  ></  group  > </  body  ></  html  > 

start	Optional attribute start specifies the start value to be made available by the control. By default, the start value is the minimum permissible value as defined in the model.
end	Optional attribute end specifies the maximum value to be made available by this control. By default, the end value is the maximum permissible value as defined in the model.
step	Attribute step determines the offset used when moving through the set of available values. If specified, it should be appropriate for expressing the difference between two valid values from the underlying set of values. As an example, when picking from an ordered set of numbers , for example, when setting the volume, specifying step=5 would change the volume in steps of 5.

Notice that the volume control shown in Figure 3.20 uses the minimum and maximum permissible values defined in the model rather than further constraining these via attributes start and end . Attribute step specifies that the volume should be changed in steps of 5. Attribute appearance is set to full to request that the control be presented with the full range of available values; as a result, a visual interface might present this control as a slider that shows both the minimum and maximum acceptable values ”see Figure 3.21.

Figure 3.21. Visual rendering of a volume control created using range .

In contrast, specifying a value of minimal for attribute appearance might result in a presentation that takes up less display real estate.

Specialized widgets such as rotary controls or spin dials might be requested by specifying a namespace qualified value such as

 appearance="my:dial". 

This is similar to requesting a custom date picker as illustrated in Section 3.3. Notice that this design permits the author to create user interfaces that degrade gracefully, that is, the control can be presented as a spin dial on a device that makes such a widget available; however, the interface is still usable on a device that does not contain a spin dial widget. Alternatively, devices that contain a spin dial might choose to use that representation for presenting all range controls; this enables the XForms author to create user interfaces that eventually get delivered in a manner that is optimal for the target device.