I have some complex data & am showing each dataset as a different colour, but I would like to be able to customise the legends.
I am interested in having 2 legends, one with each data set, showing the colour, and preferably, limited to a set number with the option to scroll, and the other showing that solid lines are the left Y axis, and the dashed lines are the right Y axis.
My question is, is there a way to apply a custom skin to the Legend & is there a way to show dashed lines instead of just a big coloured square in the legend?
- Peter Brittain asked 5 years ago
- You must login to post comments
I have a problem with finding “@dimen/legendItemMargin” and other dimens that are from SciChart.
Error APT0000: No resource found that matches the given name (at ‘layout_margin’ with value ‘@dimen/legendItemMargin’). (APT0000)
Its Xamarin.Android project.
Any help?
- Ilija Kocev answered 5 years ago
-
That’s probably because those dimensions are defined in native SciChart library and Xamarin.Android wrapper doesn’t wrap them. Just try to redefine those dimensions in your project. I’m going to update my answer and add dimensions which are used by default by SciChart
- You must login to post comments
That’s great! Thanks for the help!
- Peter Brittain answered 5 years ago
- You must login to post comments
Hi Peter,
You can customize legend item appearance this way:
1. define custom layout for legend item ( I’m using the same layout as default item and you can replace LegendPointMarker on custom View which draws anything you want )
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/legendItemMargin"
android:orientation="horizontal">
<CheckBox
android:id="@+id/isVisible"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textSize="@dimen/legendTextSize"
android:layout_marginLeft="@dimen/legendItemCheckBoxNegativeMargin"
android:layout_marginTop="@dimen/legendItemCheckBoxNegativeMargin"
android:layout_marginRight="@dimen/legendItemCheckBoxNegativeMargin"
android:layout_marginBottom="@dimen/legendItemCheckBoxNegativeMargin" />
<com.scichart.charting.visuals.legend.LegendPointMarker
android:id="@+id/pointMarker"
android:layout_width="@dimen/legendItemPointMarkerWidth"
android:layout_height="match_parent"
android:layout_gravity="center"
android:layout_margin="@dimen/legendItemPointMarkerMargin"
android:layout_marginTop="@dimen/legendItemPointMarkerMargin" />
<TextView
android:id="@+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|start"
android:layout_marginEnd="@dimen/legendItemSeriesNameRightMargin"
android:layout_marginStart="@dimen/legendItemSeriesNameLeftMargin"
android:textSize="@dimen/legendTextSize"
android:textStyle="bold" />
</LinearLayout>
-
Then you need to create a custom class which implements ILegendItem ( wrapper for legend View ) and ILegendItemFactory ( factory which can create items ) interfaces:
class CustomLegendItemFactory implements ILegendItemsFactory { @Override public ILegendItem createLegendItem(ViewGroup parent) { return new CustomLegendItem(LayoutInflater.from(parent.getContext()).inflate(R.layout.custom_legend_item, null)); } } class CustomLegendItem extends LegendItemBase { protected final TextView name; protected final CheckBox checkBox; protected final LegendPointMarker pointMarker; public CustomLegendItem(@NonNull View itemView) { super(itemView); name = (TextView) itemView.findViewById(com.scichart.charting.R.id.name); checkBox = (CheckBox) itemView.findViewById(com.scichart.charting.R.id.isVisible); pointMarker = (LegendPointMarker) itemView.findViewById(com.scichart.charting.R.id.pointMarker); } @Override public void bindSeriesInfo(Object source, SciChartLegend legend) { final SeriesInfo seriesInfo = (SeriesInfo) source; name.setText(seriesInfo.seriesName); checkBox.setChecked(seriesInfo.isVisible()); checkBox.setVisibility(legend.getShowCheckboxes() ? View.VISIBLE : View.GONE); checkBox.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { IRenderableSeries renderableSeries = seriesInfo.renderableSeries; renderableSeries.setIsVisible(((CheckBox) view).isChecked()); renderableSeries.invalidateElement(); } }); pointMarker.setColor(seriesInfo.seriesColor); pointMarker.setVisibility(legend.getShowSeriesMarkers() ? View.VISIBLE : View.GONE); ThemeManager.applyTheme(this, legend.getTheme(), legend.getContext()); } @Override public void applyThemeProvider(IThemeProvider themeProvider) { final FontStyle legendLabelTextStyle = themeProvider.getDefaultLabelTextStyle(); legendLabelTextStyle.initTextView(name); } }
You’ll need to customize bindSeriesInfo() here and instead of pointMarker get your own View and set color to draw.
-
And finally use factory to create LegendModifier and add it into chart’s modifier collection:
legendModifier = new LegendModifier(new SciChartLegend(getActivity()), new SeriesInfoLegendAdapter(new CustomLegendItemFactory()), true); ModifierGroup modifierGroup = sciChartBuilder.newModifierGroup() .withModifier(legendModifier) .build();
By default SciChart library has next dimension which is used by Legend items:
<dimen name="legendTextSize">10sp</dimen>
<dimen name="legendItemMargin">4dp</dimen>
<dimen name="legendItemPointMarkerMargin">4dp</dimen>
<dimen name="legendItemPointMarkerWidth">40dp</dimen>
<dimen name="legendItemSeriesNameLeftMargin">4dp</dimen>
<dimen name="legendItemSeriesNameRightMargin">1dp</dimen>
<!--use negative margin to reduces empty space around check box-->
<dimen name="legendItemCheckBoxNegativeMargin">-5dp</dimen>
Hope this will help you!
Best regards,
Yura
- Yura Khariton answered 5 years ago
- last edited 5 years ago
- You must login to post comments
Please login first to submit.