onLabelCreated property

RangeSelectorLabelCreatedCallback? onLabelCreated
final

Signature for customizing the text and style of numeric or date labels.

  • The actual value without formatting is given by actualValue. It is either DateTime or double based on given initialValues or controller start and end values.
  • The formatted value based on the numeric or date format is given by formattedText.
  • Text styles can be applied to individual labels using the textStyle property.

This snippet shows how to format and style labels in SfRangeSelector.

SfRangeValues _initialValues = const SfRangeValues(3.0, 7.0); SfRangeSelector( min: 3.0, max: 8.0, initialValues: _initialValues, interval: 1, showLabels: true, onChanged: (SfRangeValues newValues) { setState(() { _initialValues = newValues; }); }, onLabelCreated: ( dynamic actualValue, String formattedText, TextStyle textStyle, ) { final int value = actualValue.toInt(); final int startIndex = _initialValues.start.toInt(); final int endIndex = _initialValues.end.toInt(); return RangeSelectorLabel( text: value == startIndex || value == endIndex ? '$formattedText' : '$actualValue', textStyle: value == startIndex || value == endIndex ? const TextStyle( color: Colors.purple, fontSize: 18, fontWeight: FontWeight.bold, ) : textStyle, ); }, child: Container( height: 200, color: Colors.green[100], ), ) 

Implementation

final RangeSelectorLabelCreatedCallback? onLabelCreated;