Tooltips Customization
In SciChart, you can fully customize tooltips for TooltipModifier, RolloverModifier and CursorModifier. Those customizations can be achieved via the ISeriesInfoProvider and ISeriesTooltip protocols. Moreover - tooltips can be made unique per a RenderableSeries instance via the setSeriesInfoProvider(renderableSeries.hitTest.ISeriesInfoProvider seriesInfoProvider) method.
We have several examples (listed below) which shows how to customize tooltips for the modifiers:
- Customization of Tooltip Modifier Tooltips
- Customization of Rollover Modifier Tooltips
- Customization of Cursor Modifier Tooltips
Note
All examples can be found in the SciChart Android Examples Suite as well as on GitHub:
To have fully custom tooltip for your modifier, you will need to provide custom ISeriesInfoProvider for your RenderableSeries via inheriting from SeriesInfoProviderBase<TRenderableSeries,TSeriesInfo> which contains some base functionality. From there - you might want to override one of the following (or both):
- getSeriesInfoInternal() - allows to provide custom implementation of SeriesInfo<T>, which simply contains information about a RenderableSeries and should be created based on it
- getSeriesTooltipInternal(Context context, TSeriesInfo seriesInfo, Class<?> modifierType) - allows to provide custom tooltip for your series, based on
seriesInfo
andmodifierType
Customization of Rollover Modifier Tooltips
Let's consider Customization of Rollover Modifier Tooltips as an example, since customizations for other modifiers are nearly the same.
Note
Full example sources are available in Android Chart Custom RolloverModifier
First thing, we will need to create custom ISeriesTooltip and implement internalUpdate(T seriesInfo) method in which we update tooltip instance based on passed in SeriesInfo<T> instance. Then, in custom ISeriesInfoProvider we override getSeriesTooltipInternal(Context context, TSeriesInfo seriesInfo, Class<?> modifierType) and provide our custom tooltip for RolloverModifier type, since we want to customize tooltips only for RolloverModifier. Finally, we provide our custom SeriesInfoProvider to our RenderableSeries instance via the corresponding property.
Let's see the code below:
class CustomSeriesInfoProvider extends DefaultXySeriesInfoProvider {
@Override
protected ISeriesTooltip getSeriesTooltipInternal(Context context, XySeriesInfo<?> seriesInfo, Class<?> modifierType) {
if (modifierType == CursorModifier.class) {
return new CustomSeriesInfoProvider.CustomXySeriesTooltip(context, seriesInfo);
} else {
return super.getSeriesTooltipInternal(context, seriesInfo, modifierType);
}
}
class CustomXySeriesTooltip extends XySeriesTooltip {
public CustomXySeriesTooltip(Context context, XySeriesInfo<?> seriesInfo) {
super(context, seriesInfo);
final DisplayMetrics displayMetrics = context.getResources().getDisplayMetrics();
final int padding = Math.round(TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 1f, displayMetrics));
this.setPadding(padding, padding, padding, padding);
}
@Override
protected void internalUpdate(XySeriesInfo seriesInfo) {
final SpannableStringBuilder sb = new SpannableStringBuilder();
if (seriesInfo.seriesName != null) {
sb.append(seriesInfo.seriesName).append(" - ");
}
sb.append("X: ").append(seriesInfo.getFormattedXValue());
sb.append(" Y: ").append(seriesInfo.getFormattedYValue());
setText(sb);
setTooltipBackgroundColor(0xff6495ed);
setTooltipStroke(0xff4d81dd);
setTooltipTextColor(ColorUtil.White);
}
}
}
final FastLineRenderableSeries line = new FastLineRenderableSeries();
line.setSeriesInfoProvider(new CustomSeriesInfoProvider());
Note
A custom Tooltip has to implement the ISeriesTooltip or extend the SeriesTooltipBase<T> class, which is derived from TextView.
Customization of Tooltip Modifier Tooltips
Note
Full example source code is available in Android Chart Custom Tooltips
Customization of Cursor Modifier Tooltips
Note
Full example sources is available in Android Chart Custom Cursors
Axis Tooltips Customization
Axes tooltips for modifiers are customized the same way as Series Tooltips - via custom AxisTooltip and IAxisInfoProvider. Please see the code below, which is from the same Android Chart Custom RolloverModifier example:
class CustomAxisInfoProvider extends DefaultAxisInfoProvider {
@Override
protected IAxisTooltip getAxisTooltipInternal(Context context, AxisInfo axisInfo, Class<?> modifierType) {
if (modifierType == RolloverModifier.class) {
return new CustomAxisTooltip(context, axisInfo);
} else {
return super.getAxisTooltipInternal(context, axisInfo, modifierType);
}
}
class CustomAxisTooltip extends AxisTooltip {
public CustomAxisTooltip(Context context, AxisInfo axisInfo) {
super(context, axisInfo);
setTooltipBackground(0xff6495ed);
}
@Override
protected boolean updateInternal(AxisInfo axisInfo) {
final SpannableStringBuilder sb = new SpannableStringBuilder();
sb.append("Axis ID: ").append(axisInfo.axisId).append(StringUtil.NEW_LINE);
sb.append("Value: ").append(axisInfo.axisFormattedDataValue);
setText(sb);
return true;
}
}
}
final NumericAxis xAxis = new NumericAxis(getContext());
xAxis.setAxisInfoProvider(new CustomAxisInfoProvider());