I have graphs on two adjacent fragments, and when I select one, then swap to the other, the legend draws like this.
I believe it is because I am setting up & drawing the graph when it is off screen. As when you are viewing a fragment it loads the ones to either side for smooth operation, but is there any way to fix this? Maybe I’m doing something wrong and that’s why I’m getting the weird check boxes.
To be clear, these are all checked, but they look weird to our end-users
- Peter Brittain asked 5 years ago
-
Hi Peter. Your legend looks custom because for now we don’t support dashed line in legend so I want to ask if tried to use default legend implementation. Also can you post some code which will allow us to reproduce this issue on our side? If you don’t want to share your code on forums you can open a support ticket and attach your project there. Thanks in advance.
- You must login to post comments
You know, you’re right! I had added that so early in the project, I totally forgot that it was a custom legend! I actually was hoping to limit the maximum height of the legend to only 3 or 4 entries, and having them scroll through those, but that is for a different time. It is tricky because scrolling views with check-boxes both want the touch event.
As for the weird checkbox visuals, I haven’t tried it with a stock legend (as I had forgotten I was using a custom one).
I realise that the dashed line is a bit of a hack, and I could probably have accomplished a similar thing using a dashed drawline, but that is how I was able to get it to look the way I wanted.
loading up the legend is here
LegendModifier legMod = new LegendModifier(new SciChartLegend(getActivity()), new SeriesInfoLegendAdapter(new CustomLegendItemFactory()), true);
legMod.setLegendPosition(Gravity.LEFT | Gravity.TOP, 10);
legMod.setOrientation(Orientation.VERTICAL);
legMod.setSourceMode(SourceMode.AllSeries);
ModifierGroup legendModifier = sciChartBuilder.newModifierGroup()
.withModifier(legMod)
.build();
chart.getChartModifiers().add(legendModifier);
This is the legend factory
package com.example.www.Utilities;
import android.app.ActionBar;
import android.support.annotation.NonNull;
import android.support.constraint.ConstraintLayout;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.CheckBox;
import android.widget.LinearLayout;
import android.widget.TextView;
import com.scichart.charting.themes.IThemeProvider;
import com.scichart.charting.themes.ThemeManager;
import com.scichart.charting.visuals.legend.*;
import com.scichart.charting.visuals.renderableSeries.IRenderableSeries;
import com.scichart.charting.visuals.renderableSeries.hitTest.SeriesInfo;
import com.scichart.drawing.common.FontStyle;
import com.example.www.R;
public class CustomLegendItemFactory implements ILegendItemsFactory {
@Override
public ILegendItem createLegendItem(ViewGroup parent) {
return new CustomLegendItem(LayoutInflater.from(parent.getContext()).inflate(R.layout.legend_item, null));
}
}
class CustomLegendItem extends LegendItemBase {
protected final LinearLayout item;
protected final TextView name;
protected final CheckBox checkBox;
protected final LegendPointMarker pointMarker;
protected final LegendPointMarker dashMarkerA;
protected final LegendPointMarker dashMarkerB;
protected final LegendPointMarker dashMarkerC;
protected final ConstraintLayout dashMarker;
public CustomLegendItem(@NonNull View itemView) {
super(itemView);
item = (LinearLayout) 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);
dashMarkerA = (LegendPointMarker) itemView.findViewById(R.id.dashMarker1);
dashMarkerB = (LegendPointMarker) itemView.findViewById(R.id.dashMarker2);
dashMarkerC = (LegendPointMarker) itemView.findViewById(R.id.dashMarker3);
dashMarker = itemView.findViewById(R.id.dashMarker);
}
@Override
public void bindSeriesInfo(Object source, SciChartLegend legend) {
final SeriesInfo seriesInfo = (SeriesInfo) source;
name.setText(seriesInfo.seriesName);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(ActionBar.LayoutParams.WRAP_CONTENT, ActionBar.LayoutParams.WRAP_CONTENT);
params.setMarginEnd(5);
name.setLayoutParams(params);
checkBox.setVisibility(legend.getShowCheckboxes() ? View.VISIBLE : View.GONE);
checkBox.setChecked(seriesInfo.isVisible());
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);
dashMarkerA.setColor(seriesInfo.seriesColor);
dashMarkerB.setColor(seriesInfo.seriesColor);
dashMarkerC.setColor(seriesInfo.seriesColor);
Boolean isDisp = false;
if (name.getText().toString().contains("_d"))
isDisp = true;
pointMarker.setVisibility(isDisp ? View.GONE : View.VISIBLE);
dashMarker.setVisibility(isDisp ? 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);
}
}
and finally, my legend.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/legend_item"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
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="4sp"
android:layout_gravity="center"
android:layout_margin="@dimen/legendItemPointMarkerMargin"
android:layout_marginTop="@dimen/legendItemPointMarkerMargin"
android:visibility="visible"/>
<android.support.constraint.ConstraintLayout
android:id="@+id/dashMarker"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginEnd="@dimen/legendItemPointMarkerMargin"
android:layout_marginTop="@dimen/legendItemPointMarkerMargin"
android:visibility="gone">
<com.scichart.charting.visuals.legend.LegendPointMarker
android:id="@+id/dashMarker1"
android:layout_width="10dp"
android:layout_height="0sp"
android:layout_gravity="center"
android:layout_margin="@dimen/legendItemPointMarkerMargin"
android:layout_marginTop="@dimen/legendItemPointMarkerMargin"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="5:2"
/>
<com.scichart.charting.visuals.legend.LegendPointMarker
android:id="@+id/dashMarker2"
android:layout_width="10dp"
android:layout_height="0sp"
android:layout_gravity="center"
android:layout_margin="@dimen/legendItemPointMarkerMargin"
android:layout_marginTop="@dimen/legendItemPointMarkerMargin"
app:layout_constraintLeft_toRightOf="@id/dashMarker1"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="5:2"
/>
<com.scichart.charting.visuals.legend.LegendPointMarker
android:id="@+id/dashMarker3"
android:layout_width="10dp"
android:layout_height="0sp"
android:layout_gravity="center"
android:layout_margin="@dimen/legendItemPointMarkerMargin"
android:layout_marginTop="@dimen/legendItemPointMarkerMargin"
app:layout_constraintLeft_toRightOf="@id/dashMarker2"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="5:2"
/>
</android.support.constraint.ConstraintLayout>
<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>
- Peter Brittain answered 5 years ago
- last edited 5 years ago
- You must login to post comments
Please login first to submit.